@charset "utf-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	/*	font: inherit;  */
	vertical-align: baseline;
	}



/* -------------------- common  -------------------- */     

/* body {
  background-color: #ffffff;
} */

#contain {
	margin: auto;
	}

#contain ul li { 
	display: list-item; 
	padding-right: 0px;
	padding-left: 0px;
	}

#contain ol li { 
	display: inline; 
	padding-right: 2px;
	padding-left: 2px;
	}

@media (max-width: 768px) {
    #contain {
    margin: auto;
    /* padding-top: 50px; */
    }
}

@media (max-width: 768px) and (orientation: landscape) {
  body, html {
    overflow-x: hidden;
    max-width: 100%;
  }
}

/* Main Content */
#main {
    padding-top: 60px; /* Adjust based on header height */
}

@media (max-width: 768px) {
    #main {
    padding-top: 50px;
    }
}

@media (max-height: 440px) and (orientation: landscape) {
  #main {
    margin-top: 0px;
    padding-top: 50px;
  }
}

ul.a {
    list-style-type: circle; /* ring */ 
}

ul.b {
    list-style-type: square;
}

ul.c {
    list-style-type: disc; /* solid */ 
    /* padding-left: 20px; */
}

p {
    margin-top: 0px;
    margin-bottom: 16px; /* Space after each paragraph */ 
}

/* .extra-gap {
    margin-top: 0px;
    margin-bottom: 36px;
} */

.height-10 {
	height: 10px;
}
.height-20 {
	height: 20px;
}
.height-30 {
	height: 30px;
}
.height-40 {
	height: 40px;
}
.height-50 {
	height: 50px;
}
.height-60 {
	height: 60px;
}
.height-80 {
	height: 80px;
}
.height-100 {
	height: 100px;
}

/* careful do not alter - used throughout site */
.middle-container {   
	position: relative; 
	max-width: 600px;
	height: auto; 
	margin-left: auto; 
	margin-right: auto;
	text-align: center;
    overflow-x: hidden;
    box-sizing: border-box;
	}

/* clear container noborder mobile */
.clear-container-noborder {
	position: relative;
	width: 100%;
	height: auto;
	}

    /* clear container mobile */
.clear-container,
.clear-container-placement {
	position: relative;
	width: 100%;
	height: auto;
    overflow-x: hidden;
    box-sizing: border-box;
	border-bottom-color: #cccccc; 
	border-bottom-width: 1px; 
	border-bottom-style: solid;
	}

.clear-container-placement {
	background-color: #ffffff;
    min-height: 920px;
}


/* smooth scroll to top of page (blue arrow) */
.back-to-top {
    display: none;
    position: fixed;
    bottom: 5%;
    right: 5%;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    z-index: 1000;
	}

.back-to-top img {
    width: 50px;
    height: 50px;
    }

.row::after {
	content: "";
	clear: both;
	display: table;
	}


.go-inter {
	font-family: Inter,"Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 130px;
	font-weight: normal;
	color: #333333;
    line-height: 1.05em;
    letter-spacing: -0.09em;
    text-align: center;
}

@media (max-width: 428px) {
    .go-inter {
        font-size: 110px;
  }
}



/* gopage heading title */ 
.gopage-title {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 24px;
	font-weight: normal;
	text-align: center;
	color: #333333;
	line-height: 1.618em;
	letter-spacing: -0.02em;
    padding: 10px 0px 10px 0px;
	}

/* -------------------- end common  -------------------- */











/* -------------------- top nav menu header  -------------------- */

/* new responsive css for fixed header 24 Nov 2025 */

/* Fixed Header with Background */
.top-nav-header,
.top-nav-header-move {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: linear-gradient(to right, rgb(31, 31, 31), rgb(51, 51, 51) 56%, rgb(89, 89, 89));
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    padding: 0px 0px;
    display: flex;
    align-items: center;
    gap: 0px;
    min-height: 60px;
}

.top-nav-header-move {
    position: static;
    padding: 0px 0px;
}

@media (max-width: 768px) {
    .top-nav-header {
    min-height: 50px;
  }
}

@media (max-height: 440px) and (orientation: landscape) {
  .top-nav-header {
    position: absolute;
    /* top: 0;
    left: 0;
    right: 0;
    width: 100%; */
    padding: 0 10px;
    box-sizing: border-box; /* Important! */
  }
}

/* Hamburger Button - VISIBLE */
.menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px 5px 5px 15px;
    display: flex;
    align-items: center;
    flex-shrink: 0; /* Prevents shrinking */
}

.menu-toggle img {
    display: block;
    width: 32px;
    height: 32px;
}

@media (max-width: 768px) {
    .menu-toggle img {
        width: 28px;
        height: 28px;
    }
}

@media (max-width: 480px) {
    .menu-toggle img {
        width: 26px;
        height: 26px;
    }
}

@media (max-width: 768px) and (orientation: landscape) {
  .menu-toggle img {
    width: 24px;
    height: 24px;
  }
}

