/* =========================================================
   Japanese Global Typography
========================================================= */

html[lang="ja"] body {
    font-family:
        "Noto Sans JP",
        "Hiragino Kaku Gothic ProN",
        "Hiragino Sans",
        "Yu Gothic",
        "YuGothic",
        Meiryo,
        sans-serif;

    font-feature-settings:
        "palt"1,
        "kern"1;

    letter-spacing: 0;
}


/* =========================================================
   Japanese Line Breaking
========================================================= */

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] h4,
html[lang="ja"] .large-text,
html[lang="ja"] .project-hero-lead,
html[lang="ja"] .work-project-lead,
html[lang="ja"] .featured-project-summary {
    word-break: auto-phrase;
    line-break: strict;
    overflow-wrap: normal;
    text-wrap: balance;
}

html[lang="ja"] p,
html[lang="ja"] li,
html[lang="ja"] dd,
html[lang="ja"] strong,
html[lang="ja"] a,
html[lang="ja"] label {
    line-break: strict;
    overflow-wrap: break-word;
    text-wrap: pretty;
}


/*
Fallback for browsers that do not yet support auto-phrase.
Headings will avoid arbitrary character-by-character breaks.
*/

@supports not (word-break: auto-phrase) {

    html[lang="ja"] h1,
    html[lang="ja"] h2,
    html[lang="ja"] h3,
    html[lang="ja"] h4 {
        word-break: keep-all;
        overflow-wrap: normal;
    }

}


/* =========================================================
   Shared Japanese Heading Scale
========================================================= */

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] h4 {
    letter-spacing: -0.025em;
}

html[lang="ja"] h1 {
    font-size: clamp(2.8rem, 4.7vw, 4.8rem);
    line-height: 1.18;
}

html[lang="ja"] h2 {
    font-size: clamp(2rem, 3.5vw, 3.25rem);
    line-height: 1.3;
}

html[lang="ja"] h3 {
    line-height: 1.42;
}

html[lang="ja"] h4 {
    line-height: 1.55;
}

html[lang="ja"] p {
    line-height: 1.9;
}

html[lang="ja"] .large-text {
    font-size: clamp(1.08rem, 1.65vw, 1.42rem);
    line-height: 1.9;
    letter-spacing: -0.012em;
}

html[lang="ja"] .section-label,
html[lang="ja"] .eyebrow {
    letter-spacing: 0.1em;
    line-height: 1.7;
}

html[lang="ja"] .tag-list li {
    line-height: 1.45;
}


/* =========================================================
   Japanese Header
========================================================= */

html[lang="ja"] .site-navigation {
    gap: 1.7rem;
}

html[lang="ja"] .site-navigation a {
    font-size: 0.8rem;
    letter-spacing: 0.02em;
}

html[lang="ja"] .language-link {
    font-size: 0.76rem;
}


/* =========================================================
   Japanese Homepage
========================================================= */

html[lang="ja"] .hero {
    min-height: auto;
    padding-block:
        clamp(5rem, 8vw, 7.5rem);
}

html[lang="ja"] .hero-grid {
    grid-template-columns:
        minmax(0, 1.55fr) minmax(270px, 0.45fr);

    align-items: center;
    gap: clamp(3rem, 7vw, 6rem);
}

html[lang="ja"] .hero-content {
    max-width: 930px;
}

html[lang="ja"] .hero h1 {
    max-width: 860px;
    margin-bottom: 1.8rem;
    font-size: clamp(2.8rem, 4.6vw, 4.65rem);
    line-height: 1.18;
    letter-spacing: -0.035em;
}

html[lang="ja"] .hero-description {
    max-width: 760px;
    font-size: clamp(1rem, 1.25vw, 1.1rem);
    line-height: 2;
}

html[lang="ja"] .hero-summary {
    min-width: 0;
}

html[lang="ja"] .summary-item {
    padding-block: 1.15rem;
}

