/* =========================================================
   SATOMEN — ABOUT PAGE
========================================================= */

.sat-about{
    background:var(--paper);
    color:var(--ink);
}

.sat-about .wrap{
    padding-left:var(--pad);
    padding-right:var(--pad);
}


/* =========================================================
   HERO
========================================================= */

.about-hero{
    position:relative;
    height:100svh;
    min-height:720px;
    overflow:hidden;
    background:var(--deep);
    color:#fff;
}

.about-hero-bg,
.about-hero-shade{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}

.about-hero-bg{
    object-fit:cover;
}

.about-hero-shade{
    background:
        linear-gradient(
            90deg,
            rgba(1,28,44,.96) 0%,
            rgba(1,28,44,.72) 48%,
            rgba(1,28,44,.22) 100%
        ),
        linear-gradient(
            0deg,
            rgba(1,28,44,.9),
            transparent 55%
        );
}

.about-hero-content{
    position:relative;
    z-index:2;
    height:100%;
    padding:120px var(--pad) 28px;
    display:flex;
    flex-direction:column;
}

.about-hero-top{
    display:flex;
    justify-content:space-between;
    padding-bottom:20px;
    border-bottom:1px solid rgba(255,255,255,.25);
    font-size:9px;
    font-weight:600;
    letter-spacing:.15em;
}

.about-hero-top span:first-child{
    color:var(--orange);
}

.about-hero-main{
    flex:1;
    display:grid;
    grid-template-columns:1.4fr .5fr;
    gap:8vw;
    align-items:center;
}