.menu-toggle:hover {
    opacity: 0.7;
}

/* jg logo in top strip */
.logo-container {
    flex: 1;
    display: flex;
    justify-content: center;
}

.logo-container img {
    max-width: 300px;
    height: 30px;
    max-height: 30px;
}

@media (max-width: 768px) {
    .logo-container img {
        max-width: 200px;
        max-height: 25px;
    }
}

@media (max-width: 480px) {
    .logo-container img {
        max-width: 200px;
        max-height: 25px;
    }
}

@media (max-width: 768px) and (orientation: landscape) {
  .logo-container img {
    max-width: 200px;
    max-height: 25px;
  }
}

/* Side Navigation */
.sidenav {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: 200;
    letter-spacing: 0.05em;
    /* height: 400px; */
    height: 100vh;
    width: 0;
    position: fixed;
    z-index: 1001;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    overflow-y: auto;
    transition: width 0.3s ease;
    padding-top: 30px;
}

.sidenav.open {
    width: 250px;
}

@media (max-width: 768px) {
    .sidenav.open {
        width: 80%;
        max-width: 300px;
    }
}

.sidenav a {
    padding: 0px 35px; /* change spacing between menu links here */
    text-decoration: none;
    font-size: 16px;
    line-height: 3em;
    color: #ffffff; /* link colour */
    display: block;
    transition: color 0.3s;
}

.sidenav a:hover {
    color: #ff6600;
}

@media (max-height: 440px) and (orientation: landscape) {
    .sidenav a {
    line-height: 2.2em;
    }
}


.closebtn-2 {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 36px;
    background: none;
    border: none;
    color: #818181;
    cursor: pointer;
    padding: 10px;
    line-height: 1;
}

.closebtn-2:hover {
    color: #f1f1f1;
}

.jg-title-menu {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    
    font-weight: 300;
    color: #cecece;
    letter-spacing: 1px;
    padding: 0px 25px 15px 25px;
}

/* Overlay - Dark background when menu open */
.nav-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    transition: opacity 0.3s ease;
}

/* Overlay - blur background when menu open */
.nav-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1); /* Reduced opacity since blur adds effect */
    backdrop-filter: blur(8px); /* Add blur */
    -webkit-backdrop-filter: blur(8px); /* Safari support */
    z-index: 999;
    transition: opacity 0.3s ease, backdrop-filter 0.3s ease;
}

.nav-overlay.active {
    display: block;
}

/* -------------------- end top nav menu header  -------------------- */











/* -------------------- top head colour strip  -------------------- */

/* go top strips */  

/* new */
.go-head-strip-02 {
	position: relative;
	width: 100%;
	height: 60px;
    background-image: url(../assets/common/strip-orange-300.jpg);
    background-position: center bottom;
    /* background-repeat: no-repeat;
    overflow: hidden; */
	}

.go-head-strip-03 {
	position: relative;
	width: 100%;
	height: 60px;
    background-image: url("../assets/common/strip-vector-300.jpg");
    background-position: center bottom;
    /* background-repeat: no-repeat;
    overflow: hidden; */
	}

@media (max-width: 768px) {
    .go-head-strip-02 {
	max-height: 50px;
	}

    .go-head-strip-03 {
	max-height: 50px;
	}
}

/* 1st top main title white */
.tag-topstrip,
.tag-topstrip-under,
.tag-footer {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 17px;
	font-weight: 300;
	color: #FFFFFF;
	line-height: 1.618em;
	/* text-align: center; */
	letter-spacing: 0.05em;
    display: grid;
    align-items: center;
    justify-content: center; /* Center the grid items */
    /*padding: 0px 0px 0px 0px; */
	}

.tag-topstrip-under {
        color: #666666;
        padding: 18px 0px 0px 0px;
    }

@media (max-width: 768px) {
    .tag-topstrip,
    .tag-topstrip-under {
        font-size: 14px;
        padding: 0px 0px 0px 0px;
	}
}

.tag-footer {
        font-size: 14px;
        padding: 0px 0px 0px 0px;
    }

@media (max-width: 768px) {
    .tag-footer {
        font-size: 12px;
    }
}



/* -------------------- end top head colour strip  -------------------- */











/* -------------------- footer  -------------------- */

/* footer container */
#footer {
	position: relative;
	height: auto;
	width: 100%;
    text-align: center; 
    padding: 30px 0px 30px 0px;
    background: linear-gradient(to right, rgb(31, 31, 31), rgb(51, 51, 51) 56%, rgb(89, 89, 89));
	/* background-color: #212327; */
	/* background-image: url(../assets-new/menu/grad-dkblu-75.jpg); */
	}

#footer img {
	/* position: relative; */
    width: 154px;
	height: 30px;
    /* text-align: center; */
    /* padding: 0px 0px 0px 0px; */ 
	}

/* -------------------- end footer  -------------------- */











/* -------------------- bodytext  -------------------- */


/* go-role & go-contact page */