html[lang="ja"] .summary-item span {
    letter-spacing: 0.07em;
}

html[lang="ja"] .summary-item strong {
    font-size: 0.86rem;
    line-height: 1.8;
}


/* =========================================================
   Homepage Proof Section
========================================================= */

html[lang="ja"] .proof-item {
    min-width: 0;
    gap: 1rem;
    padding-inline: 1.4rem;
}

html[lang="ja"] .proof-title {
    font-size: 0.86rem;
    line-height: 1.65;
}

html[lang="ja"] .proof-item p:last-child {
    font-size: 0.79rem;
    line-height: 1.8;
}


/* =========================================================
   Homepage Profile
========================================================= */

html[lang="ja"] .profile-grid {
    grid-template-columns:
        minmax(260px, 0.65fr) minmax(0, 1.35fr);

    gap: clamp(3.5rem, 8vw, 7rem);
}

html[lang="ja"] .profile-content h2 {
    max-width: 760px;
    margin-bottom: 1.8rem;
    font-size: clamp(2.05rem, 3.3vw, 3.15rem);
    line-height: 1.32;
}

html[lang="ja"] .profile-content .large-text {
    max-width: 780px;
    font-size: clamp(1.08rem, 1.55vw, 1.35rem);
    line-height: 1.95;
}

html[lang="ja"] .profile-content>p:not(.section-label):not(.large-text) {
    max-width: 760px;
    line-height: 2;
}

html[lang="ja"] .profile-caption {
    line-height: 1.8;
}


/* =========================================================
   Homepage Section Headings
========================================================= */

html[lang="ja"] .section-heading h2 {
    max-width: 800px;
    font-size: clamp(2rem, 3.25vw, 3.1rem);
    line-height: 1.32;
}


/* =========================================================
   Homepage Featured Projects
========================================================= */

html[lang="ja"] .featured-project {
    grid-template-columns:
        minmax(145px, 0.28fr) minmax(0, 1.72fr);

    gap: clamp(2.5rem, 6vw, 5rem);
}

html[lang="ja"] .featured-project-index p {
    letter-spacing: 0.07em;
    line-height: 1.75;
}

html[lang="ja"] .featured-project-main h3 {
    max-width: 760px;
    margin-bottom: 1.3rem;
    font-size: clamp(1.8rem, 2.9vw, 2.75rem);
    line-height: 1.38;
}

html[lang="ja"] .featured-project-summary {
    max-width: 850px;
    font-size: clamp(1rem, 1.25vw, 1.1rem);
    line-height: 1.95;
}

html[lang="ja"] .project-detail-grid {
    gap: clamp(2rem, 4vw, 3.5rem);
}

html[lang="ja"] .project-detail-grid p {
    line-height: 1.95;
}

html[lang="ja"] .detail-label {
    letter-spacing: 0.08em;
}


/* =========================================================
   Homepage Capabilities
========================================================= */

html[lang="ja"] .capability-card {
    min-height: 400px;
}

html[lang="ja"] .capability-card h3 {
    max-width: 470px;
    font-size: clamp(1.35rem, 1.9vw, 1.7rem);
    line-height: 1.48;
}

html[lang="ja"] .capability-card>p {
    line-height: 1.95;
}

html[lang="ja"] .capability-card li {
    line-height: 1.65;
}


/* =========================================================
   Homepage Contribution
========================================================= */

html[lang="ja"] .contribution-grid {
    grid-template-columns:
        minmax(0, 0.75fr) minmax(0, 1.25fr);

    gap: clamp(3rem, 8vw, 7rem);
}

html[lang="ja"] .contribution-heading h2 {
    max-width: 580px;
    font-size: clamp(2rem, 3.1vw, 3rem);
    line-height: 1.34;
}

html[lang="ja"] .contribution-heading>p:last-child {
    line-height: 2;
}

html[lang="ja"] .contribution-list h3 {
    font-size: 1.2rem;
    line-height: 1.5;
}

