.section-hero .headline {
    margin-top: 475px;
}

@media only screen and (max-width: 1068px) {
    .section-hero .headline {
        margin-top: 380px; 
    }
}

@media only screen and (max-width: 734px) {
    .section-hero .headline {
        margin-top: calc(628px + max(500px, min(1000px, 100vh))/2 - var(--video-height)/2); 
    }  
}

html.hero-enhanced .section-hero.slide .headline {
    max-width: 620px;
}

@media only screen and (max-width: 1068px) {
	html.hero-enhanced .section-hero.slide .headline {
   		max-width: 544px;
    }  
}

@media only screen and (max-width: 734px) {

	html.hero-enhanced .section-hero.slide .headline {
    	max-width: 324px;
	}
}

/* 20230323 headline h1 */
@media only screen and (max-width: 1068px){
    .section-hero .intro>span {
        max-width: 480px;
    }

    .backdrop #modal-headline-skills , .untc{
        font-family: "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
        font-size: 14px !important;
    }
}

.section-health-and-safety .card-health-and-safety .card-headline {
    max-width: 5.5em;
}
.section-health-and-safety .card-wellness .card-headline {
    max-width: 6em;
}

/* 20230322 badges width */
.modal .badge-value {
    min-width: 50%;
}

.modal .badge-value.breadth-l {
    min-width: 512px;
}

.modal .badge-value.breadth-m {
    min-width: 400px;
}


.modal .badge-value.breadth-s,.modal .badge-value.breadth-ss {
    min-width: 332px;
}

.section-hero .subhead {
    margin-top: 121px;
}

@media only screen and (max-width: 1068px) {
    .section-hero .subhead {
        margin-top: 92px
    }

    .modal .badge-value {
        min-width: 22%;
    }

    .modal .badge-value.breadth-l {
        min-width: 322px;
    }

    .modal .badge-value.breadth-m {
        min-width: 250px;
    }

    .modal .badge-value.breadth-s {
        min-width: 216px;
    }

    .modal .badge-value.breadth-ss {
        min-width: 212px;
    }

    .modal .badge-content {
        align-items: center;
    }


    .section-environment .card-carbon-neutral .card-headline {
        max-width: 5.1em;
    }
}

@media only screen and (max-width: 734px) {

    .modal .badge-value.breadth-l {
        min-width: 268px;
    }
    .modal .badge-value.breadth-m {
        min-width: 212px;
    }
    .modal .badge-value.breadth-s {
        min-width: 166px;
    }

    .modal .badge-value.breadth-ss {
        min-width: 124px;
    }
    
    .section-hero .subhead {
        margin-top: 84px
    }
}


br.ss-small,br.sss-small,br.little-small,br.m-small {
    display: none;
}
@media only screen and (max-width: 500px) {
      br.sss-small {
        /* display: block; */
    }

    .modal .badge-value.breadth-l {
        min-width: 220px;
    }
    html[lang=zh-HK] .badge.control br.small-show {
        display: none;
    }
}

@media only screen and (max-width: 430px) {
    .modal .badge-value.breadth-m {
        min-width: 194px;
    }
}
@media only screen and (max-width: 430px) {
    .modal .badge-value.breadth-m {
        min-width: 146px;
    }
    br.ss-small {
        display: block;
    }
    br.m-small {
        display: block;
    }
}

/* iphone 11 */
@media only screen and (min-width: 410px) and (max-width: 420px) {

    .modal .badge-value {

    }
    .badge-value .gradient-text {
        display: block;
    }

    .br.sss-small {
        display: none;
    }

}

@media only screen and (max-width: 375px) {
    br.sss-small {
        display: block;
    }
    html[lang=zh-HK] .badge.n-control br.small-show {
        display: none;
    }
    br.little-small {
        display: block;
    }
    .modal .badge-value.breadth-l {
        min-width: 156px;
    }
    .modal .badge-value.breadth-s {
        min-width: 114px;
    }
    .modal .badge-value.breadth-ss {
        min-width: 120px;
    }
    .modal-trigger {
        font-size: 26px;
    }
}
@media only screen and (max-width: 320px) {

    .modal .badge-value.breadth-l {
        min-width: 142px;
    }
    .modal .badge-value.breadth-m {
        min-width: 134px;
    }
    .modal .badge-value.breadth-s {
        min-width: 106px;
    }
    .sm-r5 {
        position: relative;
    }
}
/* 2023/3/27 */
.backdrop #modal-headline-skills , .untc{
    font-family: "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
    font-size: 18px !important;
}

.section-environment .cover-headline {
    max-width: 8em;
}

.badges-container .badge-large span.badge-value {
    text-align: right;
}
.modal .gradient-text {
    text-align: right;
}