.bodytext-link a:link {
    color: #0099FF;
    text-decoration: none;
}
.bodytext-link a:hover {
    color: #666666;
    text-decoration: none;
}
/* .bodytext-link a:visited {
color: #0099FF;
} */
/* .bodytext-link a:active {
color: #0099FF;
} */


/* body font */
.bodytext,
.bodytext-resources,
.bodytext-linen,
.bodytext-goend,
.bodytext-goroles,
.bodytext-link,
.bodytext-goteam {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 16px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	letter-spacing: 0.0em;
	padding: 10px 15px 10px 15px;
	}

.bodytext-resources {
    padding: 0px 20px 0px 20px;
	}

/* home linen font centered */
.bodytext-linen {
	color: #333333;
	}

.bodytext-goend,
.bodytext-goroles,
.bodytext-goteam {
    text-align: left;
}

.ins-textb {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-size: 17px;
    font-weight: normal;
    color: #444444;
    line-height: 1.618em;

    margin-top: 36px;
    margin-bottom: 16px; /* Space after each paragraph */
	padding: 0px 0px 0px 0px;
    }



/* -------------------- bodytext  -------------------- */











/* -------------------- go-home  -------------------- */

/* handshake pic on index.html */
.handshake-container {
    left: 0px;
    top: 0px;
    position: relative;
    width: 100%;
    max-width: 626px;
    height: auto;
    min-height: 300px; /* Prevents collapsing too small */
    padding-bottom: 10%;
}

.handshake-container img {
    width: 100%;
    height: auto;
    display: block; /* Removes extra space below image */ 
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .handshake-container {
        margin: 0 auto; /* Center the container on go-home */
    }

    .handshake-container img {
        width: 100%; /* adjusts size of image image */
        height: auto;
        display: block; /* Removes extra space below image */
        margin: 0 auto; /* Center the image */
}

}

/* Landscape mode specifically */
@media (max-width: 956px) and (orientation: landscape) {
    .handshake-container {
        position: relative;
        margin: 0 auto;
        text-align: center;
    }

    .handshake-container img {
        width: 65%; /* Smaller in landscape for better fit */
        margin: 0 auto;
    }
}












/* index endorsements */
.index-tag, /* sincere and ... */
.index-our, /* Our specialist ... */
.index-head, /* some of our recent ...   Search local - or ... */
.index-about, /* it's about your ... */
.endorse-nologo {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 32px; /* ----------------------- font size ----------------------- */
	font-weight: normal;
	text-align: center;
	color: #333333;
	line-height: 1.618em;
	letter-spacing: -0.02em;
    margin-bottom: 0px;
    padding: 0px 10px 10px 10px;
	}

.index-tag {
    font-size: 24px;
    padding: 0px 10px 0px 10px;
}

.index-about {
    padding: 30px 10px 20px 10px;
	}

.endorse-nologo {
    font-size: 24px;
}



/* @media (max-width: 1024px) {
.index-head {
    font-size: 32px;
    }
}

@media (max-width: 768px) {
.index-head {
    font-size: 32px;
    }
}

@media (max-width: 480px) {
.index-head {
    font-size: 32px;
    padding-left: 10px;
    }
} */












/* index linen container */
#linen-strip {
	position: relative;
	width: 100%;
	height: auto;
	background-image: url(../assets/common/bg-linen.jpg);
	}

/* linen graphic */
.linen {
	background-image: url(../assets/common/bg-linen.jpg);
	}








/* ------------------------------------- start go home placements cards ------------------------------------------ */

#placements-container {
    width: 100%;
    padding: 40px 0;
    /* background-image: url("../assets/common/bg-linen.jpg"); */
    position: relative;
	overflow: hidden;
}

#placements-container::before {
	content: "";
	position: absolute;
	top: -10%;
	left: -10%;
	right: -10%;
	bottom: -10%;
	background-image: url("../assets/mood/backblur3.jpg");
	background-size: 150% 100%;
	background-position: 0% 100%; /* horz vert */
	background-repeat: no-repeat;
	transform: skew(-5deg, 2deg) rotate(-7deg);
	z-index: -1;
	opacity: 0.85;
}

/* 768 */
@media (max-width: 768px) {
    #placements-container {
        padding: 30px 0;
    }
}

.middle-container-place {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 768 */
@media (max-width: 768px) {
    .middle-container-place {
        padding: 0 15px;
    }
}

#place-row-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(292px, 292px));
    gap: 20px;
    justify-content: center;
}

/* 1024 */
@media (max-width: 1024px) {
    #place-row-grid {
        grid-template-columns: repeat(auto-fit, minmax(240px, 240px));
        gap: 18px;
    }
}

/* 768 */
@media (max-width: 768px) {
    #place-row-grid {
        grid-template-columns: repeat(auto-fit, minmax(200px, 200px));
        gap: 10px;
    }
}

/* 440 */
@media (max-width: 440px) {
    #place-row-grid {
        grid-template-columns: repeat(auto-fit, minmax(160px, 160px));
        gap: 10px;
    }
}