html[lang="ja"] .contribution-list p {
    line-height: 1.95;
}


/* =========================================================
   Shared Japanese Contact Panel
========================================================= */

html[lang="ja"] .contact-panel h2 {
    max-width: 800px;
    font-size: clamp(2rem, 3.2vw, 3.1rem);
    line-height: 1.34;
}

html[lang="ja"] .contact-panel p:last-child {
    line-height: 1.95;
}


/* =========================================================
   Work Listing Hero
========================================================= */

html[lang="ja"] .work-hero {
    padding-block:
        clamp(5rem, 9vw, 8rem) clamp(4.5rem, 8vw, 7rem);
}

html[lang="ja"] .work-hero-grid {
    grid-template-columns:
        minmax(0, 1.22fr) minmax(320px, 0.78fr);

    gap: clamp(3rem, 7vw, 6rem);
}

html[lang="ja"] .work-hero-heading h1 {
    max-width: 820px;
    font-size: clamp(2.7rem, 4.5vw, 4.45rem);
    line-height: 1.2;
    letter-spacing: -0.035em;
}

html[lang="ja"] .work-hero-introduction {
    max-width: 680px;
}

html[lang="ja"] .work-hero-introduction .large-text {
    font-size: clamp(1.08rem, 1.5vw, 1.34rem);
    line-height: 1.9;
}


/* =========================================================
   Work Page Navigation
========================================================= */

html[lang="ja"] .work-section-navigation-inner {
    gap: 1.7rem;
}

html[lang="ja"] .work-section-navigation a {
    letter-spacing: 0.04em;
    text-transform: none;
}


/* =========================================================
   Work Page Project Entries
========================================================= */

html[lang="ja"] .work-project {
    grid-template-columns:
        minmax(190px, 0.34fr) minmax(0, 1.66fr);

    gap: clamp(3rem, 7vw, 6rem);
}

html[lang="ja"] .work-project-type {
    letter-spacing: 0.08em;
    line-height: 1.75;
    text-transform: none;
}

html[lang="ja"] .work-project-facts dt {
    letter-spacing: 0.07em;
    text-transform: none;
}

html[lang="ja"] .work-project-facts dd {
    line-height: 1.75;
}

html[lang="ja"] .work-project-kicker,
html[lang="ja"] .additional-work-category {
    letter-spacing: 0.08em;
    text-transform: none;
}

html[lang="ja"] .work-project-content h3 {
    max-width: 790px;
    margin-bottom: 1.4rem;
    font-size: clamp(2rem, 3.25vw, 3.2rem);
    line-height: 1.35;
}

html[lang="ja"] .work-project-lead {
    max-width: 850px;
    font-size: clamp(1.04rem, 1.35vw, 1.18rem);
    line-height: 1.95;
}

html[lang="ja"] .work-project-columns {
    gap: clamp(2rem, 4vw, 3.5rem);
}

html[lang="ja"] .work-project-columns h4 {
    letter-spacing: 0.08em;
    line-height: 1.6;
    text-transform: none;
}

html[lang="ja"] .work-project-columns p,
html[lang="ja"] .work-project-columns li {
    line-height: 1.9;
}

html[lang="ja"] .work-project-contribution {
    grid-template-columns: 110px 1fr;
}

html[lang="ja"] .work-project-contribution span {
    letter-spacing: 0.08em;
    text-transform: none;
}

html[lang="ja"] .work-project-contribution p {
    line-height: 1.95;
}


/* =========================================================
   Project Archive
========================================================= */

html[lang="ja"] .project-archive-heading {
    grid-template-columns:
        minmax(0, 1.2fr) minmax(300px, 0.8fr);

    gap: clamp(2.5rem, 6vw, 5rem);
}

html[lang="ja"] .project-archive-heading h2 {
    max-width: 740px;
    font-size: clamp(2rem, 3.15vw, 3rem);
    line-height: 1.34;
}

