.aboutPage{
    background:#ffffff;
    color:#111111;
    overflow:hidden;
}

.aboutContainer{
    width:min(1180px, calc(100% - 64px));
    margin:0 auto;
}

/* Hero remains exactly as before */

.aboutHero{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:380px;
    overflow:hidden;
    background:#ffffff;
    line-height:0;
}

.aboutHeroImage{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

.aboutIntroduction{
    padding:130px 0 145px;
}

.aboutIntroGrid{
    display:grid;
    grid-template-columns:minmax(145px, .35fr) minmax(0, 1.15fr) minmax(280px, .8fr);
    align-items:start;
    gap:48px;
}

.aboutIntroLabel span{
    display:inline-block;
    min-width:145px;
    padding-top:14px;
    border-top:1px solid #111111;
    color:#555555;
    font-size:10px;
    font-weight:700;
    letter-spacing:.18em;
}

.aboutIntroContent{
    max-width:750px;
}

.aboutIntroContent h1{
    margin:0;
    font-family:Arial, sans-serif;
    font-size:clamp(28px, 6vw, 36px);
    font-weight:400;
    line-height:.98;
    letter-spacing:-.05em;
}

.aboutIntroContent .aboutLead,
.aboutIntroContent p{
    max-width:660px;
    font-family:Arial, sans-serif;
    margin:30px 0 0;
    color:#5d5c58;
    font-size:17px;
    line-height:1.85;
    font-weight: 500;
}

.aboutIntroContent strong{
    color:#111111;
    font-weight:600;
}

.aboutIntroVisual{
    height:550px;
    overflow:hidden;
    background:#f4f3f0;
}

.aboutIntroVisual img{
    display:block;
    width:100%;
    height:100%;
    object-fit:fill;
}

@media(max-width:980px){

    .aboutIntroGrid{
        grid-template-columns:130px minmax(0, 1.1fr) minmax(250px, .75fr);
        gap:32px;
    }

    .aboutIntroVisual{
        min-height:490px;
    }
}

@media(max-width:760px){

    .aboutContainer{
        width:min(100% - 40px, 1180px);
    }

    .aboutHero{
        height:250px;
    }

    .aboutIntroduction{
        padding:80px 0 90px;
    }

    .aboutIntroGrid{
        grid-template-columns:1fr;
        gap:36px;
    }

    .aboutIntroVisual{
        min-height:0;
        aspect-ratio:4 / 5;
    }

    .aboutIntroContent .aboutLead{
        margin-top:26px;
        font-size:19px;
    }

    .aboutIntroContent p{
        font-size:16px;
    }
}

@media(max-width:480px){

    .aboutContainer{
        width:min(100% - 32px, 1180px);
    }

    .aboutHero{
        height:210px;
    }

    .aboutIntroduction{
        padding:65px 0 75px;
    }
}