/* 375 */
/* @media (max-width: 375px) {
    #place-row-grid {
        grid-template-columns: repeat(auto-fit, minmax(166px, 166px));
        gap: 12px;
    }
} */

/* 667 landscape */
/* @media (max-width: 667px) and (orientation: landscape) {
    #place-row-grid {
        grid-template-columns: repeat(auto-fit, minmax(240px, 240px));
        gap: 10px;
    }
} */

/* modified ric */ 
.place-card-go {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 120px;
    text-align: center;
    letter-spacing: -0.02em;
    background-color: rgba(0, 0, 0, 0.7);
    /* background-color: rgba(255, 255, 255, 0.1); */
    border-radius: 10px;
    /* box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.7); */
    /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); */
    /* transition: transform 0.3s ease, box-shadow 0.3s ease; */
    padding: 0px 0px 0px 0px;
}

.place-card-go a {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* 1024 */
@media (max-width: 1024px) {
    .place-card-go {
        padding: 0px 0px 0px 0px;
        min-height: 120px;
    }
}

/* 768 */
@media (max-width: 768px) {
    .place-card-go {
        padding: 0px 0px 0px 0px;
        min-height: 110px;
    }
}

/* 375 */
@media (max-width: 375px) {
    .place-card-go {
        min-height: 110px;
    }
}

/* 666 landscape */
@media (max-width: 666px)  and (orientation: landscape) { 
    .place-card-go {
        max-width: 200px;
    }
}

.place-role,
.place-role2 {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-size: 18px;
    font-weight: 300;
    color: #f0f0f0;
    line-height: 1.4;
    letter-spacing: 0.02em;
    flex-grow: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 10px 0px 10px;
}

.place-role2 {
    padding: 20px 10px 0px 10px;
}

/* 768 */
@media (max-width: 768px) {
    .place-role {
        font-size: 16px;
        padding: 30px 4px 0px 4px;
    }
    .place-role2 {
        font-size: 16px;
        padding: 20px 4px 0px 4px;
    }
}

/* 440 */
@media (max-width: 440px) {
    .place-role {
        font-size: 14px;
        padding: 30px 4px 0px 4px;
    }

    .place-role:has(br) { /* experimental - if line break exists */
        padding: 0px 10px 0px 10px;
}

    .place-role2 {
        font-size: 14px;
        padding: 20px 4px 0px 4px;
    }

}

.place-company {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.618em;
    color: #666666;
    padding: 0px 0px 0px 0px; 
}

/* 375 */
@media (max-width: 375px) {
.place-company {
    display: none;
    }
}

.place-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    /* min-height: 50px; */
    margin-top: auto; /* Pushes to bottom if parent is flexbox */
    padding-bottom: 0px;
    filter: brightness(1.5) contrast(1);
}

.place-logo img {
    max-width: 120px;
    padding-bottom: 8px;
    object-fit: contain;
    /* height: auto; */
    /* max-height: 48px; */
    filter: brightness(0) invert(1); /* Makes any color white */
}

/* 768 */
@media (max-width: 768px) {
.place-logo img {
        max-width: 100px;
    }
}

/* 440 */
@media (max-width: 440px) {
.place-logo img {
        max-width: 100px;
    }
}

/* ------------------------------------- end go home placements cards ------------------------------------------ */

















/* ----------------------------- start individual placements page overlay ---------------------------------- */

.place-head-go {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 30px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	text-align: center;
    padding: 20px 0px 0px 0px;
	}

.place-appoint-go {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 18px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	text-align: center;
    padding: 0px 0px 30px 0px;
	}

.place-logo-go {
    position: relative;
	/* margin: auto;
    width: 300px;
    height: 80px; */
    /* display: flex; /* Vertical alignment */
    /* align-items: center; /* Vertical centering */
    /* justify-content: center; /* Horizontal centering */
	}

.place-logo-go img {
    max-width: 210px;
    height: auto;
    max-height: 70px;
}

.place-pic-go {
	position: relative;
    /* width: 300px; 
    height: 300px; */
	/* margin: 0px auto 0px auto; */
	/* box-shadow: 5px 3px 6px 0px rgba(0, 0, 0, 0.2); */
	/* h-offset v-offeset blur-radius spread-radius colour */
	/* border-radius: 4px; */
    padding: 0px 0px 0px 0px;
	}

.place-pic-go img {
    /* box-shadow: 5px 3px 6px 0px rgba(0, 0, 0, 0.2); */
	/* h-offset v-offeset blur-radius spread-radius colour */ 
	/* border-radius: 4px; */
    width: 300px; 
    height: 300px;
    border-radius: 4px;
    padding: 20px 0px 20px 0px;
}






