/* NextJobPortal responsive overrides - layout only, no content or functionality changes. Loaded after the main stylesheet. Desktop widths above 992px are untouched except for global no-overflow safeguards. */
html,body{max-width:100%;overflow-x:hidden;}
body{min-width:0;}
img,video,iframe,svg{max-width:100%;height:auto;}
table{max-width:100%;}
h1,h2,h3,h4,h5,h6,p,a,li,span,td,th{overflow-wrap:break-word;word-break:break-word;}
.container,.container-fluid{max-width:100%;}
.row{margin-left:0;margin-right:0;}
.row>*{min-width:0;}
input,select,textarea,button{max-width:100%;min-width:0;}
form{max-width:100%;}
.btn,.page-link{min-height:44px;display:inline-flex;align-items:center;justify-content:center;}
.navbar-brand img{max-width:100%;height:auto;}
.navbar{flex-wrap:wrap;}
.navbar-nav{flex-wrap:wrap;}
.pagination{flex-wrap:wrap;gap:4px;}
.pagination .page-item{flex:0 0 auto;}
@media (max-width:1024px){
.display-1{font-size:clamp(2rem,6vw,3.5rem);}
.display-2{font-size:clamp(1.9rem,5.5vw,3rem);}
.display-3{font-size:clamp(1.7rem,5vw,2.6rem);}
.display-4{font-size:clamp(1.6rem,4.5vw,2.4rem);}
h1{font-size:clamp(1.6rem,4.5vw,2.5rem);}
section{padding-left:1rem;padding-right:1rem;}
}
@media (max-width:991.98px){
.container{padding-left:1rem;padding-right:1rem;}
.navbar-brand{max-width:70vw;}
.navbar-brand img{max-width:220px;}
.navbar-collapse{width:100%;}
.navbar-nav{flex-direction:column;width:100%;}
.navbar-nav .nav-link{padding:.75rem .5rem;}
main .row>[class*='col-']{flex:0 0 100%;max-width:100%;}
.card{width:100%;}
.card-body{padding:1rem;}
.d-flex,.flex-row{flex-wrap:wrap;}
form .row>[class*='col-']{margin-bottom:.5rem;}
.form-control,.form-select{font-size:1rem;min-height:44px;}
.btn{white-space:normal;text-align:center;}
.pagination .page-link{padding:.375rem .6rem;font-size:.9rem;}
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;}
table{display:block;overflow-x:auto;}
footer .row>[class*='col-']{margin-bottom:1rem;}
}
@media (max-width:767.98px){
body{font-size:1rem;}
.navbar-brand img{max-width:180px;}
.navbar-toggler{min-height:44px;min-width:44px;}
h1{font-size:clamp(1.5rem,7vw,2rem);line-height:1.25;}
h2{font-size:clamp(1.3rem,6vw,1.75rem);}
h3{font-size:clamp(1.15rem,5vw,1.4rem);}
section{padding-top:1.5rem!important;padding-bottom:1.5rem!important;}
.row>.col-6{flex:0 0 50%;max-width:50%;}
form{width:100%;}
form input,form select,form textarea{width:100%;}
form .btn,form button[type='submit']{width:100%;min-height:48px;}
.input-group{flex-wrap:wrap;}
.input-group>*{flex:1 1 100%;border-radius:.375rem!important;margin-bottom:.5rem;}
.btn{padding:.65rem 1rem;font-size:1rem;}
.card-title{font-size:1.05rem;line-height:1.4;}
.pagination{justify-content:center;}
.alert{word-break:break-word;}
footer .d-flex{flex-direction:column;align-items:flex-start!important;}
}
@media (max-width:400px){
.navbar-brand img{max-width:150px;}
.container{padding-left:.75rem;padding-right:.75rem;}
h1{font-size:1.45rem;}
.row>.col-6{flex:0 0 100%;max-width:100%;}
.btn,.page-link{min-height:46px;}
.pagination .page-link{padding:.3rem .45rem;font-size:.85rem;}
}
@media (min-width:1400px){
img,video,iframe{max-width:100%;}
}
/* End of responsive overrides. */
/* Blog article body tightening: line-height 1.48, margin-bottom 0.6rem. Headings, font family and font sizes unchanged. */
main article p{line-height:1.48;margin-bottom:.6rem;}
main article p:empty{margin-bottom:0;}
main article p{line-height:1.48 !importantimportant;margin-bottom:.6rem !importantimportant;}main article p:not(.no-tighten){line-height:1.48;margin-bottom:.6rem;}main article p:has(>br:only-child){margin-bottom:0;line-height:0;}

