/* =========================================================
   RADWAN PORTFOLIO V2
   Japanese Case Study Typography
   Shared by Japanese V2 case studies
========================================================= */


/* =========================================================
   Scope
========================================================= */

html[lang="ja"] .jp-project-v2 {
    --container-width: 1280px;
}


/* =========================================================
   Japanese Heading Typography
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-hero h1,
html[lang="ja"] .jp-project-v2 .case-v2-section-heading h2,
html[lang="ja"] .jp-project-v2 .case-v2-two-column h2,
html[lang="ja"] .jp-project-v2 .case-v2-sticky-heading h2,
html[lang="ja"] .jp-project-v2 .case-v2-system-panel h3,
html[lang="ja"] .jp-project-v2 .case-v2-ownership-list h3,
html[lang="ja"] .jp-project-v2 .case-v2-decision-grid h3,
html[lang="ja"] .jp-project-v2 .case-v2-outcome h2,
html[lang="ja"] .jp-project-v2 .case-v2-skills h2 {
    word-break: auto-phrase;
    line-break: strict;
    overflow-wrap: normal;

    text-wrap: pretty;

    letter-spacing: -0.025em;
}


html[lang="ja"] .jp-project-v2 .case-v2-hero h1 {
    max-width: 920px;

    font-size:
        clamp(2.7rem, 4.35vw, 4.45rem);

    line-height: 1.22;
}


html[lang="ja"] .jp-project-v2 .case-v2-hero-lead {
    max-width: 780px;

    font-size:
        clamp(1rem, 1.3vw, 1.12rem);

    line-height: 2;
}


html[lang="ja"] .jp-project-v2 .case-v2-section-heading h2,
html[lang="ja"] .jp-project-v2 .case-v2-two-column h2,
html[lang="ja"] .jp-project-v2 .case-v2-sticky-heading h2,
html[lang="ja"] .jp-project-v2 .case-v2-outcome h2,
html[lang="ja"] .jp-project-v2 .case-v2-skills h2 {
    font-size:
        clamp(2.1rem, 3.35vw, 3.45rem);

    line-height: 1.35;
}


html[lang="ja"] .jp-project-v2 .case-v2-section-heading>p,
html[lang="ja"] .jp-project-v2 .case-v2-reading p,
html[lang="ja"] .jp-project-v2 .case-v2-validation-content p,
html[lang="ja"] .jp-project-v2 .case-v2-outcome-lead,
html[lang="ja"] .jp-project-v2 .case-v2-sticky-heading>p:last-child {
    line-height: 2;
}


html[lang="ja"] .jp-project-v2 .case-v2-system-panel h3 {
    font-size:
        clamp(1.9rem, 3vw, 3rem);

    line-height: 1.4;
}


html[lang="ja"] .jp-project-v2 .case-v2-ownership-list h3,
html[lang="ja"] .jp-project-v2 .case-v2-decision-grid h3 {
    font-size:
        clamp(1.45rem, 2.05vw, 1.95rem);

    line-height: 1.5;
}


/* =========================================================
   Labels
========================================================= */