/* in top strip of people placement */
.close-btn-top {
    position: absolute;
	top: 18px;
    left: 150px;
    font-size: 14px;
    background-color: #284e53;
    color: rgb(255, 255, 255);
    /* background-color: #fff; */
    /* color: rgb(41, 41, 41); */
    border: none; 
    padding: 5px 30px; 
    border-radius: 25px; 
    cursor: pointer;
}

@media (max-width: 768px) {
    .close-btn-top {
	    top: 12px;
        left: 10px;
    }
}

@media (max-width: 480px) {
    .close-btn-top {
	    top: 12px;
        padding: 5px 26px; 
        border-radius: 15px;
    }
}

/* at bottom of people placement */
.close-btn-bot {
    background-color: #284e53; 
    color: white; 
    border: none; 
    padding: 5px 30px; 
    border-radius: 25px; 
    cursor: pointer;
    margin: 10px 0px 80px 0px;
}

/* ----------------------------- end individual placements page overlay ---------------------------------- */

/* .place-jglogo-mood {
	position: absolute;
	top: -100px;
	left: -100px;
    width: 100%;
    height: 100%;
	background-image: url("../assets/common/jg-circle-w.png");
	background-size: 50%;
	background-repeat: no-repeat;
	opacity: 0.1;
	} */






















/* companies logos index & endorsements */
.logos-container-go {
    position: relative;
    width: 100%;
    height: auto;
    left: 0%;
    top: 0;
    max-width: 626px;
    /* max-width: 526px; */
    padding: 30px 0px 30px 0px;
}

.logos-container-go img {
    width: 100%;
    height: auto;
    display: block; /* Removes extra space below image */
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .logos-container-go {
        min-height: 30%;
        padding-bottom: 5%;
    }
}

/* Landscape mode specifically */
@media (max-width: 956px) and (orientation: landscape) {
    .logos-container-go {
        min-height: 200px;
        padding-bottom: 5%;
        display: flex;
        justify-content: center; /* Center content */
        align-items: center;
    }
}




/* home linen list font centered */
.go-home-bullets,
.areas-2 {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 18px;
	font-weight: normal;
	text-align: left;
	color: #666666;
	line-height: 1.2em;
	letter-spacing: -0.02em;
    padding: 0px 20px 50px 40px;
    margin-left: 15%;
	}

.areas-2 {
    font-size: 16px;
    padding: 0px 0px 0px 20px;
    margin-left: 0%;
}

.go-home-bullets li {
    margin-bottom: 25px; /* adjust value as needed */
}

@media (max-width: 440px) {
.go-home-bullets {
    margin-left: 0%;

    }
}

@media (max-height: 667px) and (orientation: landscape) {
.go-home-bullets { 
	    margin-left: 20%;
        margin-right: auto;
        max-width: 80%; /* Optional: control the width */
	}
}


/* -------------------- end go-home  -------------------- */











/* -------------------- go-international  -------------------- */


.global-text,
.reach-text {
    font-family: Inter,sans-serif;
	font-size: 100px;
	font-weight: normal;
	color: #333333;
    line-height: 1em;
	letter-spacing: -0.09em;
}

.global-text {
    position: relative;
    width: 1vw;
    left: 15%;
    padding-top: 40px;
}

.reach-text {
    position: relative;
    width: 1vw;
    left: 30%;
    padding-bottom: 30px;
}

@media (max-width: 480px) {
    .global-text {
        font-size: 80px;
        padding-top: 30px;
    }

    .reach-text {
        font-size: 80px;
        padding-bottom: 20px;
    }
}


.int-client,
.int-client-w {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	padding-left: 20px;
}

.int-client-w {
	color: #e8e8e8;
}

.go-int-bullets,
.go-int-bullets-w {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 18px;
	font-weight: normal;
    text-align: left;
	color: #666666;
	line-height: 1.618em;
    letter-spacing: 0em;
    position: relative;
	left: 0px;
	/* width: 92%; */
    padding-left: 120px;
}

.go-int-bullets-w {
    color: #e8e8e8;
}

.go-int-bullets-w.c li {
    margin-bottom: 15px;
}

.go-int-bullets-w.c li:last-child {
    margin-bottom: 0;
}

@media (max-width: 440px) {
.go-int-bullets-w {
        padding-left: 44px;
    }
}

@media (max-width: 375px) {
.go-int-bullets-w {
        padding-left: 20px;
    }
}

.title-search,
.title-search-w {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 28px;
	font-weight: normal;
	text-align: left;
	color: #333333;
	line-height: 1.618em;
	letter-spacing: -0.0em;
}

@media (max-width: 480px) {
    .title-search {
        text-align: center;
    }
}

.title-search-w {
    color: #e8e8e8;
    text-align: center;
}

@media (max-width: 480px) {
    .title-search,
    .title-search-w {
        font-size: 24px;
    }
}






.intern-container {
    width: 100%;
    padding: 40px 0;
    /* background-image: url("../assets/common/bg-linen.jpg"); */
    position: relative;
	overflow: hidden;
}