.about-hero h1{
    margin:0;
    font-size:clamp(64px,7.3vw,118px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.about-hero h1 span{
    color:var(--orange);
}

.about-hero-copy{
    max-width:390px;
}

.about-hero-copy p{
    margin:0;
    color:rgba(255,255,255,.76);
    font-size:17px;
    line-height:1.7;
}

.about-hero-copy a{
    display:inline-flex;
    gap:35px;
    margin-top:32px;
    padding-bottom:7px;
    border-bottom:1px solid rgba(255,255,255,.55);
    font-size:9px;
    font-weight:700;
    letter-spacing:.12em;
}

.about-hero-bottom{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.25);
    font-size:9px;
    letter-spacing:.1em;
}

.about-hero-bottom span:nth-child(2),
.about-hero-bottom span:nth-child(3){
    text-align:center;
}

.about-hero-bottom span:last-child{
    text-align:right;
}


/* =========================================================
   WHO WE ARE
========================================================= */

.about-intro{
    padding:120px var(--pad) 140px;
    background:var(--paper);
}

.about-intro-top{
    display:flex;
    justify-content:space-between;
    padding-bottom:20px;
    border-bottom:1px solid rgba(1,28,44,.16);
    color:#74828a;
    font-size:9px;
    font-weight:600;
    letter-spacing:.14em;
}

.about-intro-top span:first-child{
    color:var(--orange);
}

.about-intro-heading{
    padding:70px 0 90px;
}

.about-intro-heading h2{
    margin:0;
    font-size:clamp(60px,7vw,110px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.about-intro-heading h2 span{
    color:var(--sea);
}

.about-intro-layout{
    display:grid;
    grid-template-columns:.7fr 1.3fr;
    gap:8vw;
    align-items:end;
}

.about-intro-copy > p{
    margin:0 0 24px;
    color:var(--muted);
    font-size:16px;
    line-height:1.75;
}

.about-intro-copy .about-lead{
    margin-bottom:32px;
    color:var(--ink);
    font-size:clamp(21px,1.7vw,27px);
    line-height:1.45;
}

.about-intro-points{
    display:grid;
    grid-template-columns:1fr 1fr;
    margin-top:50px;
    border-top:1px solid var(--line);
}

.about-intro-points > div{
    padding:25px 25px 0 0;
}

.about-intro-points > div + div{
    padding-left:25px;
    border-left:1px solid var(--line);
}

.about-intro-points span{
    color:var(--orange);
    font-size:9px;
}

.about-intro-points h3{
    margin:25px 0 10px;
    font-size:21px;
    font-weight:500;
}

.about-intro-points p{
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.65;
}

.about-intro-image img{
    width:100%;
    height:650px;
    object-fit:cover;
}

.about-image-label{
    display:flex;
    justify-content:space-between;
    padding:14px 0;
    border-bottom:1px solid var(--line);
    font-size:9px;
    font-weight:600;
    letter-spacing:.12em;
}


/* =========================================================
   STORY
========================================================= */

.about-story{
    padding:140px 0;
    background:#fff;
}

.about-section-meta,
.ab-section-line,
.ab-dark-line{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-bottom:18px;
    border-bottom:1px solid var(--line);
    color:#78858c;
    font-size:9px;
    font-weight:700;
    letter-spacing:.14em;
}

.about-section-meta .label,
.ab-section-line span:first-child,
.ab-dark-line span:first-child{
    margin:0;
    color:var(--orange);
}

.about-story-heading{
    display:grid;
    grid-template-columns:1.25fr .45fr;
    gap:8vw;
    align-items:end;
    padding:70px 0 90px;
}

.about-story-heading h2{
    margin:0;
    font-size:clamp(60px,7vw,110px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.about-story-heading h2 span{
    color:var(--sea);
}

.about-story-heading > p{
    margin:0;
    color:var(--muted);
    font-size:17px;
    line-height:1.7;
}

.about-story-grid{
    display:grid;
    grid-template-columns:.65fr 1.35fr;
    gap:8vw;
    align-items:end;
}

.about-story-copy p{
    margin:0 0 24px;
    color:var(--muted);
    font-size:16px;
    line-height:1.75;
}

.about-story-copy .large{
    margin-bottom:40px;
    color:var(--ink);
    font-size:clamp(21px,1.7vw,27px);
    line-height:1.45;
}

.about-story-image img{
    width:100%;
    height:620px;
    object-fit:cover;
}

.about-story-caption{
    display:flex;
    justify-content:space-between;
    padding:14px 0;
    border-bottom:1px solid var(--line);
    font-size:9px;
    font-weight:600;
    letter-spacing:.12em;
}


/* =========================================================
   PURPOSE
========================================================= */

.ab-purpose{
    padding:140px 0 150px;
    background:#f7f8f6;
}

.ab-purpose-intro{
    display:grid;
    grid-template-columns:1.2fr .42fr;
    gap:8vw;
    align-items:end;
    padding:80px 0 100px;
}

.ab-purpose-intro h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.ab-purpose-intro h2 span{
    color:var(--sea);
}

.ab-purpose-intro > p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.ab-purpose-row{
    display:grid;
    grid-template-columns:.28fr 1fr .48fr;
    gap:5vw;
    align-items:start;
    padding:50px 0;
    border-top:1px solid var(--line);
}

.ab-purpose-row:last-child{
    border-bottom:1px solid var(--line);
}

.ab-purpose-label{
    display:flex;
    gap:25px;
    align-items:center;
}

.ab-purpose-label span{
    color:var(--orange);
    font-size:9px;
    font-weight:700;
}

.ab-purpose-label strong{
    font-size:10px;
    letter-spacing:.13em;
}

.ab-purpose-row h3{
    margin:-7px 0 0;
    font-size:clamp(38px,4vw,64px);
    line-height:.98;
    font-weight:400;
    letter-spacing:-.045em;
}

.ab-purpose-row h3 em{
    color:var(--sea);
    font-style:normal;
}

.ab-purpose-row > p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}


/* =========================================================
   WHAT WE DO
========================================================= */

.ab-operations{
    padding:145px 0;
    background:#fff;
}

.ab-operations-head{
    display:grid;
    grid-template-columns:1.2fr .4fr;
    gap:8vw;
    align-items:end;
    padding:80px 0 90px;
}

.ab-operations-head h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.ab-operations-head h2 span{
    color:var(--sea);
}

.ab-operations-head > p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.ab-operations-list{
    border-top:1px solid var(--line);
}

.ab-operation{
    display:grid;
    grid-template-columns:70px 1fr .55fr 40px;
    gap:30px;
    align-items:center;
    min-height:145px;
    border-bottom:1px solid var(--line);
    transition:padding .3s ease;
}

.ab-operation:hover{
    padding-left:12px;
}

.ab-operation-no{
    color:var(--orange);
    font-size:9px;
    font-weight:700;
}

.ab-operation-name small{
    display:block;
    margin-bottom:7px;
    color:#849098;
    font-size:8px;
    font-weight:700;
    letter-spacing:.13em;
}

.ab-operation-name h3{
    margin:0;
    font-size:clamp(35px,4vw,61px);
    line-height:1;
    font-weight:400;
    letter-spacing:-.045em;
}

.ab-operation > p{
    max-width:400px;
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.65;
}

.ab-operation-arrow{
    justify-self:end;
    color:var(--orange);
    font-size:21px;
}

.ab-operations-image{
    margin-top:70px;
}

.ab-operations-image img{
    width:100%;
    height:580px;
    object-fit:cover;
}

.ab-operations-image > div{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding:15px 0;
    border-bottom:1px solid var(--line);
    color:#718088;
    font-size:8px;
    font-weight:700;
    letter-spacing:.13em;
}

.ab-operations-image span:nth-child(2),
.ab-operations-image span:nth-child(3){
    text-align:center;
}

.ab-operations-image span:last-child{
    text-align:right;
}


/* =========================================================
   VALUES
========================================================= */

.ab-values{
    padding:145px 0;
    background:#f2f2ef;
}

.ab-values-layout{
    display:grid;
    grid-template-columns:.75fr 1.25fr;
    gap:9vw;
    padding-top:90px;
}

.ab-values-title{
    position:sticky;
    top:120px;
    align-self:start;
}

.ab-values-title h2{
    margin:0 0 35px;
    font-size:clamp(55px,6vw,94px);
    line-height:.86;
    font-weight:400;
    letter-spacing:-.06em;
}

.ab-values-title h2 span{
    color:var(--sea);
}

.ab-values-title p{
    max-width:420px;
    margin:0;
    color:var(--muted);
    line-height:1.7;
}

.ab-values-list{
    border-top:1px solid var(--line);
}

.ab-values-list article{
    display:grid;
    grid-template-columns:55px .65fr 1fr;
    gap:30px;
    align-items:start;
    padding:35px 0 38px;
    border-bottom:1px solid var(--line);
}

.ab-values-list article > span{
    color:var(--orange);
    font-size:9px;
    font-weight:700;
}

.ab-values-list h3{
    margin:-5px 0 0;
    font-size:clamp(25px,2.3vw,37px);
    font-weight:400;
    letter-spacing:-.035em;
}

.ab-values-list p{
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   PEOPLE
========================================================= */

.ab-people{
    padding:145px 0 155px;
    background:#fff;
}

.ab-people-head{
    display:grid;
    grid-template-columns:1.2fr .4fr;
    gap:8vw;
    align-items:end;
    padding:80px 0 95px;
}

.ab-people-head h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.ab-people-head h2 span{
    color:var(--sea);
}

.ab-people-head p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.ab-leadership{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:6vw;
    align-items:start;
}

.ab-leader:nth-child(2){
    margin-top:150px;
}

.ab-leader-image{
    overflow:hidden;
    background:#eee;
}

.ab-leader-image img{
    display:block;
    width:100%;
    aspect-ratio:4/5;
    object-fit:cover;
    transition:transform .6s ease;
}

.ab-leader:hover img{
    transform:scale(1.025);
}

.ab-leader-meta{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:16px 0;
    border-bottom:1px solid var(--line);
    color:#7d898f;
    font-size:8px;
    font-weight:700;
    letter-spacing:.12em;
}

.ab-leader-meta span:first-child{
    color:var(--orange);
}

.ab-leader h3{
    margin:24px 0 12px;
    font-size:clamp(30px,3.2vw,51px);
    line-height:1;
    font-weight:400;
    letter-spacing:-.045em;
}

.ab-leader > p{
    max-width:580px;
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.7;
}

.ab-board{
    display:grid;
    grid-template-columns:.65fr 1fr 1fr;
    margin-top:110px;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}

.ab-board > div{
    padding:28px 30px 28px 0;
}

.ab-board > div + div{
    padding-left:30px;
    border-left:1px solid var(--line);
}

.ab-board-label span{
    color:var(--orange);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.ab-board-member{
    display:grid;
    grid-template-columns:35px 1fr;
}

.ab-board-member > span{
    color:var(--orange);
    font-size:9px;
}

.ab-board-member strong{
    font-size:18px;
    font-weight:500;
}

.ab-board-member p{
    grid-column:2;
    margin:7px 0 0;
    color:var(--muted);
    font-size:13px;
}


.ab-team-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:65px 24px;
    margin-top:110px;
}

.ab-team-member{
    min-width:0;
}

.ab-team-image{
    overflow:hidden;
    background:#e8e8e4;
}

.ab-team-image img{
    display:block;
    width:100%;
    aspect-ratio:4/5;
    object-fit:cover;
    transition:transform .6s cubic-bezier(.2,.7,.2,1);
}

.ab-team-member:hover .ab-team-image img{
    transform:scale(1.025);
}

.ab-team-info{
    padding-top:18px;
    border-top:1px solid var(--line);
}

.ab-team-info h3{
    margin:0;
    color:var(--ink);
    font-size:clamp(20px,1.7vw,27px);
    line-height:1.1;
    font-weight:400;
    letter-spacing:-.035em;
}

.ab-team-info p{
    margin:8px 0 0;
    color:var(--muted);
    font-size:10px;
    font-weight:600;
    line-height:1.4;
    letter-spacing:.09em;
    text-transform:uppercase;
}

@media(max-width:900px){
    .ab-team-grid{
        grid-template-columns:repeat(2,1fr);
        gap:55px 20px;
    }
}

@media(max-width:550px){
    .ab-team-grid{
        grid-template-columns:1fr;
        gap:50px;
        margin-top:70px;
    }

    .ab-team-image img{
        aspect-ratio:4/4.7;
    }

    .ab-team-info h3{
        font-size:24px;
    }
}


/* =========================================================
   COMMITMENT
========================================================= */

.ab-commitment{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    min-height:820px;
    background:var(--deep);
}

.ab-commitment-image{
    min-height:820px;
}

.ab-commitment-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.ab-commitment-content{
    padding:55px var(--pad);
    display:flex;
    flex-direction:column;
    color:#fff;
}

.ab-dark-line{
    border-color:rgba(255,255,255,.22);
    color:rgba(255,255,255,.5);
}

.ab-commitment-main{
    margin:auto 0;
}

.ab-commitment-main h2{
    margin:35px 0 50px;
    font-size:clamp(52px,5.5vw,88px);
    line-height:.85;
    font-weight:400;
    letter-spacing:-.06em;
}

.ab-commitment-main h2 span{
    color:var(--orange);
}

.ab-commitment-main p{
    max-width:530px;
    margin:0 0 20px;
    color:rgba(255,255,255,.62);
    font-size:15px;
    line-height:1.75;
}

.ab-commitment-main .lead{
    color:#fff;
    font-size:clamp(20px,1.7vw,27px);
    line-height:1.45;
}

.ab-commitment-footer{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-top:1px solid rgba(255,255,255,.2);
}

.ab-commitment-footer > div{
    padding:20px 18px 0 0;
}

.ab-commitment-footer > div + div{
    padding-left:18px;
    border-left:1px solid rgba(255,255,255,.2);
}

.ab-commitment-footer span{
    color:var(--orange);
    font-size:8px;
}

.ab-commitment-footer p{
    margin:10px 0 0;
    color:rgba(255,255,255,.7);
    font-size:12px;
}


/* =========================================================
   RESPONSIBLE OPERATIONS
========================================================= */

.ab-responsible{
    padding:145px 0 155px;
    background:#f7f8f6;
}

.ab-responsible-head{
    padding:80px 0 90px;
}

.ab-responsible-head h2{
    max-width:1200px;
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.ab-responsible-head h2 span{
    color:var(--sea);
}

.ab-responsible-grid{
    display:grid;
    grid-template-columns:.55fr 1.45fr;
    gap:8vw;
    align-items:end;
}

.ab-responsible-copy > span{
    display:block;
    margin-bottom:30px;
    color:var(--orange);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.ab-responsible-copy p{
    margin:0 0 20px;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.ab-responsible-copy .lead{
    color:var(--ink);
    font-size:clamp(20px,1.7vw,27px);
    line-height:1.45;
}

.ab-responsible-copy a{
    display:flex;
    justify-content:space-between;
    margin-top:45px;
    padding:17px 0;
    border-top:1px solid var(--ink);
    border-bottom:1px solid var(--ink);
    font-size:9px;
    font-weight:700;
    letter-spacing:.12em;
}

.ab-responsible-copy a span{
    color:var(--orange);
    font-size:17px;
}

.ab-responsible-image img{
    width:100%;
    height:640px;
    object-fit:cover;
}

.ab-responsible-image-meta{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding:15px 0;
    border-bottom:1px solid var(--line);
    color:#748189;
    font-size:8px;
    font-weight:700;
    letter-spacing:.12em;
}

.ab-responsible-image-meta span:nth-child(2),
.ab-responsible-image-meta span:nth-child(3){
    text-align:center;
}

.ab-responsible-image-meta span:last-child{
    text-align:right;
}


/* =========================================================
   CLOSING
========================================================= */

.ab-closing{
    padding:75px 0 90px;
    background:var(--deep);
    color:#fff;
}

.ab-closing-main{
    padding:100px 0 110px;
}

.ab-closing-main h2{
    margin:0;
    font-size:clamp(65px,8.2vw,132px);
    line-height:.8;
    font-weight:400;
    letter-spacing:-.07em;
}

.ab-closing-main h2 span{
    color:var(--orange);
}

.ab-closing-bottom{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:50px;
    padding-top:25px;
    border-top:1px solid rgba(255,255,255,.2);
}

.ab-closing-bottom > p{
    max-width:400px;
    margin:0;
    color:rgba(255,255,255,.55);
    font-size:14px;
    line-height:1.7;
}

.ab-closing-bottom a{
    min-width:280px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:45px;
    padding:17px 0;
    border-bottom:1px solid rgba(255,255,255,.65);
    font-size:9px;
    font-weight:700;
    letter-spacing:.12em;
}

.ab-closing-bottom a b{
    color:var(--orange);
    font-size:18px;
    font-weight:400;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1000px){

    .about-hero-main,
    .about-intro-layout,
    .about-story-heading,
    .about-story-grid,
    .ab-purpose-intro,
    .ab-operations-head,
    .ab-people-head{
        grid-template-columns:1fr;
    }

    .about-hero{
        min-height:850px;
    }

    .about-hero-main{
        align-content:center;
        gap:45px;
    }

    .about-hero-copy{
        max-width:540px;
    }

    .about-intro-layout,
    .about-story-grid{
        gap:55px;
    }

    .ab-purpose-intro,
    .ab-operations-head,
    .ab-people-head{
        gap:35px;
    }

    .ab-purpose-row{
        grid-template-columns:.3fr 1fr;
    }

    .ab-purpose-row > p{
        grid-column:2;
    }

    .ab-values-layout{
        grid-template-columns:1fr;
        gap:70px;
    }

    .ab-values-title{
        position:static;
    }

    .ab-leadership{
        gap:35px;
    }

    .ab-leader:nth-child(2){
        margin-top:80px;
    }

    .ab-commitment{
        grid-template-columns:1fr;
    }

    .ab-commitment-image{
        min-height:600px;
        height:600px;
    }

    .ab-commitment-content{
        min-height:720px;
    }

    .ab-responsible-grid{
        grid-template-columns:1fr;
        gap:60px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:650px){

    .about-hero{
        min-height:790px;
        height:auto;
    }

    .about-hero-content{
        min-height:790px;
        padding-top:105px;
    }

    .about-hero-top span:last-child{
        display:none;
    }

    .about-hero h1{
        font-size:clamp(48px,15vw,72px);
    }

    .about-hero-bottom{
        grid-template-columns:1fr 1fr;
        gap:12px;
    }

    .about-hero-bottom span{
        text-align:left !important;
    }


    /* INTRO */

    .about-intro{
        padding-top:90px;
        padding-bottom:90px;
    }

    .about-intro-top span:last-child{
        display:none;
    }

    .about-intro-heading{
        padding:55px 0 60px;
    }

    .about-intro-heading h2{
        font-size:clamp(47px,13vw,68px);
    }

    .about-intro-image img{
        height:430px;
    }

    .about-intro-points{
        grid-template-columns:1fr;
    }

    .about-intro-points > div{
        padding:25px 0;
        border-bottom:1px solid var(--line);
    }

    .about-intro-points > div + div{
        padding-left:0;
        border-left:0;
    }


    /* STORY */

    .about-story{
        padding:90px 0;
    }

    .about-story-heading{
        padding:55px 0 60px;
    }

    .about-story-heading h2{
        font-size:clamp(47px,13vw,68px);
    }

    .about-story-image img{
        height:420px;
    }


    /* GENERAL */

    .ab-purpose,
    .ab-operations,
    .ab-values,
    .ab-people,
    .ab-responsible{
        padding:90px 0;
    }

    .ab-section-line span:last-child,
    .ab-dark-line span:last-child{
        display:none;
    }

    .ab-purpose-intro,
    .ab-operations-head,
    .ab-people-head,
    .ab-responsible-head{
        padding:55px 0 60px;
    }

    .ab-purpose-intro h2,
    .ab-operations-head h2,
    .ab-people-head h2,
    .ab-responsible-head h2{
        font-size:clamp(46px,13vw,67px);
    }


    /* PURPOSE */

    .ab-purpose-row{
        grid-template-columns:1fr;
        gap:30px;
        padding:40px 0;
    }

    .ab-purpose-row > p{
        grid-column:auto;
    }


    /* OPERATIONS */

    .ab-operation{
        grid-template-columns:35px 1fr 25px;
        gap:15px;
        padding:28px 0;
    }

    .ab-operation > p{
        grid-column:2;
    }

    .ab-operation-arrow{
        grid-column:3;
        grid-row:1;
    }

    .ab-operations-image{
        margin-top:50px;
    }

    .ab-operations-image img{
        height:430px;
    }

    .ab-operations-image > div{
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .ab-operations-image span{
        text-align:left !important;
    }


    /* VALUES */

    .ab-values-layout{
        padding-top:60px;
    }

    .ab-values-title h2{
        font-size:clamp(46px,13vw,67px);
    }

    .ab-values-list article{
        grid-template-columns:35px 1fr;
        gap:15px;
    }

    .ab-values-list p{
        grid-column:2;
    }


    /* PEOPLE */

    .ab-leadership{
        grid-template-columns:1fr;
        gap:65px;
    }

    .ab-leader:nth-child(2){
        margin-top:0;
    }

    .ab-board{
        grid-template-columns:1fr;
        margin-top:75px;
    }

    .ab-board > div{
        padding:25px 0;
    }

    .ab-board > div + div{
        padding-left:0;
        border-left:0;
        border-top:1px solid var(--line);
    }


    /* COMMITMENT */

    .ab-commitment-image{
        min-height:470px;
        height:470px;
    }

    .ab-commitment-content{
        min-height:680px;
        padding-top:45px;
        padding-bottom:45px;
    }

    .ab-commitment-main h2{
        font-size:clamp(45px,12vw,64px);
         margin-top:30px;
    }

    .ab-commitment-footer{
        grid-template-columns:1fr;
    }

    .ab-commitment-footer > div{
        padding:14px 0;
    }

    .ab-commitment-footer > div + div{
        padding-left:0;
        border-left:0;
        border-top:1px solid rgba(255,255,255,.15);
    }


    /* RESPONSIBLE */

    .ab-responsible-image img{
        height:440px;
    }

    .ab-responsible-image-meta{
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .ab-responsible-image-meta span{
        text-align:left !important;
    }


    /* CLOSING */

    .ab-closing{
        padding:60px 0 70px;
    }

    .ab-closing-main{
        padding:75px 0 80px;
    }

    .ab-closing-main h2{
        font-size:clamp(49px,14vw,72px);
    }

    .ab-closing-bottom{
        flex-direction:column;
        align-items:stretch;
    }

    .ab-closing-bottom a{
        min-width:0;
    }

}



@media (max-width: 768px){

    .about-hero-top,
    .about-hero-bottom,
    .about-intro-top,
    .about-image-label,
    .about-section-meta,
    .ab-section-line,
    .ab-dark-line,
    .ab-purpose-label span,
    .ab-purpose-label strong,
    .ab-operation-no,
    .ab-operation-name small,
    .ab-values-list article > span,
    .ab-leader-meta,
    .ab-team-info p,
    .ab-commitment-footer span,
    .ab-responsible-copy > span,
    .ab-responsible-image-meta{
        font-size:10px !important;
        line-height:1.35 !important;
    }

    .about-hero-copy p,
    .about-intro-copy > p,
    .about-story-copy p,
    .about-story-heading > p,
    .ab-purpose-row > p,
    .ab-operations-head > p,
    .ab-operation > p,
    .ab-values-title p,
    .ab-values-list p,
    .ab-leader > p,
    .ab-commitment-main p,
    .ab-responsible-copy p{
        font-size:15px !important;
        line-height:1.65 !important;
    }

    .about-intro-copy .about-lead,
    .about-story-copy .large,
    .ab-commitment-main .lead,
    .ab-responsible-copy .lead{
        font-size:20px !important;
        line-height:1.45 !important;
    }

    .about-hero h1,
    .about-intro-heading h2,
    .about-story-heading h2,
    .ab-purpose-intro h2,
    .ab-operations-head h2,
    .ab-values-title h2,
    .ab-people-head h2,
    .ab-responsible-head h2{
        max-width:100% !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }


    .about-story .wrap,
    .ab-purpose .wrap,
    .ab-operations .wrap,
    .ab-values .wrap,
    .ab-people .wrap,
    .ab-responsible .wrap{
        padding-left:var(--pad) !important;
        padding-right:var(--pad) !important;
    }

    .ab-commitment-content{
        padding-left:var(--pad) !important;
        padding-right:var(--pad) !important;
    }

    .about-intro-top,
    .about-section-meta,
    .ab-section-line,
    .ab-dark-line{
        width:100% !important;
        min-width:0 !important;
    }

    /* Operations rows */
    .ab-operation-name{
        min-width:0 !important;
    }

    .ab-operation-name h3{
        font-size:clamp(30px,9vw,40px) !important;
    }

    /* Values */
    .ab-values-list h3{
        font-size:26px !important;
        line-height:1.05 !important;
    }

    /* Team/leadership metadata */
    .ab-leader-meta{
        gap:12px !important;
    }

    .ab-leader-meta span{
        min-width:0 !important;
    }

    /* Responsible Operations heading:
       slightly smaller on narrow screens so "RESPONSIBILITY" fits cleanly. */
    .ab-responsible-head h2{
        font-size:clamp(42px,11.5vw,58px) !important;
        line-height:.88 !important;
        letter-spacing:-.055em !important;
    }
}

/* iPhone SE / narrow phones */
@media (max-width: 480px){

    .about-hero-content{
        padding-left:var(--pad) !important;
        padding-right:var(--pad) !important;
    }

    .about-hero h1{
        font-size:clamp(44px,13vw,58px) !important;
        line-height:.87 !important;
    }

    .about-intro-heading h2,
    .about-story-heading h2,
    .ab-purpose-intro h2,
    .ab-operations-head h2,
    .ab-values-title h2,
    .ab-people-head h2{
        font-size:clamp(42px,11.5vw,55px) !important;
        line-height:.88 !important;
    }

    .ab-responsible-head h2{
        font-size:clamp(39px,10.8vw,50px) !important;
        line-height:.9 !important;
    }

    .ab-purpose-row h3{
        font-size:34px !important;
    }

    .ab-commitment-main h2{
        font-size:clamp(40px,11vw,52px) !important;
        line-height:.9 !important;
    }

    .about-intro-image img,
    .about-story-image img,
    .ab-responsible-image img{
        height:auto !important;
        aspect-ratio:4/5 !important;
        object-fit:cover !important;
    }
}





/* HSEQ */
/* =========================================================
   SATOMEN — HSEQ PAGE
========================================================= */

.hseq-page{
    background:#f7f8f6;
    color:var(--ink);
}

.hseq-page .wrap{
    padding-left:var(--pad);
    padding-right:var(--pad);
}

.hq-section-meta,
.hq-dark-meta{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-bottom:18px;
    border-bottom:1px solid var(--line);
    color:#78858c;
    font-size:9px;
    font-weight:700;
    letter-spacing:.14em;
}

.hq-section-meta span:first-child,
.hq-dark-meta span:first-child{
    color:var(--orange);
}

.hq-dark-meta{
    color:rgba(255,255,255,.5);
    border-color:rgba(255,255,255,.22);
}


/* =========================================================
   HERO
========================================================= */

.hq-hero{
    position:relative;
    height:100svh;
    min-height:720px;
    overflow:hidden;
    background:var(--deep);
    color:#fff;
}

.hq-hero-image,
.hq-hero-overlay{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}

.hq-hero-image{
    object-fit:cover;
}

.hq-hero-overlay{
    background:
        linear-gradient(
            90deg,
            rgba(1,28,44,.96) 0%,
            rgba(1,28,44,.76) 48%,
            rgba(1,28,44,.2) 100%
        ),
        linear-gradient(
            0deg,
            rgba(1,28,44,.85),
            transparent 60%
        );
}

.hq-hero-content{
    position:relative;
    z-index:2;
    height:100%;
    padding:120px var(--pad) 28px;
    display:flex;
    flex-direction:column;
}

.hq-hero-meta{
    display:flex;
    justify-content:space-between;
    padding-bottom:20px;
    border-bottom:1px solid rgba(255,255,255,.25);
    font-size:9px;
    font-weight:700;
    letter-spacing:.14em;
}

.hq-hero-meta span:first-child{
    color:var(--orange);
}

.hq-hero-main{
    flex:1;
    display:grid;
    grid-template-columns:1.35fr .45fr;
    gap:8vw;
    align-items:center;
}

.hq-hero h1{
    margin:0;
    max-width:1200px;
    font-size:clamp(64px,7.5vw,120px);
    line-height:.83;
    font-weight:400;
    letter-spacing:-.067em;
}

.hq-hero h1 span{
    color:var(--orange);
}

.hq-hero-copy{
    max-width:400px;
}

.hq-hero-copy p{
    margin:0;
    color:rgba(255,255,255,.76);
    font-size:17px;
    line-height:1.7;
}

.hq-hero-copy a{
    display:flex;
    justify-content:space-between;
    margin-top:35px;
    padding:15px 0;
    border-top:1px solid rgba(255,255,255,.55);
    border-bottom:1px solid rgba(255,255,255,.55);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-hero-copy a span{
    color:var(--orange);
}

.hq-hero-footer{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.25);
    color:rgba(255,255,255,.65);
    font-size:9px;
    font-weight:600;
    letter-spacing:.12em;
}

.hq-hero-footer span:nth-child(2),
.hq-hero-footer span:nth-child(3){
    text-align:center;
}

.hq-hero-footer span:last-child{
    text-align:right;
}


/* =========================================================
   APPROACH
========================================================= */

.hq-approach{
    padding:140px 0 155px;
    background:#f7f8f6;
}

.hq-approach-head{
    display:grid;
    grid-template-columns:1.2fr .4fr;
    gap:8vw;
    align-items:end;
    padding:80px 0 95px;
}

.hq-approach-head h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.hq-approach-head h2 span{
    color:var(--sea);
}

.hq-approach-head > p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.hq-approach-layout{
    display:grid;
    grid-template-columns:1.35fr .65fr;
    gap:8vw;
    align-items:end;
}

.hq-approach-image img{
    width:100%;
    height:650px;
    object-fit:cover;
}

.hq-approach-image > div{
    display:flex;
    justify-content:space-between;
    padding:14px 0;
    border-bottom:1px solid var(--line);
    color:#758188;
    font-size:8px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-approach-copy{
    padding-bottom:40px;
}

.hq-approach-copy p{
    margin:0 0 23px;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.hq-approach-copy .lead{
    margin-bottom:32px;
    color:var(--ink);
    font-size:clamp(21px,1.8vw,28px);
    line-height:1.45;
}


/* =========================================================
   PILLARS
========================================================= */

.hq-pillars{
    padding:145px 0;
    background:#fff;
}

.hq-pillars-head{
    padding:80px 0 90px;
}

.hq-pillars-head h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.hq-pillars-head h2 span{
    color:var(--sea);
}

.hq-pillar-list{
    border-top:1px solid var(--line);
}

.hq-pillar{
    display:grid;
    grid-template-columns:120px 1fr .65fr;
    gap:40px;
    align-items:center;
    min-height:180px;
    border-bottom:1px solid var(--line);
}

.hq-pillar-letter{
    color:var(--orange);
    font-size:clamp(60px,6vw,95px);
    line-height:1;
    font-weight:300;
    letter-spacing:-.06em;
}

.hq-pillar-title small{
    display:block;
    margin-bottom:12px;
    color:#7d898f;
    font-size:8px;
    font-weight:700;
    letter-spacing:.14em;
}

.hq-pillar-title h3{
    margin:0;
    font-size:clamp(32px,3.4vw,54px);
    line-height:1;
    font-weight:400;
    letter-spacing:-.045em;
}

.hq-pillar > p{
    max-width:440px;
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   SAFETY
========================================================= */

.hq-safety{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    min-height:820px;
    background:var(--deep);
    color:#fff;
}

.hq-safety-image{
    min-height:820px;
}

.hq-safety-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.hq-safety-content{
    display:flex;
    flex-direction:column;
    padding:55px var(--pad);
}

.hq-safety-main{
    margin:auto 0;
}

.hq-safety-main h2{
    margin:0 0 50px;
    font-size:clamp(55px,5.8vw,92px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.06em;
}

.hq-safety-main h2 span{
    color:var(--orange);
}

.hq-safety-main p{
    max-width:520px;
    margin:0 0 20px;
    color:rgba(255,255,255,.62);
    font-size:15px;
    line-height:1.75;
}

.hq-safety-main .lead{
    color:#fff;
    font-size:clamp(21px,1.8vw,28px);
    line-height:1.45;
}

.hq-safety-principles{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.2);
    color:rgba(255,255,255,.6);
    font-size:8px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-safety-principles span:nth-child(2),
.hq-safety-principles span:nth-child(3){
    text-align:center;
}

.hq-safety-principles span:last-child{
    text-align:right;
}


/* =========================================================
   PEOPLE
========================================================= */

.hq-people{
    padding:145px 0 155px;
    background:#fff;
}

.hq-people-head{
    display:grid;
    grid-template-columns:1.2fr .4fr;
    gap:8vw;
    align-items:end;
    padding:80px 0 95px;
}

.hq-people-head h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.hq-people-head h2 span{
    color:var(--sea);
}

.hq-people-head p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.hq-people-layout{
    display:grid;
    grid-template-columns:.6fr 1.4fr;
    gap:8vw;
    align-items:end;
}

.hq-people-copy{
    padding-bottom:30px;
}

.hq-people-copy > p{
    margin:0 0 22px;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.hq-people-copy .lead{
    color:var(--ink);
    font-size:clamp(21px,1.8vw,28px);
    line-height:1.45;
}

.hq-people-points{
    margin-top:45px;
    border-top:1px solid var(--line);
}

.hq-people-points > div{
    display:flex;
    justify-content:space-between;
    gap:25px;
    padding:17px 0;
    border-bottom:1px solid var(--line);
}

.hq-people-points strong{
    font-size:14px;
    font-weight:500;
}

.hq-people-points span{
    color:var(--muted);
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.hq-people-image img{
    width:100%;
    height:650px;
    object-fit:cover;
}


/* =========================================================
   ENVIRONMENT
========================================================= */

.hq-environment{
    padding:145px 0 155px;
    background:#f2f2ef;
}

.hq-environment-head{
    padding:80px 0 95px;
}

.hq-environment-head h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.hq-environment-head h2 span{
    color:var(--sea);
}

.hq-environment-layout{
    display:grid;
    grid-template-columns:1.4fr .6fr;
    gap:8vw;
    align-items:end;
}

.hq-environment-image img{
    width:100%;
    height:650px;
    object-fit:cover;
}

.hq-environment-copy{
    padding-bottom:30px;
}

.hq-small-label{
    display:block;
    margin-bottom:35px;
    color:var(--orange);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-environment-copy p{
    margin:0 0 22px;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.hq-environment-copy .lead{
    color:var(--ink);
    font-size:clamp(21px,1.8vw,28px);
    line-height:1.45;
}


/* =========================================================
   QUALITY
========================================================= */

.hq-quality{
    padding:145px 0 155px;
    background:#fff;
}

.hq-quality-layout{
    display:grid;
    grid-template-columns:1.15fr .55fr;
    gap:8vw;
    align-items:end;
    padding:90px 0 100px;
}

.hq-quality-title h2{
    margin:0;
    font-size:clamp(60px,7vw,112px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.hq-quality-title h2 span{
    color:var(--sea);
}

.hq-quality-copy p{
    margin:0 0 22px;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

.hq-quality-copy .lead{
    color:var(--ink);
    font-size:clamp(21px,1.8vw,28px);
    line-height:1.45;
}

.hq-quality-row{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}

.hq-quality-row > div{
    min-height:190px;
    padding:28px 30px 28px 0;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.hq-quality-row > div + div{
    padding-left:30px;
    border-left:1px solid var(--line);
}

.hq-quality-row span{
    color:var(--orange);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-quality-row h3{
    max-width:300px;
    margin:50px 0 0;
    font-size:clamp(23px,2vw,31px);
    line-height:1.1;
    font-weight:400;
    letter-spacing:-.035em;
}


/* =========================================================
   COMMITMENT
========================================================= */

.hq-commitment{
    padding:75px 0 85px;
    background:var(--deep);
    color:#fff;
}

.hq-commitment-main{
    display:grid;
    grid-template-columns:1.3fr .45fr;
    gap:8vw;
    align-items:end;
    padding:105px 0 120px;
}

.hq-commitment-main h2{
    margin:0;
    font-size:clamp(62px,7.5vw,120px);
    line-height:.81;
    font-weight:400;
    letter-spacing:-.067em;
}

.hq-commitment-main h2 span{
    color:var(--orange);
}

.hq-commitment-copy p{
    margin:0 0 20px;
    color:rgba(255,255,255,.6);
    font-size:15px;
    line-height:1.75;
}

.hq-commitment-copy .lead{
    color:#fff;
    font-size:clamp(21px,1.8vw,28px);
}

.hq-commitment-strip{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid rgba(255,255,255,.2);
    border-bottom:1px solid rgba(255,255,255,.2);
}

.hq-commitment-strip > div{
    min-height:130px;
    padding:22px 20px 22px 0;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.hq-commitment-strip > div + div{
    padding-left:20px;
    border-left:1px solid rgba(255,255,255,.2);
}

.hq-commitment-strip small{
    color:var(--orange);
    font-size:25px;
    font-weight:300;
}

.hq-commitment-strip span{
    color:rgba(255,255,255,.65);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}


/* =========================================================
   CLOSING
========================================================= */

.hq-closing{
    position:relative;
    min-height:780px;
    overflow:hidden;
    color:#fff;
}

.hq-closing-image,
.hq-closing-overlay{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}

.hq-closing-image{
    object-fit:cover;
}

.hq-closing-overlay{
    background:
        linear-gradient(
            90deg,
            rgba(1,28,44,.94),
            rgba(1,28,44,.58)
        );
}

.hq-closing-content{
    position:relative;
    z-index:2;
    min-height:780px;
    padding-top:65px;
    padding-bottom:60px;
    display:flex;
    flex-direction:column;
}

.hq-closing-meta{
    display:flex;
    justify-content:space-between;
    padding-bottom:18px;
    border-bottom:1px solid rgba(255,255,255,.25);
    color:rgba(255,255,255,.55);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-closing-meta span:first-child{
    color:var(--orange);
}

.hq-closing-main{
    margin:auto 0;
}

.hq-closing-main h2{
    margin:0;
    font-size:clamp(60px,7.5vw,120px);
    line-height:.82;
    font-weight:400;
    letter-spacing:-.067em;
}

.hq-closing-main h2 span{
    color:var(--orange);
}

.hq-closing-bottom{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:50px;
    padding-top:25px;
    border-top:1px solid rgba(255,255,255,.25);
}

.hq-closing-bottom p{
    max-width:390px;
    margin:0;
    color:rgba(255,255,255,.6);
    font-size:14px;
    line-height:1.7;
}

.hq-closing-bottom a{
    min-width:270px;
    display:flex;
    justify-content:space-between;
    gap:40px;
    padding:16px 0;
    border-bottom:1px solid rgba(255,255,255,.65);
    font-size:9px;
    font-weight:700;
    letter-spacing:.13em;
}

.hq-closing-bottom a span{
    color:var(--orange);
    font-size:17px;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1000px){

    .hq-hero-main,
    .hq-approach-head,
    .hq-approach-layout,
    .hq-people-head,
    .hq-people-layout,
    .hq-environment-layout,
    .hq-quality-layout,
    .hq-commitment-main{
        grid-template-columns:1fr;
    }

    .hq-hero-main{
        align-content:center;
        gap:45px;
    }

    .hq-hero-copy{
        max-width:550px;
    }

    .hq-approach-layout,
    .hq-people-layout,
    .hq-environment-layout{
        gap:60px;
    }

    .hq-pillar{
        grid-template-columns:100px 1fr;
        padding:35px 0;
    }

    .hq-pillar > p{
        grid-column:2;
    }

    .hq-safety{
        grid-template-columns:1fr;
    }

    .hq-safety-image{
        min-height:600px;
        height:600px;
    }

    .hq-safety-content{
        min-height:720px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:650px){

    .hq-hero{
        height:auto;
        min-height:790px;
    }

    .hq-hero-content{
        min-height:790px;
        padding-top:105px;
    }

    .hq-hero-meta span:last-child,
    .hq-section-meta span:last-child,
    .hq-dark-meta span:last-child,
    .hq-closing-meta span:last-child{
        display:none;
    }

    .hq-hero h1{
        font-size:clamp(48px,14vw,70px);
    }

    .hq-hero-footer{
        grid-template-columns:1fr 1fr;
        gap:12px;
    }

    .hq-hero-footer span{
        text-align:left !important;
    }


    .hq-approach,
    .hq-pillars,
    .hq-people,
    .hq-environment,
    .hq-quality{
        padding:90px 0;
    }

    .hq-approach-head,
    .hq-pillars-head,
    .hq-people-head,
    .hq-environment-head{
        padding:55px 0 60px;
    }

    .hq-approach-head h2,
    .hq-pillars-head h2,
    .hq-people-head h2,
    .hq-environment-head h2,
    .hq-quality-title h2{
        font-size:clamp(46px,13vw,67px);
    }

    .hq-approach-image img,
    .hq-people-image img,
    .hq-environment-image img{
        height:430px;
    }


    /* PILLARS */

    .hq-pillar{
        grid-template-columns:60px 1fr;
        gap:20px;
    }

    .hq-pillar-letter{
        font-size:55px;
    }

    .hq-pillar > p{
        grid-column:2;
    }


    /* SAFETY */

    .hq-safety-image{
        min-height:470px;
        height:470px;
    }

    .hq-safety-content{
        min-height:680px;
        padding-top:45px;
        padding-bottom:45px;
    }

    .hq-safety-main h2{
        font-size:clamp(46px,13vw,67px);
    }

    .hq-safety-principles{
        grid-template-columns:1fr 1fr;
        gap:14px;
    }

    .hq-safety-principles span{
        text-align:left !important;
    }


    /* QUALITY */

    .hq-quality-layout{
        padding:60px 0;
    }

    .hq-quality-row{
        grid-template-columns:1fr;
    }

    .hq-quality-row > div{
        min-height:150px;
        padding:25px 0;
    }

    .hq-quality-row > div + div{
        padding-left:0;
        border-left:0;
        border-top:1px solid var(--line);
    }

    .hq-quality-row h3{
        margin-top:35px;
    }


    /* COMMITMENT */

    .hq-commitment{
        padding:60px 0 70px;
    }

    .hq-commitment-main{
        padding:75px 0 80px;
    }

    .hq-commitment-main h2{
        font-size:clamp(48px,14vw,70px);
    }

    .hq-commitment-strip{
        grid-template-columns:1fr 1fr;
    }

    .hq-commitment-strip > div:nth-child(3){
        border-left:0;
        border-top:1px solid rgba(255,255,255,.2);
    }

    .hq-commitment-strip > div:nth-child(4){
        border-top:1px solid rgba(255,255,255,.2);
    }


    /* CLOSING */

    .hq-closing,
    .hq-closing-content{
        min-height:700px;
    }

    .hq-closing-main h2{
        font-size:clamp(47px,13vw,68px);
    }

    .hq-closing-bottom{
        flex-direction:column;
        align-items:stretch;
    }

    .hq-closing-bottom a{
        min-width:0;
    }

}

/* =========================================================
   HSEQ — FINAL RESPONSIVE UNIFORMITY PATCH
   Responsive only. Desktop remains unchanged.
   Matches Home + About mobile spacing/readability.
========================================================= */

@media (max-width: 768px){

    /* Same readable small-label standard used across the site */
    .hq-section-meta,
    .hq-dark-meta,
    .hq-hero-meta,
    .hq-hero-copy a,
    .hq-hero-footer,
    .hq-approach-image > div,
    .hq-pillar-title small,
    .hq-safety-principles,
    .hq-small-label,
    .hq-quality-row span{
        font-size:10px !important;
        line-height:1.35 !important;
    }

    /* Same body-copy standard as Home/About */
    .hq-hero-copy p,
    .hq-approach-copy p,
    .hq-pillar > p,
    .hq-safety-main p,
    .hq-people-copy > p,
    .hq-environment-copy p,
    .hq-quality-copy p{
        font-size:15px !important;
        line-height:1.65 !important;
    }

    /* Lead copy */
    .hq-approach-copy .lead,
    .hq-safety-main .lead,
    .hq-people-copy .lead,
    .hq-environment-copy .lead,
    .hq-quality-copy .lead{
        font-size:20px !important;
        line-height:1.45 !important;
    }

    /* Consistent safe page gutters */
    .hseq-page .wrap,
    .hq-hero-content,
    .hq-safety-content{
        padding-left:var(--pad) !important;
        padding-right:var(--pad) !important;
    }

    /* Hero behaves like the other page heroes */
    .hq-hero{
        height:auto !important;
        min-height:100svh !important;
    }

    .hq-hero-content{
        min-height:100svh !important;
        padding-top:105px !important;
        padding-bottom:28px !important;
    }

    .hq-hero-main{
        grid-template-columns:1fr !important;
        align-content:center !important;
        gap:34px !important;
    }

    .hq-hero h1{
        max-width:100% !important;
        font-size:clamp(46px,13vw,64px) !important;
        line-height:.87 !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }

    .hq-hero-copy{
        max-width:430px !important;
    }

    .hq-hero-footer{
        grid-template-columns:1fr 1fr !important;
        gap:12px 20px !important;
    }

    .hq-hero-footer span{
        text-align:left !important;
    }

    /* Uniform section spacing */
    .hq-approach,
    .hq-pillars,
    .hq-people,
    .hq-environment,
    .hq-quality{
        padding:90px 0 !important;
    }

    .hq-approach-head,
    .hq-pillars-head,
    .hq-people-head,
    .hq-environment-head{
        padding:55px 0 60px !important;
    }

    /* Keep headings within narrow screens */
    .hq-approach-head h2,
    .hq-pillars-head h2,
    .hq-people-head h2,
    .hq-environment-head h2,
    .hq-quality-title h2,
    .hq-safety-main h2{
        max-width:100% !important;
        font-size:clamp(42px,11.5vw,56px) !important;
        line-height:.88 !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }

    /* Images follow the same mobile proportion as About */
    .hq-approach-image img,
    .hq-people-image img,
    .hq-environment-image img{
        width:100% !important;
        height:auto !important;
        aspect-ratio:4/5 !important;
        object-fit:cover !important;
    }

    .hq-approach-layout,
    .hq-people-layout,
    .hq-environment-layout{
        grid-template-columns:1fr !important;
        gap:45px !important;
    }

    /* Four pillars */
    .hq-pillar{
        grid-template-columns:52px minmax(0,1fr) !important;
        gap:18px !important;
        min-height:0 !important;
        padding:30px 0 !important;
    }

    .hq-pillar-letter{
        font-size:48px !important;
    }

    .hq-pillar-title h3{
        font-size:30px !important;
        line-height:1.05 !important;
    }

    .hq-pillar > p{
        grid-column:2 !important;
        max-width:none !important;
    }

    /* Safety */
    .hq-safety{
        grid-template-columns:1fr !important;
        min-height:0 !important;
    }

    .hq-safety-image{
        width:100% !important;
        height:auto !important;
        min-height:0 !important;
        aspect-ratio:4/5 !important;
    }

    .hq-safety-image img{
        object-fit:cover !important;
    }

    .hq-safety-content{
        min-height:620px !important;
        padding-top:45px !important;
        padding-bottom:45px !important;
    }

    .hq-safety-main h2{
        margin-bottom:38px !important;
    }

    .hq-safety-principles{
        grid-template-columns:1fr 1fr !important;
        gap:14px !important;
    }

    .hq-safety-principles span{
        text-align:left !important;
    }

    /* People points */
    .hq-people-points > div{
        gap:15px !important;
    }

    .hq-people-points strong{
        font-size:14px !important;
    }

    .hq-people-points span{
        font-size:10px !important;
        text-align:right !important;
    }

    /* Quality */
    .hq-quality-layout{
        grid-template-columns:1fr !important;
        gap:42px !important;
        padding:55px 0 60px !important;
    }

    .hq-quality-row{
        grid-template-columns:1fr !important;
    }

    .hq-quality-row > div{
        min-height:140px !important;
        padding:24px 0 !important;
    }

    .hq-quality-row > div + div{
        padding-left:0 !important;
        border-left:0 !important;
        border-top:1px solid var(--line) !important;
    }

    .hq-quality-row h3{
        margin-top:30px !important;
        font-size:25px !important;
    }

    /* Metadata/dividers stay inside viewport */
    .hq-section-meta,
    .hq-dark-meta{
        width:100% !important;
        min-width:0 !important;
    }
}


/* iPhone SE / narrow phones */
@media (max-width: 480px){

    .hq-hero h1{
        font-size:clamp(43px,12.5vw,56px) !important;
        line-height:.88 !important;
    }

    .hq-approach-head h2,
    .hq-pillars-head h2,
    .hq-people-head h2,
    .hq-environment-head h2,
    .hq-quality-title h2,
    .hq-safety-main h2{
        font-size:clamp(39px,10.8vw,50px) !important;
        line-height:.9 !important;
    }

    .hq-hero-copy p{
        font-size:15px !important;
    }

    .hq-pillar-title h3{
        font-size:27px !important;
    }

    .hq-safety-content{
        min-height:590px !important;
    }
}