html[lang="ja"] .project-filter-button {
    font-size: 0.72rem;
    line-height: 1.4;
}

html[lang="ja"] .project-archive-grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

html[lang="ja"] .project-archive-card {
    min-height: 380px;
}

html[lang="ja"] .project-archive-meta {
    letter-spacing: 0.05em;
    line-height: 1.65;
    text-transform: none;
}

html[lang="ja"] .project-archive-card h3 {
    font-size: clamp(1.25rem, 1.8vw, 1.58rem);
    line-height: 1.48;
}

html[lang="ja"] .project-archive-card>p {
    font-size: 0.88rem;
    line-height: 1.9;
}


/* =========================================================
   Additional Work
========================================================= */

html[lang="ja"] .additional-work-card h3 {
    max-width: 500px;
    font-size: clamp(1.3rem, 1.9vw, 1.65rem);
    line-height: 1.48;
}

html[lang="ja"] .additional-work-card>p:not(.additional-work-category) {
    line-height: 1.9;
}


/* =========================================================
   Project Detail Hero
========================================================= */

html[lang="ja"] .project-hero {
    padding-block:
        clamp(3.5rem, 7vw, 6rem) clamp(4.5rem, 8vw, 7rem);
}

html[lang="ja"] .project-breadcrumb {
    margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
    line-height: 1.7;
}

html[lang="ja"] .project-hero-grid {
    grid-template-columns:
        minmax(0, 1.4fr) minmax(300px, 0.6fr);

    align-items: end;
    gap: clamp(3rem, 7vw, 6rem);
}

html[lang="ja"] .project-hero-content h1 {
    max-width: 880px;
    margin-bottom: 1.6rem;
    font-size: clamp(2.7rem, 4.4vw, 4.35rem);
    line-height: 1.2;
    letter-spacing: -0.035em;
}

html[lang="ja"] .project-hero-lead {
    max-width: 820px;
    font-size: clamp(1.04rem, 1.35vw, 1.2rem);
    line-height: 1.95;
}

html[lang="ja"] .project-summary dt {
    letter-spacing: 0.07em;
    text-transform: none;
}

html[lang="ja"] .project-summary dd {
    font-size: 0.88rem;
    line-height: 1.75;
}


/* =========================================================
   Project Detail Shared Headings
========================================================= */

html[lang="ja"] .project-section-heading {
    max-width: 820px;
}

html[lang="ja"] .project-section-heading h2 {
    max-width: 780px;
    font-size: clamp(2rem, 3.2vw, 3rem);
    line-height: 1.35;
}


/* =========================================================
   Project Overview / Outcome
========================================================= */

html[lang="ja"] .project-overview-grid,
html[lang="ja"] .project-outcome-grid {
    grid-template-columns:
        minmax(0, 0.75fr) minmax(0, 1.25fr);

    gap: clamp(3rem, 7vw, 6rem);
}

html[lang="ja"] .project-overview-grid h2,
html[lang="ja"] .project-outcome-grid h2 {
    max-width: 580px;
    font-size: clamp(1.95rem, 3vw, 2.8rem);
    line-height: 1.38;
}

html[lang="ja"] .project-overview-content,
html[lang="ja"] .project-outcome-content {
    max-width: 760px;
}

html[lang="ja"] .project-overview-content .large-text,
html[lang="ja"] .project-outcome-content .large-text {
    font-size: clamp(1.08rem, 1.45vw, 1.3rem);
    line-height: 1.95;
}

html[lang="ja"] .project-outcome-content li {
    line-height: 1.75;
}


/* =========================================================
   Project Challenge Cards
========================================================= */

html[lang="ja"] .project-challenge-card {
    min-height: 310px;
}

html[lang="ja"] .project-challenge-card>span {
    margin-bottom: 3rem;
}

html[lang="ja"] .project-challenge-card h3 {
    max-width: 330px;
    font-size: clamp(1.25rem, 1.75vw, 1.58rem);
    line-height: 1.5;
}