.intern-container::before {
	content: "";
	position: absolute;
	top: -10%;
	left: -10%;
	right: -10%;
	bottom: -10%;
	background-image: url("../assets/international/background-clear.png");
	background-size: 150% 100%;
	background-position: 0% 100%;
	background-repeat: no-repeat;
	transform: skew(-5deg, 2deg) rotate(-7deg);
	z-index: -1;
	opacity: 0.85;
}

/* 768 */
@media (max-width: 768px) {
    #intern-container {
        padding: 30px 0;
    }
}





.middle-container-intern {
    max-width: 600px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 768 */
@media (max-width: 768px) {
    .middle-container-intern {
        padding: 0 15px;
    }
}


.intern-line-mood {
	width: 300px;
	margin: 0 auto;
	text-align: center;
	border-color: #e8e8e8; 
	border-bottom-width: 1px; 
	border-style: solid;
	opacity: 0.4;
	padding: 35px 0px 0px 0px;
}

.intern-jglogo-mood {
    position: absolute;
    top: 25px; 
    left: 50%;
    transform: translateX(calc(-100% - 2px)); /* Positions to the left of center with 5px gap */ 

    width: 26px;
    height: 26px;
    background-image: url("../assets/common/jg-circle-w.png");
    background-size: cover;
    opacity: 0.6;
}

.intern-globe-mood {
    position: absolute;
    top: 25px; 
    left: 50%;
    transform: translateX(2px); /* Positions to the right of center with 5px gap */

    width: 26px;
    height: 26px;
    background-image: url("../assets/international/global-w.svg");
    background-size: cover;
    opacity: 0.7;
}


/* -------------------- end go-international  -------------------- */











/* -------------------- endorsements  -------------------- */

.endorse-box-logo {
    display: flex;
    align-items: center;
    justify-content: center;
	min-height: 50px;
	margin: auto;
    padding: 30px 0px 20px 0px;
	}

.endorse-box-logo img {
    max-width: 210px;
    height: auto;
    max-height: 70px;
}

/* endorsements title */
.endorse-client {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 20px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	letter-spacing: 0px;
	}

/* -------------------- end endorsements  -------------------- */











/* -------------------- go-roles  -------------------- */


/* responsive design for current roles cards */

#roles {
    width: 100%;
    padding: 45px 0;
    background-color: rgba(0, 0, 0, 0.05);
}

/* Mobile */
@media (max-width: 768px) {
    #roles {
        padding: 40px 0;
    }
}






/* .roles-row-grid {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0px 20px 0px 20px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(292px, 292px));
    gap: 20px;
    justify-content: center;
}

@media (max-width: 1024px) {
    .roles-row-grid {
        grid-template-columns: repeat(auto-fit, minmax(292px, 292px));
        gap: 15px;
    }
} */