html[lang="ja"] .jp-project-v2 .section-label,
html[lang="ja"] .jp-project-v2 .case-v2-system-detail-label,
html[lang="ja"] .jp-project-v2 .case-v2-ownership-list li div>p:first-child,
html[lang="ja"] .jp-project-v2 .case-v2-decision-grid article>p:first-of-type {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-project-v2 .case-v2-summary dt {
    text-transform: none;

    letter-spacing: 0.07em;
}


/* =========================================================
   Hero / Summary
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-hero-grid {
    grid-template-columns:
        minmax(0, 1.38fr) minmax(340px, 0.62fr);

    gap:
        clamp(3.5rem, 6vw, 6rem);
}


html[lang="ja"] .jp-project-v2 .case-v2-summary dd {
    line-height: 1.75;
}


/* =========================================================
   Proof Strip
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-proof-grid strong {
    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-proof-grid p {
    line-height: 1.85;
}


/* =========================================================
   Challenge / Ownership / Decisions
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-challenge-grid h3 {
    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-challenge-grid p,
html[lang="ja"] .jp-project-v2 .case-v2-ownership-list li div>p:last-child,
html[lang="ja"] .jp-project-v2 .case-v2-decision-grid article>p:last-child {
    line-height: 1.9;
}


/* =========================================================
   System Anatomy
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-system-toolbar>span {
    text-transform: none;

    letter-spacing: 0.05em;
}


html[lang="ja"] .jp-project-v2 .case-v2-system-node strong {
    font-size: 0.82rem;

    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-system-node small {
    line-height: 1.6;
}


html[lang="ja"] .jp-project-v2 .case-v2-system-panel>p {
    line-height: 1.95;
}


html[lang="ja"] .jp-project-v2 .case-v2-system-panel li {
    line-height: 1.75;
}


/* =========================================================
   Outcome / Skills / Disclosure
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-outcome-list span,
html[lang="ja"] .jp-project-v2 .case-v2-skills li {
    line-height: 1.65;
}


html[lang="ja"] .jp-project-v2 .case-v2-disclosure p {
    line-height: 1.9;
}


/* =========================================================
   Tablet
========================================================= */

@media (max-width: 980px) {

    html[lang="ja"] .jp-project-v2 .case-v2-hero-grid,
    html[lang="ja"] .jp-project-v2 .case-v2-section-heading,
    html[lang="ja"] .jp-project-v2 .case-v2-two-column,
    html[lang="ja"] .jp-project-v2 .case-v2-ownership-grid,
    html[lang="ja"] .jp-project-v2 .case-v2-outcome-grid,
    html[lang="ja"] .jp-project-v2 .case-v2-skills-grid {
        grid-template-columns: 1fr;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-hero-grid {
        gap: 4rem;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-summary {
        max-width: 680px;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-sticky-heading {
        position: static;
    }

}


/* =========================================================
   Mobile
========================================================= */

@media (max-width: 700px) {

    html[lang="ja"] .jp-project-v2 .case-v2-hero {
        padding-block:
            4.6rem 5.4rem;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-hero h1 {
        font-size:
            clamp(2.05rem, 8.8vw, 2.8rem);

        line-height: 1.42;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-hero-lead {
        font-size: 0.98rem;

        line-height: 1.95;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-hero-actions {
        width: 100%;

        align-items: stretch;

        flex-direction: column;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-hero-actions .button {
        width: 100%;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-section-heading h2,
    html[lang="ja"] .jp-project-v2 .case-v2-two-column h2,
    html[lang="ja"] .jp-project-v2 .case-v2-sticky-heading h2,
    html[lang="ja"] .jp-project-v2 .case-v2-outcome h2,
    html[lang="ja"] .jp-project-v2 .case-v2-skills h2 {
        font-size:
            clamp(1.8rem, 7.3vw, 2.4rem);

        line-height: 1.5;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-system-panel h3 {
        font-size:
            clamp(1.7rem, 7vw, 2.25rem);

        line-height: 1.5;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-system-toolbar {
        align-items: flex-start;

        flex-direction: column;

        height: auto;

        gap: 0.7rem;

        padding-block: 0.85rem;
    }

}


/* =========================================================
   Small Mobile
========================================================= */

@media (max-width: 420px) {

    html[lang="ja"] .jp-project-v2 .case-v2-hero h1 {
        font-size: 2rem;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-system-node {
        min-height: 92px;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-system-node strong {
        font-size: 0.74rem;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-system-node small {
        font-size: 0.54rem;
    }

}


/* =========================================================
   Reduced Motion
========================================================= */

@media (prefers-reduced-motion: reduce) {

    html[lang="ja"] .jp-project-v2 .case-v2-system-node {
        transition: none;
    }

}


/* =========================================================
   Multilingual Case Study
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-language-detail-label {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-project-v2 .case-v2-language-panel h3 {
    word-break: auto-phrase;
    line-break: strict;
    overflow-wrap: normal;

    text-wrap: pretty;

    font-size:
        clamp(1.8rem, 2.8vw, 2.75rem);

    line-height: 1.42;

    letter-spacing: -0.025em;
}


html[lang="ja"] .jp-project-v2 .case-v2-language-panel>p {
    line-height: 1.95;
}


html[lang="ja"] .jp-project-v2 .case-v2-language-panel li {
    line-height: 1.75;
}


html[lang="ja"] .jp-project-v2 .case-v2-language-screen-heading strong {
    line-height: 1.55;
}


html[lang="ja"] .jp-project-v2 .case-v2-language-screen-heading p {
    line-height: 1.75;
}


html[lang="ja"] .jp-project-v2 .case-v2-language-tabs button {
    font-family:
        Inter,
        "Helvetica Neue",
        Arial,
        sans-serif;
}


@media (max-width: 700px) {

    html[lang="ja"] .jp-project-v2 .case-v2-language-panel h3 {
        font-size:
            clamp(1.65rem, 6.8vw, 2.2rem);

        line-height: 1.5;
    }

}


/* =========================================================
   E-Poster Case Study
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-eposter-detail-label {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-panel h3 {
    word-break: auto-phrase;
    line-break: strict;
    overflow-wrap: normal;

    text-wrap: pretty;

    font-size:
        clamp(1.8rem, 2.8vw, 2.75rem);

    line-height: 1.42;

    letter-spacing: -0.025em;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-panel>p {
    line-height: 1.95;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-panel li {
    line-height: 1.75;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-modebar button {
    text-transform: none;

    letter-spacing: 0.03em;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-detail h3 {
    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-search-large strong,
html[lang="ja"] .jp-project-v2 .case-v2-eposter-staff strong,
html[lang="ja"] .jp-project-v2 .case-v2-eposter-results strong {
    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-eposter-staff p {
    line-height: 1.7;
}


@media (max-width: 700px) {

    html[lang="ja"] .jp-project-v2 .case-v2-eposter-panel h3 {
        font-size:
            clamp(1.65rem, 6.8vw, 2.2rem);

        line-height: 1.5;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-eposter-modebar button {
        font-size: 0.62rem;
    }

}


/* =========================================================
   International Programme Case Study
========================================================= */

html[lang="ja"] .jp-project-v2 .case-v2-programme-detail-label {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-panel h3 {
    word-break: auto-phrase;
    line-break: strict;
    overflow-wrap: normal;

    text-wrap: pretty;

    font-size:
        clamp(1.8rem, 2.8vw, 2.75rem);

    line-height: 1.42;

    letter-spacing: -0.025em;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-panel>p {
    line-height: 1.95;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-panel li {
    line-height: 1.75;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-modebar button {
    text-transform: none;

    letter-spacing: 0.02em;

    line-height: 1.45;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-dashboard strong,
html[lang="ja"] .jp-project-v2 .case-v2-programme-form-view strong,
html[lang="ja"] .jp-project-v2 .case-v2-programme-schedule strong,
html[lang="ja"] .jp-project-v2 .case-v2-programme-onsite strong,
html[lang="ja"] .jp-project-v2 .case-v2-programme-followup strong {
    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-dashboard p,
html[lang="ja"] .jp-project-v2 .case-v2-programme-onsite p {
    line-height: 1.7;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-form label span,
html[lang="ja"] .jp-project-v2 .case-v2-programme-form-status span,
html[lang="ja"] .jp-project-v2 .case-v2-programme-tracker span {
    line-height: 1.5;
}


html[lang="ja"] .jp-project-v2 .case-v2-programme-topbar small {
    line-height: 1.5;
}


@media (max-width: 700px) {

    html[lang="ja"] .jp-project-v2 .case-v2-programme-panel h3 {
        font-size:
            clamp(1.65rem, 6.8vw, 2.2rem);

        line-height: 1.5;
    }


    html[lang="ja"] .jp-project-v2 .case-v2-programme-modebar button {
        font-size: 0.58rem;
    }

}