/* =========================================================
   RADWAN PORTFOLIO V2
   Japanese About Page
========================================================= */


/* =========================================================
   Scope
========================================================= */

html[lang="ja"] .jp-about-v2 {
    --container-width: 1280px;
}


/* =========================================================
   Japanese Text Flow
========================================================= */

html[lang="ja"] .jp-about-v2 h1,
html[lang="ja"] .jp-about-v2 h2,
html[lang="ja"] .jp-about-v2 h3 {
    word-break: auto-phrase;
    line-break: strict;
    overflow-wrap: normal;

    text-wrap: pretty;

    letter-spacing: -0.025em;
}


html[lang="ja"] .jp-about-v2 p,
html[lang="ja"] .jp-about-v2 li,
html[lang="ja"] .jp-about-v2 small,
html[lang="ja"] .jp-about-v2 strong {
    line-break: strict;
}


/* =========================================================
   Hero
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-hero h1 {
    max-width: 900px;

    font-size:
        clamp(2.9rem, 4.6vw, 4.7rem);

    line-height: 1.2;
}


html[lang="ja"] .jp-about-v2 .about-v2-hero-lead {
    max-width: 790px;

    font-size:
        clamp(1rem, 1.35vw, 1.14rem);

    line-height: 2;
}


html[lang="ja"] .jp-about-v2 .about-v2-hero-meta p,
html[lang="ja"] .jp-about-v2 .about-v2-hero-meta span {
    text-transform: none;

    letter-spacing: 0.1em;
}


html[lang="ja"] .jp-about-v2 .about-v2-signal-heading>span {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-about-v2 .about-v2-signal-list strong {
    line-height: 1.55;
}


html[lang="ja"] .jp-about-v2 .about-v2-signal-list small {
    line-height: 1.7;
}


/* =========================================================
   Main Headings
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-profile-content h2,
html[lang="ja"] .jp-about-v2 .about-v2-section-heading h2,
html[lang="ja"] .jp-about-v2 .about-v2-sticky-heading h2,
html[lang="ja"] .jp-about-v2 .about-v2-japan h2,
html[lang="ja"] .jp-about-v2 .about-v2-direction h2,
html[lang="ja"] .jp-about-v2 .about-v2-cta h2 {
    font-size:
        clamp(2.15rem, 3.5vw, 3.65rem);

    line-height: 1.35;
}


/* =========================================================
   Profile
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-profile-content .large-text {
    line-height: 1.95;
}


html[lang="ja"] .jp-about-v2 .about-v2-profile-content>p:not(.section-label):not(.large-text) {
    line-height: 2;
}


html[lang="ja"] .jp-about-v2 .about-v2-profile-facts span {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-about-v2 .about-v2-profile-facts strong {
    line-height: 1.7;
}


/* =========================================================
   Difference
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-card-kicker {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-about-v2 .about-v2-difference-grid h3 {
    font-size:
        clamp(1.45rem, 1.95vw, 1.82rem);

    line-height: 1.5;
}


html[lang="ja"] .jp-about-v2 .about-v2-difference-grid article>p:not(.about-v2-card-kicker) {
    line-height: 1.9;
}


html[lang="ja"] .jp-about-v2 .about-v2-difference-grid li {
    line-height: 1.75;
}


/* =========================================================
   Approach
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-approach-list li div>p:first-child {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-about-v2 .about-v2-approach-list h3 {
    font-size:
        clamp(1.45rem, 2vw, 1.9rem);

    line-height: 1.5;
}


html[lang="ja"] .jp-about-v2 .about-v2-approach-list li div>p:last-child,
html[lang="ja"] .jp-about-v2 .about-v2-sticky-heading>p:last-child {
    line-height: 1.95;
}


/* =========================================================
   Contexts
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-context-grid h3 {
    font-size:
        clamp(1.55rem, 2.1vw, 1.95rem);

    line-height: 1.5;
}


html[lang="ja"] .jp-about-v2 .about-v2-context-grid article>p:not(:first-of-type) {
    line-height: 1.9;
}


/* =========================================================
   Working in Japan
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-japan-content p {
    line-height: 2;
}


html[lang="ja"] .jp-about-v2 .about-v2-bridge span {
    font-size: 0.76rem;

    line-height: 1.5;

    text-align: center;
}


/* =========================================================
   Capabilities
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-capability-grid article>p {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-about-v2 .about-v2-capability-grid h3 {
    font-size:
        clamp(1.35rem, 1.8vw, 1.7rem);

    line-height: 1.5;
}


html[lang="ja"] .jp-about-v2 .about-v2-capability-grid li {
    line-height: 1.7;
}


/* =========================================================
   Career Direction
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-direction .large-text,
html[lang="ja"] .jp-about-v2 .about-v2-direction-grid>div>p:last-child {
    line-height: 2;
}


html[lang="ja"] .jp-about-v2 .about-v2-role-heading span {
    text-transform: none;

    letter-spacing: 0.08em;
}


html[lang="ja"] .jp-about-v2 .about-v2-role-panel li strong {
    line-height: 1.6;
}


/* =========================================================
   CTA
========================================================= */

html[lang="ja"] .jp-about-v2 .about-v2-cta p:last-child {
    line-height: 1.95;
}


/* =========================================================
   Tablet
========================================================= */

@media (max-width: 980px) {

    html[lang="ja"] .jp-about-v2 .about-v2-hero-grid {
        gap: 4rem;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-signal-panel {
        max-width: 720px;
    }

}


/* =========================================================
   Mobile
========================================================= */

@media (max-width: 700px) {

    html[lang="ja"] .jp-about-v2 .about-v2-hero h1 {
        font-size:
            clamp(2.1rem, 8.6vw, 2.9rem);

        line-height: 1.42;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-hero-lead {
        font-size: 0.98rem;

        line-height: 1.95;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-profile-content h2,
    html[lang="ja"] .jp-about-v2 .about-v2-section-heading h2,
    html[lang="ja"] .jp-about-v2 .about-v2-sticky-heading h2,
    html[lang="ja"] .jp-about-v2 .about-v2-japan h2,
    html[lang="ja"] .jp-about-v2 .about-v2-direction h2,
    html[lang="ja"] .jp-about-v2 .about-v2-cta h2 {
        font-size:
            clamp(1.85rem, 7.2vw, 2.45rem);

        line-height: 1.5;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-difference-grid h3,
    html[lang="ja"] .jp-about-v2 .about-v2-approach-list h3,
    html[lang="ja"] .jp-about-v2 .about-v2-context-grid h3,
    html[lang="ja"] .jp-about-v2 .about-v2-capability-grid h3 {
        line-height: 1.55;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-role-panel li {
        grid-template-columns:
            34px 1fr;

        gap: 0.8rem;
    }

}


/* =========================================================
   Small Mobile
========================================================= */

@media (max-width: 420px) {

    html[lang="ja"] .jp-about-v2 .about-v2-hero h1 {
        font-size: 2rem;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-bridge div {
        grid-template-columns: 1fr;
    }


    html[lang="ja"] .jp-about-v2 .about-v2-bridge i {
        width: 100%;
    }

}