/* === NextJobPortal Navy/Cyan Theme (official logo colours) - CSS only, no layout or content changes === */
:root{--njp-navy:#0C2D63;--njp-cyan:#1A9FD6;}
body{color:#1f2937;}
h1,h2,h3{color:#0C2D63;}
header h1,header h2,header h3,footer h1,footer h2,footer h3,.site-header h1,.site-header h2,.site-header h3,.site-footer h1,.site-footer h2,.site-footer h3{color:#0C2D63;}
a{color:#1A9FD6;}
a:hover,a:focus{color:#0C2D63;}
.btn-primary,.btn.btn-primary,button.btn-primary,input[type="submit"].btn-primary,.search-btn,button[type="submit"].btn-primary,form button[type="submit"],.btn-search{ background-color:#0C2D63!important;border-color:#0C2D63!important;color:#ffffff!important;}
.btn-primary:hover,.btn.btn-primary:hover,button.btn-primary:hover,.search-btn:hover{ background-color:#0C2D63!important;border-color:#0C2D63!important;color:#ffffff!important;}
.text-primary,.highlight,.accent{color:#1A9FD6!important;}
/* === End Navy/Cyan Theme === */


/* === Navy/Cyan Theme - search and primary button gradient override === */
button[type="submit"],input[type="submit"],.btn-primary,.btn.btn-primary,.search-btn,.btn-search{ background:#0C2D63!important;background-image:none!important;border-color:#0C2D63!important;color:#ffffff!important;}
a{color:#1A9FD6!important;}
/* === End gradient override === */


/* === Header logo alignment - remove the logo link's one-off left padding so the header uses only the standard container's equal left/right padding === */
header .navbar-brand, nav .navbar-brand, .navbar-brand { padding-left: 0 !important; }
/* === End header logo alignment === */


/* === HERO SUBTEXT CENTRING FIX (2026-11-02) - centres the hero lead/subtext under the H1 === */
.home-hero__lead,
.home-hero p,
.hero__lead,
p.home-hero__lead {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
  display: block;
}
/* === End HERO SUBTEXT CENTRING FIX === */


/* === HERO SUBTEXT CENTRING FIX - FOLLOW-UP (2026-11-02) - force full-width centred hero lead === */
.home-hero,
section[class*="hero"],
div[class*="hero"] {
  text-align: center !important;
}
.home-hero__lead,
.home-hero p,
.hero__lead,
p.home-hero__lead,
section[class*="hero"] p,
div[class*="hero"] p {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
  width: 100% !important;
  display: block;
}
/* === End HERO SUBTEXT CENTRING FIX - FOLLOW-UP === */

/* MOBILE HERO ORDER FIX */
@media (max-width:767.98px){.home-hero .row{display:flex;flex-direction:column;}.home-hero .row>[class*=col-]{flex:0 0 auto;}.home-hero .container .row>.col-lg-10{order:1;}.home-hero .container .row>.col-12{order:2;}}
/* === HERO H1 CONTRAST FIX (2026-11-02) - hero H1 must stay WHITE on the dark hero background, accent span stays cyan === */
.home-hero h1,
.home-hero__title,
h1.home-hero__title {
  color: #ffffff !important;
}
.home-hero h1 span,
.home-hero__title span,
h1.home-hero__title span {
  color: #1A9FD6 !important;
}
/* === End HERO H1 CONTRAST FIX === */

/* === HERO H1 ACCENT - specific .accent selector, same cyan/teal as above === */
.home-hero h1 .accent,
.home-hero__title .accent,
h1.home-hero__title .accent {
  color: #1A9FD6 !important;
}
/* === End HERO H1 ACCENT === */

/* === HERO H1 ACCENT - highest specificity === */
html body main section.home-hero h1.home-hero__title span.accent,
html body section.home-hero h1.home-hero__title span.accent {
  color: #1A9FD6 !important;
}
/* === End HERO H1 ACCENT - highest specificity === */