.roles-row-flexbox {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.roles-row-flexbox > * {
    width: 292px;
    flex-shrink: 0;
}

@media (max-width: 1024px) {
    .roles-row-flexbox {
        gap: 15px;
    }
}





.roles-box {
    position: relative; /* Changed from inherit */
    height: auto;
    width: 292px;
    min-height: 180px;
    background-color: #333333;
    border-radius: 3px;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
}

.roles-box:hover {
    color: #FF5500;
    transform: translateY(-0px); /* Changed from -0px */
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.roles-box a {
    text-decoration: none;
    color: inherit;
    display: block;
}

.roles-box-blkbar {
    position: relative;
    height: 49px;
    width: 100%; /* Changed from auto */
    background-color: #222222;
    border-radius: 3px 3px 0px 0px;
}

.smrole-box-go {
	width: 50px;
    height: 50px;
    background-image: url(../assets/roles/role-box-orange.png);
    /* background-image: url(../assets-new/role-box-lg.png); */ /* cyan */
    background-size: cover;        /* Fills box, may crop */
    background-position: center;   /* Centers the image */
    background-repeat: no-repeat;  /* Prevents tiling */
	}

.ad-role-box {
    position: relative;
    top: 0px;
    left: 15px;
	width: 75px;
    height: 75px;
    background-image: url(../assets/roles/role-box-orange.png);
    /* background-image: url(../assets-new/role-box-lg.png); */ /* cyan */
    background-size: cover;        /* Fills box, may crop */
    background-position: center;   /* Centers the image */
    background-repeat: no-repeat;  /* Prevents tiling */
	}

.role-complogo {
    position: absolute;
    top: 0px;
    left: 200px;
	}

.role-complogo img {
	width: 225px;
    height: 75px;
}

/* Mobile */
@media (max-width: 768px) {
    .role-complogo {
    position: absolute;
    top: 5px;
    left: 180px;
    }

    .role-complogo img {
        width: 180px;
        height: 60px;
    }

}
    
.roles-card-loc {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-size: 13px;
    font-weight: normal;
    color: #e1e1e1;
    text-align: left;
    letter-spacing: 0.03em;

    position: absolute;
    top: 19px;
    left: 60px;
    width: 232px;
}

.roles-card-role,
.roles-card-role-2 {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.618em;
    font-weight: 300;
    color: #ffffff;
    text-align: center;
    letter-spacing: 0em;
    text-decoration: none;
    width: 100%; /* Changed from 292px */
    height: 100%;
    padding: 20px 0px 0px 0px;
    /* display: flex;
    align-items: center;
    justify-content: center; */
}

.roles-card-role-2 {
    font-size: 14px;
    color: #D9D9D9;
    letter-spacing: 0.03em;
    padding: 10px 0px 0px 0px;
}

/* Mobile */
@media (max-width: 768px) {
    .roles-card-role {
        font-size: 18px;
        padding: 20px 0px 0px 0px; /* top left bottom right */
    }
}

.anchor-roles {
    position: absolute;
    top: -10px;
    left: 0px;
    width: 40px;
    height: 40px;
}

/* Mobile */
@media (max-width: 768px) {
    .anchor-roles {
        top: 0px;
    }
}

/* small Mobile */
@media (max-height: 1366px) and (orientation: landscape) {
    .anchor-roles {
        top: -4px;
    }

}

.goroles-bullets,
.goroles-bullets-2 {
	position: relative;
	left: 20px;
	width: 92%;
	height: auto;
	text-align: left;
	}

.goroles-bullets-2 {
	left: 20px;
	}

.goroles-bullets.c {
    margin-bottom: 20px;
}

.goroles-bullets-2.a {
    margin-bottom: 20px;
}

/* .goroles-bullets.c > li {
    margin-bottom: 100px;
} */

/* roles card location */
.roles-ad-loc {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 16px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	text-align: left;
	padding: 20px 0px 0px 15px;
	}

/* roles card role */
.roles-ad-role,
.roles-ad-role2,
.roles-ad-role3 {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 28px;
	font-weight: 300;
	color: #666666;
	line-height: 1.618em;
	text-align: left;
	padding: 10px 10px 20px 15px;
	}

.roles-ad-role2 {
    padding: 10px 10px 0px 15px;
}

.roles-ad-role3 {
    font-size: 20px;
    padding: 0px 10px 20px 15px;
}

/* -------------------- end go-roles  -------------------- */











/* -------------------- go-contact  -------------------- */

/* endorse contact */
.person-name,
.person-name-contact {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 25px;
	font-weight: 300;
	color: #666666;
	line-height: 1.618em;
    letter-spacing: 0.0em;
	text-align: center;
    padding: 20px 0px 0px 0px;
	}

    /* contact */
.person-name-contact {
    padding: 0px 0px 0px 0px;
	}

    /* contact endorse */
.job-title,
.job-title-contact {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #666666;
	line-height: 1.618em;
	padding: 0px 0px 50px 0px;
	}

.job-title-contact {
	padding: 0px 0px 30px 0px;
	}

    /* phone details */
.phone a[href^="tel:"] {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 13px;
	font-weight: normal;
    color: #cccccc;
	text-decoration: none;
	line-height: 1.618em;
	letter-spacing: 0px;
	}

.person-picshad {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
	width: 206px;
	height: 206px;
	/* box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.3); */
    /* h-offset v-offeset blur-radius spread-radius colour */
    border-radius: 0px;
    padding: 50px 0px 10px 0px;
	}

.person-picshad img {
	width: 206px;
	height: 206px;
    border-radius: 0px;
	}


/* -------------------- end go-contact  -------------------- */ 









 

/* -------------------- go-insights  -------------------- */

.go-ins-bullets {
	position: relative;
	left: 20px;
	width: 92%;
	height: auto;
	text-align: left;
	}

.go-ins-bullets.c li {
    margin-bottom: 1em; /* Adjust the value as needed */
}

/* Mobile adjustments */
@media (max-width: 375px) {
    .go-ins-bullets {
        left: 10px;
    }
}


/* -------------------- end go-insights  -------------------- */











/* -------------------- go-insights  -------------------- */

.ins-anchor {
	position: absolute; 
	top: -10px; 
	left: 0px; 
	width: 40px; 
	height: auto;
	}

    /* Mobile */
@media (max-width: 768px) {
    .ins-anchor { 
	    top: 0px;
	}
}

@media (max-height: 1366px) and (orientation: landscape) {
    .ins-anchor { 
	    top: -4px;
	}
}

.ins-card-go {
    display: flex;
    flex-direction: column;
    width: 292px;
    /* max-width: 292px; */ 
    min-height:180px;
    /* align-items: center; */
    /* justify-content: center; */

    background-image: url("../assets/common/strip-vector-300.jpg");
    background-position: 5% 50%;
    background-repeat: no-repeat;

    border-radius: 3px;
    
    box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.4);
    /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); */
    /* transition: transform 0.3s ease, box-shadow 0.3s ease; */
    box-sizing: border-box; /* added 26 Nov 2025 */
    /* padding: 0px 0px 0px 0px; */
}

