:root{
--navy:#13255D;
--text:#475569;
--white:#FFFFFF;
--soft:#F8FAFC;
--gray:#E2E8F0;
--blue:#0093FB;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Arial, Helvetica, sans-serif;
background:#fff;
color:var(--text);
}

/* =========================
NAVBAR
========================= */
.makeba-navbar{
background:var(--navy);
padding:16px 0;
}

.makeba-logo{
height:30px;
width:auto;
}

.makeba-navbar .nav-link{
color:#fff !important;
font-size:14px;
font-weight:500;
margin:0 16px;
}

.btn-lang{
background:none;
border:none;
color:#fff;
font-size:14px;
display:flex;
align-items:center;
gap:8px;
}

/* =========================
COMMON
========================= */
.wrapper{
margin:auto;
}

.container-fixed{
max-width:1128px;
margin:auto;
}

.title-lg{
font-size:20px;
line-height:28px;
font-weight:500;
color:var(--text);
margin-bottom:32px;
}

.subtitle{
font-size:16px;
line-height:24px;
font-weight:500;
color:var(--text);
margin-bottom:10px;
}

.text-base,
.text-base li{
font-size:16px;
line-height:24px;
font-weight:400;
color:var(--text);
}

.text-base ul{
padding-left:20px;
margin-bottom:18px;
}

/* =========================
HERO
========================= */
.job-hero{
background:#fff;
padding:160px 76px;
min-height:502px;
display:flex;
align-items:center;
}

.job-hero-inner{
max-width:1128px;
margin:auto;
width:100%;
display:flex;
flex-direction:column;
align-items:center;
gap:40px;
text-align:center;
}

.job-hero-logo img{
width:50px;
height:50px;
object-fit:contain;
}

.job-title{
font-size:30px;
line-height:36px;
font-weight:500;
margin:0;
color:var(--text);
}

.job-subtitle{
font-size:24px;
line-height:32px;
font-weight:400;
margin:0;
color:var(--text);
}

/* =========================
CONTENT SECTION
========================= */
.content-section{
background:var(--soft);
padding:80px 76px;
}

.content-grid{
max-width:1128px;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:80px 56px;
}

.block{
width:100%;
}

.metric-wrap{
display:flex;
flex-wrap:wrap;
gap:6px;
align-items:flex-end;
margin-bottom:32px;
}

.metric-main{
font-size:20px;
line-height:28px;
font-weight:500;
}

.metric-sub{
font-size:16px;
line-height:24px;
font-weight:400;
}

/* =========================
SECOND SECTION
========================= */
.content-section-alt{
background:var(--gray);
padding:80px 76px;
min-height:380px;
}

.content-grid-2{
max-width:1128px;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:56px;
}

/* =========================
PATTERN BAR
========================= */
.banner-strip{
height:35px;
background:#fff;
overflow:hidden;
}

.banner-strip img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

/* =========================
LOCATION
========================= */
.location-section{
background:#fff;
padding:80px 76px 40px;
min-height:484px;
}

.location-wrap{
max-width:1128px;
margin:auto;
}

/* =========================
APPLY
========================= */
.apply-section{
background:#fff;
padding:40px 76px 80px;
min-height:508px;
}

.apply-card{
max-width:1128px;
margin:auto;
background:var(--soft);
border-radius:18px;
padding:48px;
}

.apply-card a{
color:var(--blue);
text-decoration:none;
}

/* =========================
FOOTER
========================= */
.makeba-footer{
background:#000;
padding:64px 76px;
color:#fff;
}

.footer-container{
max-width:1128px;
margin:auto;
}

.footer-top{
gap:18px;
margin-bottom:48px;
}

.footer-top-logo{
height:34px;
}

.footer-top-text{
font-size:18px;
line-height:28px;
}

.footer-middle{
margin-bottom:48px;
gap:40px;
}

.footer-nav-title{
font-size:20px;
font-weight:500;
margin-bottom:18px;
}

.footer-nav-link{
display:block;
color:#fff;
text-decoration:none;
font-size:18px;
margin-bottom:10px;
}

.footer-social-icons{
gap:16px;
margin-top:8px;
}

.footer-social-image img{
width:24px;
height:24px;
}

.footer-copy{
font-size:16px;
line-height:24px;
margin-bottom:24px;
color:#E2E8F0;
}

.footer-legal-text{
font-size:14px;
line-height:24px;
color:#94A3B8;
}

/* =========================
RESPONSIVE
========================= */
@media(max-width:992px){

.job-hero,
.content-section,
.content-section-alt,
.location-section,
.apply-section,
.makeba-footer{
padding-left:24px;
padding-right:24px;
}

.content-grid,
.content-grid-2{
grid-template-columns:1fr;
gap:48px;
}

.footer-middle{
flex-direction:column !important;
}

}

@media(max-width:768px){

.job-hero{
padding-top:100px;
padding-bottom:100px;
min-height:auto;
}

.job-title{
font-size:24px;
line-height:32px;
}

.job-subtitle{
font-size:18px;
line-height:28px;
}

.apply-card{
padding:28px 24px;
}

.footer-top{
flex-direction:column;
align-items:flex-start !important;
}

.footer-top-text,
.footer-nav-link{
font-size:16px;
}

}