html[lang="ja"] .project-challenge-card p {
    font-size: 0.9rem;
    line-height: 1.9;
}


/* =========================================================
   Project Responsibilities
========================================================= */

html[lang="ja"] .project-responsibility-grid {
    grid-template-columns:
        minmax(0, 0.7fr) minmax(0, 1.3fr);

    gap: clamp(3rem, 7vw, 6rem);
}

html[lang="ja"] .project-sticky-heading h2 {
    max-width: 560px;
    font-size: clamp(1.95rem, 3vw, 2.8rem);
    line-height: 1.38;
}

html[lang="ja"] .project-sticky-heading>p:last-child {
    line-height: 1.95;
}

html[lang="ja"] .responsibility-list h3 {
    font-size: 1.18rem;
    line-height: 1.5;
}

html[lang="ja"] .responsibility-list p {
    max-width: 680px;
    font-size: 0.92rem;
    line-height: 1.95;
}


/* =========================================================
   Project Solution Cards
========================================================= */

html[lang="ja"] .solution-card {
    min-height: 280px;
}

html[lang="ja"] .solution-label {
    margin-bottom: 2.4rem;
    letter-spacing: 0.08em;
    text-transform: none;
}

html[lang="ja"] .solution-card h3 {
    max-width: 470px;
    font-size: clamp(1.3rem, 1.9vw, 1.68rem);
    line-height: 1.5;
}

html[lang="ja"] .solution-card p:last-child {
    line-height: 1.9;
}


/* =========================================================
   Project Process
========================================================= */

html[lang="ja"] .project-process-list li {
    grid-template-columns: 90px 1fr;
    gap: clamp(2rem, 5vw, 4.5rem);
}

html[lang="ja"] .project-process-list h3 {
    font-size: 1.18rem;
    line-height: 1.5;
}

html[lang="ja"] .project-process-list p {
    max-width: 720px;
    line-height: 1.95;
}


/* =========================================================
   Project Skills
========================================================= */

html[lang="ja"] .project-skills-grid {
    grid-template-columns: 180px 1fr;
}

html[lang="ja"] .project-skill-list li {
    line-height: 1.45;
}


/* =========================================================
   Project Navigation
========================================================= */

html[lang="ja"] .project-navigation a {
    min-height: 190px;
}

html[lang="ja"] .project-navigation span {
    letter-spacing: 0.08em;
    text-transform: none;
}

html[lang="ja"] .project-navigation strong {
    max-width: 480px;
    font-size: clamp(1.2rem, 2vw, 1.65rem);
    line-height: 1.45;
}


/* =========================================================
   Future Japanese About Page
========================================================= */

html[lang="ja"] .about-hero-heading h1 {
    max-width: 860px;
    font-size: clamp(2.7rem, 4.5vw, 4.4rem);
    line-height: 1.2;
    letter-spacing: -0.035em;
}

html[lang="ja"] .about-profile-content h2,
html[lang="ja"] .about-approach-heading h2,
html[lang="ja"] .about-japan-grid h2,
html[lang="ja"] .about-direction-content h2 {
    font-size: clamp(1.95rem, 3.1vw, 2.9rem);
    line-height: 1.38;
}

html[lang="ja"] .about-strength-card h3 {
    font-size: clamp(1.3rem, 1.9vw, 1.7rem);
    line-height: 1.5;
}

html[lang="ja"] .about-approach-list h3 {
    font-size: 1.18rem;
    line-height: 1.5;
}

html[lang="ja"] .about-strength-card p,
html[lang="ja"] .about-approach-list p,
html[lang="ja"] .about-japan-content p {
    line-height: 1.95;
}


/* =========================================================
   Future Japanese Resume Page
========================================================= */

html[lang="ja"] .resume-hero-heading h1 {
    max-width: 860px;
    font-size: clamp(2.7rem, 4.5vw, 4.4rem);
    line-height: 1.2;
    letter-spacing: -0.035em;
}