.ins-card-title {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 24px;
	font-weight: 300;
	color: #FFFFFF;
	line-height: 1.618em;
	text-align: center;
	letter-spacing: 0em;
	padding: 20px 20px 28px 20px;
	}

    /* Mobile */
@media (max-width: 768px) {
    .ins-card-title {
	    font-size: 24px;
	}
}

.ins-card-title-2 {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 24px;
	font-weight: 300;
	color: #FFFFFF;
	line-height: 1.618em;
	text-align: center;
	letter-spacing: 0em;
	padding: 10px 20px 10px 20px;
	}

.ins-card-title-tag {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 16px;
	font-weight: 300;
	color: #FFFFFF;
	line-height: 1.618em;
	text-align: center;
	letter-spacing: 0em;
	padding: 0px 20px 0px 20px;
	}

.ins-squ-box-go {
    position: relative;
    top: 15px;
    left: 15px;
	width: 76px;
    height: 76px;
    background-image: url("../assets/common/strip-vector-300.jpg");
    background-position: 5% 50%;
    background-repeat: no-repeat;
    border-radius: 3px;
    box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.4);
	}

/* .ins-squ-box-go {
    position: relative;
    top: 0px;
    left: 15px;
	width: 75px;
    height: 75px;
    background-image: url("../assets/insights/insights-box.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
	} */

.ins-jg-logo,
.ins-box-logo {
	position: absolute;
	top: 18px; 
	left: 18px;
	width: 40px;
    height: 40px;
	background-image: url("../assets/common/jg-circle-w.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
	opacity: 0.7;
	}

.ins-jg-logo {
    position: relative;
	top: 10px; 
	left: 10px;
	width: 28px;
    height: 28px;
	background-image: url("../assets/common/jg-circle-w.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
	opacity: 0.2;
}

/* end insights */


/* responsive for insights */

.ins-row-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(292px, 292px));
    gap: 20px;
    padding: 20px;
    max-width: 700px; /* adjust here for 2 or 3 cards horz */
    margin: 0 auto;
    align-items: center;
    justify-content: center;
    box-sizing: border-box; /* added 26 Nov 2025 */
  }
    
.ins-row-grid a {
    text-decoration: none;
    box-sizing: border-box; /* added 26 Nov 2025 */
  }

@media (max-width: 480px) {
    .ins-row-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
        max-width: 340px;
    }
}

/* 14 January 2006 - changed from ins-row-grid to ins-row-flexbox */
.ins-row-flexbox {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
    max-width: 700px;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.ins-row-flexbox > * {
    width: 292px;
    flex-shrink: 0;
}
    
.ins-row-flexbox a {
    text-decoration: none;
    box-sizing: border-box;/
}

/* Small mobile */
@media (max-width: 480px) {
    .ins-row-flexbox {
        gap: 1rem;
        max-width: 340px;
    }
    
    .ins-row-flexbox > * {
        width: 100%;
    }
}













/* article */
.ins-artitle-go {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 24px;
	font-weight: 300; /* light weight */
	color: #666666;
	line-height: 1.618em;
    padding:30px 15px 20px 15px;
	}

/* Mobile Responsive for cards on insights */  

/* Tablet */
@media (max-width: 1024px) {
    .ins-artitle-go {
        font-size: 24px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .ins-artitle-go {
        font-size: 24px;;
    }
}

/* Small mobile */
@media (max-width: 480px) {
    .ins-artitle-go {
        font-size: 22px;
    }
}

/* -------------------- end go-insights  -------------------- */











/* -------------------- go-resources  -------------------- */

.title-resources {
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-size: 32px;
	font-weight: normal;
	text-align: center;
	color: #333333;
	line-height: 1.618em;
	letter-spacing: -1px;
    padding: 20px 0px 20px 0px;
}

/* ----- linkedin logo pos ----- */
.linkedin-pos-go {
	/* position: absolute;  */
	/* top: 10px;  */
	/* left: 0px;  */
	height: 30px; 
	width: 200px;
    padding-top: 20px;
    margin-left: auto;
    margin-right: auto;
}

/* responsive for video */

.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* end responsive for video */

/* -------------------- end go-resources  -------------------- */








.left {
    text-align: left;
}








/* --- not used --- */

/* concrete container */
#concrete-container {
	position: relative;
	width: 100%;
	height: auto;
	background-position: center;
	background-color: #f7f7f7;
	background-image: url(../assets/common/strip-clear.jpg);
	}

/* companies logos index & endorsements */
.image-section {
    position: relative; /* Needed for absolute positioning inside */
    width: 100%;
    height: auto;
    min-height: 300px; /* Prevents collapsing too small */
    padding-bottom: 10%;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .image-section {
        min-height: 30%;
        padding-bottom: 5%;
    }
}

/* Landscape mode specifically */
@media (max-width: 956px) and (orientation: landscape) {
    .image-section {
        min-height: 200px;
        padding-bottom: 5%;
        display: flex;
        justify-content: center; /* Center content */
        align-items: center;
    }
}
/* --- not used --- */