html[lang="ja"] .resume-section-navigation a {
    letter-spacing: 0.04em;
    text-transform: none;
}

html[lang="ja"] .resume-section-heading h2 {
    font-size: clamp(1.95rem, 3.1vw, 2.9rem);
    line-height: 1.38;
}

html[lang="ja"] .resume-experience-content h3 {
    font-size: clamp(1.55rem, 2.5vw, 2.2rem);
    line-height: 1.42;
}

html[lang="ja"] .resume-experience-lead {
    line-height: 1.9;
}

html[lang="ja"] .resume-achievement-card h3,
html[lang="ja"] .resume-skill-group h3,
html[lang="ja"] .resume-language-list h3 {
    line-height: 1.5;
}

html[lang="ja"] .resume-achievement-card p,
html[lang="ja"] .resume-experience-content li,
html[lang="ja"] .resume-language-list p {
    line-height: 1.85;
}


/* =========================================================
   Future Japanese Contact Page
========================================================= */

html[lang="ja"] .contact-hero-heading h1 {
    max-width: 860px;
    font-size: clamp(2.7rem, 4.5vw, 4.4rem);
    line-height: 1.2;
    letter-spacing: -0.035em;
}

html[lang="ja"] .contact-details-heading h2,
html[lang="ja"] .contact-form-heading h2,
html[lang="ja"] .contact-roles-grid h2,
html[lang="ja"] .contact-alternative-panel h2 {
    font-size: clamp(1.95rem, 3.1vw, 2.9rem);
    line-height: 1.38;
}

html[lang="ja"] .contact-detail-item>a,
html[lang="ja"] .contact-detail-value {
    line-height: 1.55;
}

html[lang="ja"] .contact-role-list h3 {
    font-size: 1.18rem;
    line-height: 1.5;
}

html[lang="ja"] .contact-success-panel h1 {
    font-size: clamp(2.4rem, 4.5vw, 4rem);
    line-height: 1.22;
}


/* =========================================================
   Tablet
========================================================= */

@media (max-width: 1100px) {

    html[lang="ja"] .project-archive-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


@media (max-width: 980px) {

    html[lang="ja"] .hero-grid,
    html[lang="ja"] .work-hero-grid,
    html[lang="ja"] .project-hero-grid,
    html[lang="ja"] .project-overview-grid,
    html[lang="ja"] .project-responsibility-grid,
    html[lang="ja"] .project-outcome-grid {
        grid-template-columns: 1fr;
    }

    html[lang="ja"] .hero h1,
    html[lang="ja"] .work-hero-heading h1,
    html[lang="ja"] .project-hero-content h1 {
        max-width: 820px;
    }

    html[lang="ja"] .profile-grid,
    html[lang="ja"] .contribution-grid {
        grid-template-columns: 1fr;
    }

    html[lang="ja"] .featured-project {
        grid-template-columns:
            140px minmax(0, 1fr);

        gap: 2.7rem;
    }

    html[lang="ja"] .work-project {
        grid-template-columns:
            155px minmax(0, 1fr);

        gap: 2.8rem;
    }

    html[lang="ja"] .project-archive-heading {
        grid-template-columns: 1fr;
    }

    html[lang="ja"] .project-sticky-heading {
        position: static;
    }

}


/* =========================================================
   Mobile
========================================================= */

@media (max-width: 700px) {

    html[lang="ja"] .section {
        padding-block: 4.4rem;
    }

    html[lang="ja"] .hero,
    html[lang="ja"] .work-hero,
    html[lang="ja"] .about-hero,
    html[lang="ja"] .resume-hero,
    html[lang="ja"] .contact-hero {
        padding-block: 4.2rem;
    }

    html[lang="ja"] .project-hero {
        padding-block: 3.2rem 4.5rem;
    }

    html[lang="ja"] .hero h1,
    html[lang="ja"] .work-hero-heading h1,
    html[lang="ja"] .project-hero-content h1,
    html[lang="ja"] .about-hero-heading h1,
    html[lang="ja"] .resume-hero-heading h1,
    html[lang="ja"] .contact-hero-heading h1 {
        max-width: none;
        font-size: clamp(2.15rem, 9vw, 3rem);
        line-height: 1.25;
        letter-spacing: -0.025em;
    }

    html[lang="ja"] .profile-content h2,
    html[lang="ja"] .section-heading h2,
    html[lang="ja"] .contribution-heading h2,
    html[lang="ja"] .contact-panel h2,
    html[lang="ja"] .project-section-heading h2,
    html[lang="ja"] .project-overview-grid h2,
    html[lang="ja"] .project-outcome-grid h2,
    html[lang="ja"] .project-sticky-heading h2,
    html[lang="ja"] .about-profile-content h2,
    html[lang="ja"] .about-approach-heading h2,
    html[lang="ja"] .about-japan-grid h2,
    html[lang="ja"] .about-direction-content h2,
    html[lang="ja"] .resume-section-heading h2,
    html[lang="ja"] .contact-details-heading h2,
    html[lang="ja"] .contact-form-heading h2,
    html[lang="ja"] .contact-roles-grid h2 {
        font-size: clamp(1.7rem, 7vw, 2.25rem);
        line-height: 1.4;
    }

    html[lang="ja"] .large-text,
    html[lang="ja"] .profile-content .large-text,
    html[lang="ja"] .project-overview-content .large-text,
    html[lang="ja"] .project-outcome-content .large-text {
        font-size: 1.04rem;
        line-height: 1.95;
    }

    html[lang="ja"] .featured-project,
    html[lang="ja"] .work-project {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    html[lang="ja"] .featured-project-main h3,
    html[lang="ja"] .work-project-content h3 {
        font-size: clamp(1.65rem, 7vw, 2.2rem);
        line-height: 1.42;
    }

    html[lang="ja"] .project-detail-grid,
    html[lang="ja"] .work-project-columns,
    html[lang="ja"] .project-archive-grid {
        grid-template-columns: 1fr;
    }

    html[lang="ja"] .work-project-contribution {
        grid-template-columns: 1fr;
        gap: 0.7rem;
    }

    html[lang="ja"] .project-challenge-card,
    html[lang="ja"] .solution-card,
    html[lang="ja"] .project-archive-card {
        min-height: auto;
    }

    html[lang="ja"] .project-challenge-card h3,
    html[lang="ja"] .solution-card h3,
    html[lang="ja"] .project-archive-card h3,
    html[lang="ja"] .additional-work-card h3 {
        font-size: 1.3rem;
        line-height: 1.5;
    }

    html[lang="ja"] .project-process-list li {
        grid-template-columns: 42px 1fr;
        gap: 1rem;
    }

    html[lang="ja"] .project-skills-grid {
        grid-template-columns: 1fr;
    }

    html[lang="ja"] .project-navigation strong {
        font-size: 1.22rem;
        line-height: 1.5;
    }

}


/* =========================================================
   Small Mobile
========================================================= */

@media (max-width: 420px) {

    html[lang="ja"] .hero h1,
    html[lang="ja"] .work-hero-heading h1,
    html[lang="ja"] .project-hero-content h1,
    html[lang="ja"] .about-hero-heading h1,
    html[lang="ja"] .resume-hero-heading h1,
    html[lang="ja"] .contact-hero-heading h1 {
        font-size: 2rem;
    }

    html[lang="ja"] .featured-project-main h3,
    html[lang="ja"] .work-project-content h3 {
        font-size: 1.65rem;
    }

    html[lang="ja"] .project-challenge-card,
    html[lang="ja"] .solution-card,
    html[lang="ja"] .project-archive-card,
    html[lang="ja"] .additional-work-card {
        padding: 1.4rem;
    }

}