/* =========================================================
   ABC MANPOWER — Editorial design system
   Author : Webhouse Nepal
   Stack  : HTML5 + Bootstrap 5 + CSS3 + jQuery
   ---------------------------------------------------------
   Design language: hairline rules instead of drop shadows,
   near-square corners, a strict grid, generous whitespace and
   orange used only as a highlight. Colours are sampled from
   the company logo.
   ---------------------------------------------------------
   1.  Tokens
   2.  Base & type
   3.  Rules, labels, section furniture
   4.  Buttons & tags
   5.  Header
   6.  Video hero
   7.  Grid cards (bordered, not floating)
   8.  Job rows
   9.  Countries, process, stats
   10. Quote, notices, journal
   11. Page masthead
   12. Forms
   13. Footer
   14. Utilities & responsive
   ========================================================= */

/* ============ 1. TOKENS ============ */
:root{
  /* brand — sampled from the logo */
  --navy-950:#050f1d;
  --navy-900:#081c33;
  --navy-800:#0e2440;
  --navy-700:#102848;
  --navy-600:#173a63;
  --navy-500:#22507f;

  --orange-600:#c86820;
  --orange-500:#e8862a;
  --orange-400:#f19c46;
  --orange-050:#fdf3e8;

  /* neutrals — warm, paper-like */
  --paper:#ffffff;
  --paper-2:#faf9f7;
  --paper-3:#f2f0ec;
  --rule:#e2ded7;
  --rule-strong:#cdc7bd;

  --ink:#14181d;
  --ink-2:#4d545c;
  --ink-3:#83898f;

  --ok:#1f7a4d;
  --warn:#b4741a;
  --stop:#b8402f;

  /* an editorial system uses almost no radius */
  --r-xs:2px;
  --r-sm:3px;
  --r-pill:100px;

  --ff-display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --ff-body:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;
  --ff-mono:'IBM Plex Mono','SFMono-Regular',Menlo,monospace;

  --shell:1280px;
  --header-h:76px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ============ 2. BASE & TYPE ============ */
*{ -webkit-tap-highlight-color:transparent; }
html{ scroll-behavior:smooth; scroll-padding-top:96px; }
body{
  font-family:var(--ff-body);
  font-size:16px;
  line-height:1.7;
  color:var(--ink-2);
  background:var(--paper);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--ff-display);
  color:var(--navy-800);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.022em;
  margin:0 0 .6em;
}
h1{ font-size:clamp(2.4rem,5.4vw,4.4rem); font-weight:800; letter-spacing:-.032em; }
h2{ font-size:clamp(1.85rem,3.5vw,3rem); font-weight:800; letter-spacing:-.03em; }
h3{ font-size:clamp(1.35rem,2.2vw,1.9rem); font-weight:800; }
h4{ font-size:1.16rem; }
h5{ font-size:1rem; }
p{ margin:0 0 1.1rem; }
a{ color:var(--navy-600); text-decoration:none; transition:color .22s var(--ease); }
a:hover{ color:var(--orange-600); }
img{ max-width:100%; height:auto; display:block; }
ul{ padding-left:1.15rem; }
strong{ color:var(--navy-800); font-weight:600; }
::selection{ background:var(--orange-500); color:#fff; }

.container{ max-width:var(--shell); padding-left:1.5rem; padding-right:1.5rem; }
@media (max-width:575.98px){
  .container{ padding-left:1.25rem; padding-right:1.25rem; }
  .row.g-5, .row.g-5.mb-5{ --bs-gutter-x:2rem; }
  .hero-actions .btn{ flex:1 1 100%; }
}
.lede{ font-size:1.12rem; line-height:1.72; color:var(--ink-2); }
.t-navy{ color:var(--navy-800)!important; }
.t-orange{ color:var(--orange-600)!important; }
.t-mute{ color:var(--ink-3)!important; }
.mono{ font-family:var(--ff-mono); }

/* ============ 3. RULES, LABELS, SECTION FURNITURE ============ */
.section{ padding:104px 0; }
.section-sm{ padding:64px 0; }
.section-tight{ padding:0 0 104px; }
.bg-paper2{ background:var(--paper-2); }
.bg-paper3{ background:var(--paper-3); }
.bg-navy{ background:var(--navy-800); color:rgba(255,255,255,.72); }
.bg-navy h1,.bg-navy h2,.bg-navy h3,.bg-navy h4,.bg-navy h5{ color:#fff; }

.rule{ border:0; border-top:1px solid var(--rule); margin:0; opacity:1; }
.rule-dark{ border-top-color:rgba(255,255,255,.14); }

/* numbered section label: 01 —— Services */
.slabel{
  display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--ff-display); font-size:.74rem; font-weight:700;
  letter-spacing:.17em; text-transform:uppercase; color:var(--navy-800);
  margin-bottom:1.3rem;
}
.slabel .num{
  background:var(--orange-500); color:var(--navy-900); font-weight:800;
  padding:.32rem .5rem; line-height:1; letter-spacing:.06em;
}
.bg-navy .slabel{ color:#fff; }
.bg-navy .slabel .num{ background:var(--orange-500); color:var(--navy-900); }

.shead{ max-width:720px; }
.shead p{ margin-bottom:0; }
.shead-split{
  display:flex; flex-wrap:wrap; align-items:flex-end;
  justify-content:space-between; gap:1.5rem 2.5rem;
}
.shead-split .shead{ margin-bottom:0; }

/* top hairline that opens a section */
.section-top-rule{ border-top:1px solid var(--rule); }

/* ============ 4. BUTTONS & TAGS ============ */
.btn{
  font-family:var(--ff-display); font-weight:700; font-size:.82rem;
  letter-spacing:.07em; text-transform:uppercase; border-radius:var(--r-xs);
  padding:.9rem 1.7rem; border:2px solid transparent;
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  transition:background-color .22s var(--ease),color .22s var(--ease),border-color .22s var(--ease);
}
.btn:focus-visible{ outline:2px solid var(--orange-500); outline-offset:2px; box-shadow:none; }
.btn i{ font-size:1rem; }

.btn-orange{ background:var(--orange-500); border-color:var(--orange-500); color:var(--navy-900); }
.btn-orange:hover,.btn-orange:focus{ background:var(--orange-400); border-color:var(--orange-400); color:var(--navy-900); }

.btn-navy{ background:var(--navy-800); border-color:var(--navy-800); color:#fff; }
.btn-navy:hover,.btn-navy:focus{ background:var(--navy-900); border-color:var(--navy-900); color:#fff; }

.btn-line{ background:transparent; border-color:var(--navy-800); color:var(--navy-800); }
.btn-line:hover{ background:var(--navy-800); border-color:var(--navy-800); color:#fff; }

.btn-line-light{ background:transparent; border-color:rgba(255,255,255,.4); color:#fff; }
.btn-line-light:hover{ background:#fff; border-color:#fff; color:var(--navy-800); }

.btn-lg{ padding:1.1rem 2.2rem; font-size:.9rem; }
.btn-sm{ padding:.55rem 1.1rem; font-size:.74rem; }

/* text link with a moving underline */
.tlink{
  font-family:var(--ff-display); font-weight:600; font-size:.9rem;
  color:var(--navy-800); display:inline-flex; align-items:center; gap:.45rem;
  padding-bottom:.18rem; border-bottom:1px solid var(--rule-strong);
}
.tlink i{ transition:transform .25s var(--ease); font-size:.95rem; }
.tlink:hover{ color:var(--orange-600); border-bottom-color:var(--orange-500); }
.tlink:hover i{ transform:translateX(4px); }
.bg-navy .tlink{ color:#fff; border-bottom-color:rgba(255,255,255,.3); }
.bg-navy .tlink:hover{ color:var(--orange-400); border-bottom-color:var(--orange-400); }

.tag{
  display:inline-flex; align-items:center; gap:.34rem;
  font-family:var(--ff-display); font-size:.68rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  padding:.34rem .62rem; border:1px solid var(--rule-strong); color:var(--navy-800);
  border-radius:var(--r-xs); line-height:1.5; background:var(--paper);
}
.tag-orange{ border-color:#f0d3ad; background:var(--orange-050); color:var(--orange-600); }
.tag-navy{ border-color:#c9d5e4; background:#eef2f7; color:var(--navy-600); }
.tag-ok{ border-color:#bfe0cd; background:#eef7f2; color:var(--ok); }
.tag-stop{ border-color:#eec7c1; background:#fdf0ee; color:var(--stop); }
.tag-solid{ background:var(--navy-800); border-color:var(--navy-800); color:#fff; }

/* ============ 5. HEADER ============ */
.utility{
  background:var(--navy-950); color:rgba(255,255,255,.66);
  font-size:.79rem; padding:.5rem 0; letter-spacing:.005em;
}
.utility a{ color:rgba(255,255,255,.62); }
.utility a:hover{ color:#fff; }
.utility .u-item{ display:inline-flex; align-items:center; gap:.4rem; }
.utility .u-item i{ color:var(--orange-400); font-size:.9rem; }
.utility .u-div{ width:1px; height:12px; background:rgba(255,255,255,.16); display:inline-block; }

.masthead{
  background:var(--navy-800); border-bottom:3px solid var(--orange-500);
  position:sticky; top:0; z-index:1030;
  transition:background-color .3s var(--ease),box-shadow .3s var(--ease);
}
.masthead.stuck{ background:var(--navy-900); box-shadow:0 8px 26px rgba(5,15,29,.3); }
.navbar{ padding:0; min-height:var(--header-h); }
.navbar-brand{ padding:0; margin-right:2rem; }
.navbar-brand img{ height:48px; width:auto; }

.navbar .nav-link{
  font-family:var(--ff-display); font-weight:700; font-size:.82rem;
  letter-spacing:.06em; text-transform:uppercase;
  color: white; padding:.6rem .8rem!important; position:relative;
}
.navbar .nav-link::after{
  content:""; position:absolute; left:.8rem; right:.8rem; bottom:-.1rem; height:3px;
  background:var(--orange-500); transform:scaleX(0); transform-origin:left;
  transition:transform .28s var(--ease);
}
.navbar .nav-link:hover,.navbar .nav-item.active > .nav-link{ color:#fff; }
.navbar .nav-item.active > .nav-link::after,.navbar .nav-link:hover::after{ transform:scaleX(1); }
.navbar .dropdown-toggle::after{ display:none; }
.navbar .caret{
  font-size:.64rem; margin-left:.15rem; opacity:.6; display:inline-block;
  transition:transform .25s var(--ease),opacity .25s var(--ease);
}
.navbar .nav-link:hover .caret,.navbar .dropdown.show > .nav-link .caret{ opacity:1; }
.navbar .dropdown.show > .nav-link .caret{ transform:rotate(180deg); }

.navbar .dropdown-menu{
  border:1px solid var(--rule); border-top:3px solid var(--orange-500);
  border-radius:0 0 var(--r-sm) var(--r-sm); padding:.4rem;
  margin-top:0; min-width:246px; box-shadow:0 18px 40px rgba(5,15,29,.22);
}
/* transparent bridge so the pointer can reach the menu */
.navbar .dropdown-menu::before{ content:""; position:absolute; left:0; right:0; top:-.6rem; height:.6rem; }
.navbar .dropdown-item{
  font-family:var(--ff-display); font-size:.85rem; font-weight:600; padding:.55rem .7rem;
  border-radius:var(--r-xs); color:var(--ink-2);
}
.navbar .dropdown-item:hover,.navbar .dropdown-item:focus{ background:var(--navy-800); color:#fff; }

.navbar-toggler{ border:2px solid rgba(255,255,255,.3); border-radius:var(--r-xs); padding:.3rem .5rem; }
.navbar-toggler:focus{ box-shadow:none; }
.navbar-toggler i{ font-size:1.3rem; color:#fff; vertical-align:middle; }

.head-actions{ display:flex; align-items:center; gap:1.1rem; }
.head-actions .btn{ white-space:nowrap; padding:.7rem 1.15rem; font-size:.75rem; }
.head-tel{
  font-family:var(--ff-display); font-weight:700; font-size:.86rem;
  color:#fff; white-space:nowrap; letter-spacing:.02em;
}
.head-tel i{ color:var(--orange-400); margin-right:.35rem; }
/* mobile: the collapsed menu drops onto the navy bar */
/* Tablet and phone: the menu opens as a white panel below the navy bar, so the
   links have to flip from white to dark or they vanish into the background. */
@media (max-width:1199.98px){
  .navbar-collapse{
    background:var(--paper); border:1px solid var(--rule); margin:.6rem 0 1rem;
    padding:.8rem; max-height:74vh; overflow-y:auto;
  }
  .navbar .nav-link{
    padding:.65rem .7rem!important; font-size:.95rem;
    color:var(--navy-800);
  }
  .navbar .nav-link:hover,
  .navbar .nav-item.active > .nav-link,
  .navbar .dropdown.show > .nav-link{ color:var(--orange-600); }
  .navbar .nav-link .caret{ opacity:.8; }
  .navbar .nav-link::after{ display:none; }
  .navbar .nav-item.active > .nav-link{ background:var(--paper-3); }
  .navbar .dropdown-menu{ border:0; border-left:2px solid var(--rule); border-radius:0; margin-left:.6rem; box-shadow:none; }
  .navbar .dropdown-item{ color:var(--ink-2); }
  .navbar .dropdown-item:hover,
  .navbar .dropdown-item:focus{ background:var(--paper-3); color:var(--navy-800); }
  .head-actions{ width:100%; }
  .head-actions .btn{ width:100%; }
  .head-tel{ display:none; }
}

/* ============ 6. VIDEO HERO ============ */
.hero{
  position:relative; background:var(--navy-900); overflow:hidden;
  min-height:min(84vh,760px); display:flex; align-items:flex-end;
}
.hero-media{ position:absolute; inset:0; z-index:0; }
.hero-media video,
.hero-media .hero-poster{
  width:100%; height:100%; object-fit:cover; display:block;
}
.hero-media .hero-poster{ position:absolute; inset:0; }
.hero-media video{ position:relative; z-index:1; }
.hero-media video.is-hidden{ display:none; }

/* dark on the left for the copy, clear on the right for the footage */
.hero::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(90deg,
    rgba(6,20,38,.94) 0%, rgba(8,24,45,.88) 30%,
    rgba(10,32,58,.62) 56%, rgba(12,38,68,.22) 80%, rgba(12,38,68,.05) 100%);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(to bottom, rgba(6,20,38,.55) 0%, rgba(6,20,38,0) 26%,
             rgba(6,20,38,0) 62%, rgba(6,20,38,.6) 100%);
}
.hero > .container{ position:relative; z-index:3; padding-top:120px; padding-bottom:0; }

.hero-kicker{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--ff-display); font-size:.74rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--navy-900); background:var(--orange-500);
  padding:.45rem .8rem; margin-bottom:1.6rem;
}
.hero h1{ color:#fff; max-width:16ch; margin-bottom:1.5rem; }
.hero h1 em{ font-style:normal; color:var(--orange-400); }
.hero-actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-bottom:64px; }

/* stat ticker sitting on the bottom edge of the hero */
.hero-ticker{
  position:relative; z-index:3; background:var(--orange-500);
}
.hero-ticker .row > div{ border-left:1px solid rgba(8,28,51,.16); }
.hero-ticker .row > div:first-child{ border-left:0; }
.tick{ padding:22px 4px 22px 24px; }
.tick .tk-n{
  font-family:var(--ff-display); font-size:2rem; font-weight:800;
  color:var(--navy-900); line-height:1; letter-spacing:-.025em;
}
.tick .tk-n span{ color:var(--navy-900); }
.tick .tk-l{
  font-family:var(--ff-display); font-size:.7rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(8,28,51,.72); margin-top:.4rem;
}
.hero-ticker .row > div:first-child .tick{ padding-left:0; }

/* small "scroll" cue */
.hero-scroll{
  position:absolute; right:28px; bottom:104px; z-index:3;
  writing-mode:vertical-rl; font-family:var(--ff-mono); font-size:.68rem;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.5);
  display:flex; align-items:center; gap:.7rem;
}
.hero-scroll::after{ content:""; width:2px; height:44px; background:var(--orange-500); }

/* ============ 7. GRID CARDS ============ */
/* A bordered grid: one hairline between cells, no shadows. */
.gridset{ border-top:1px solid var(--rule); border-left:1px solid var(--rule); }
.gridset > [class*="col-"]{
  border-right:1px solid var(--rule); border-bottom:1px solid var(--rule);
  padding:0;
}
.cell{
  padding:38px 34px; height:100%; position:relative;
  transition:background-color .3s var(--ease);
}
.cell:hover{ background:var(--paper-2); }
.cell::before{
  content:""; position:absolute; left:0; top:0; height:4px; width:0;
  background:var(--orange-500); transition:width .38s var(--ease);
}
.cell:hover::before{ width:100%; }
.cell-n{
  font-family:var(--ff-display); font-size:.72rem; font-weight:700; letter-spacing:.14em;
  color:var(--ink-3); margin-bottom:1.3rem; display:block;
}
.cell-ico{
  width:56px; height:56px; display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:var(--orange-600); background:var(--orange-050);
  border:1px solid #f0d3ad; margin-bottom:1.2rem;
  transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.cell:hover .cell-ico{ background:var(--orange-500); border-color:var(--orange-500); color:var(--navy-900); }
.cell h4{ margin-bottom:.6rem; }
.cell h4 a{ color:var(--navy-800); }
.cell h4 a:hover{ color:var(--orange-600); }
.cell p{ font-size:.95rem; margin-bottom:1.1rem; }
.cell .tlink{ font-size:.85rem; }

/* plain bordered box */
.box{
  border:1px solid var(--rule); background:var(--paper);
  border-radius:var(--r-sm); padding:30px 28px;
}
.box-flush{ padding:0; overflow:hidden; }
.box-pad{ padding:30px 28px; }

/* ============ 8. JOB ROWS ============ */
/* Vacancies read as an editorial list, not a card grid. */
.joblist{ border-top:1px solid var(--rule); }
.jobrow{
  display:grid; grid-template-columns:1fr auto; gap:1rem 2rem;
  padding:26px 0; border-bottom:1px solid var(--rule);
  transition:background-color .28s var(--ease);
}
.jobrow:hover{ background:var(--paper-2); box-shadow:inset 4px 0 0 var(--orange-500); }
.jobrow .jr-main{ min-width:0; }
.jobrow .jr-tags{ display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.7rem; }
.jobrow h3{
  font-size:1.28rem; margin-bottom:.45rem; letter-spacing:-.018em;
}
.jobrow h3 a{ color:var(--navy-800); }
.jobrow h3 a:hover{ color:var(--orange-600); }
.jobrow .jr-emp{
  font-size:.9rem; color:var(--ink-3); display:flex; flex-wrap:wrap;
  align-items:center; gap:.4rem 1.1rem;
}
.jobrow .jr-emp span{ display:inline-flex; align-items:center; gap:.35rem; }
.jobrow .jr-emp i{ color:var(--orange-500); font-size:.9rem; }
.jobrow .jr-side{
  display:flex; flex-direction:column; align-items:flex-end;
  justify-content:center; gap:.7rem; text-align:right;
}
.jobrow .jr-pay{
  font-family:var(--ff-display); font-weight:800; font-size:1.14rem;
  color:var(--navy-900); white-space:nowrap; letter-spacing:-.01em;
}
.jobrow .jr-pay small{
  display:block; font-family:var(--ff-body); font-weight:400;
  font-size:.76rem; color:var(--ink-3);
}
.jobrow.is-urgent{ box-shadow:inset 4px 0 0 var(--orange-500); padding-left:20px; margin-left:-20px; }

/* filter rail */
.rail{ border-top:1px solid var(--rule); padding-top:22px; }
.rail{ border-top-width:3px; border-top-color:var(--navy-800); }
.rail h5{
  font-family:var(--ff-display); font-size:.74rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--navy-800); margin-bottom:.9rem;
}
.rail-group + .rail-group{ margin-top:1.9rem; padding-top:1.6rem; border-top:1px solid var(--rule); }
.rail-check{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:.5rem; }
.rail-check .form-check-label{ font-size:.9rem; color:var(--ink-2); cursor:pointer; }
.rail-check .rc-n{ font-family:var(--ff-mono); font-size:.72rem; color:var(--ink-3); }
.form-check-input:checked{ background-color:var(--orange-500); border-color:var(--orange-500); }
.form-check-input:focus{ box-shadow:0 0 0 .16rem rgba(232,134,42,.2); border-color:var(--orange-400); }

.resultbar{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:.8rem; padding-bottom:14px; border-bottom:1px solid var(--rule); margin-bottom:6px;
}
.resultbar .rb-c{ font-family:var(--ff-mono); font-size:.8rem; color:var(--ink-3); letter-spacing:.06em; }
.resultbar .rb-c b{ color:var(--navy-800); }
.emptystate{ padding:80px 20px; text-align:center; border-bottom:1px solid var(--rule); }
.emptystate i{ font-size:2rem; color:var(--rule-strong); display:block; margin-bottom:.8rem; }

/* ============ 9. COUNTRIES, PROCESS, STATS ============ */
.dest{ display:block; position:relative; }
.dest-img{ position:relative; overflow:hidden; aspect-ratio:3/3.4; background:var(--paper-3); }
.dest-img img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.dest:hover .dest-img img{ transform:scale(1.05); }
.dest-tag{
  position:absolute; left:0; top:0; z-index:2;
  font-family:var(--ff-display); font-size:.68rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  background:var(--orange-500); color:var(--navy-900); padding:.38rem .75rem;
}
.dest-body{ padding-top:16px; display:flex; align-items:baseline; justify-content:space-between; gap:1rem; }
.dest-body h4{ margin:0; font-size:1.1rem; }
.dest-body .d-n{ font-family:var(--ff-mono); font-size:.76rem; color:var(--ink-3); white-space:nowrap; }
.dest:hover .dest-body h4{ color:var(--orange-600); }

/* numbered process, laid out as a ruled row */
.steps{ border-top:1px solid var(--rule); }
.step{
  padding:34px 30px 34px 0; border-bottom:1px solid var(--rule); height:100%;
  position:relative;
}
.step .st-n{
  width:52px; height:52px; display:flex; align-items:center; justify-content:center;
  font-family:var(--ff-display); font-size:1.35rem; font-weight:800;
  background:var(--navy-800); color:#fff; line-height:1; margin-bottom:1rem;
  transition:background-color .3s var(--ease);
}
.step:hover .st-n{ background:var(--orange-500); color:var(--navy-900); }
.step h5{ margin-bottom:.45rem; }
.step p{ font-size:.93rem; margin:0; }

/* stats band on navy */
.band{ background:var(--navy-800); border-top:5px solid var(--orange-500); }
.band .row > div{ border-left:1px solid rgba(255,255,255,.13); }
.band .row > div:first-child{ border-left:0; }
.band-item{ padding:52px 4px 52px 30px; }
.band .row > div:first-child .band-item{ padding-left:0; }
.band-item .bn{
  font-family:var(--ff-display); font-size:2.8rem; font-weight:800; color:#fff;
  line-height:1; letter-spacing:-.03em;
}
.band-item .bn span{ color:var(--orange-400); }
.band-item .bl{
  font-family:var(--ff-display); font-size:.72rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.62); margin-top:.6rem;
}

/* two-column reasons list */
.reason{ display:flex; gap:1.1rem; padding:22px 0; border-bottom:1px solid var(--rule); }
.reason .rn{
  font-family:var(--ff-display); font-size:.76rem; font-weight:800; color:var(--orange-600);
  padding-top:.28rem; flex:0 0 auto;
}
.reason h5{ margin-bottom:.3rem; font-size:1.02rem; }
.reason p{ margin:0; font-size:.93rem; }

/* checklist */
.ticks{ list-style:none; padding:0; margin:0; }
.ticks li{ position:relative; padding-left:1.7rem; margin-bottom:.6rem; font-size:.96rem; }
.ticks li::before{
  content:"\F26E"; font-family:"bootstrap-icons"; position:absolute; left:0; top:0;
  color:var(--orange-500); font-size:1rem; line-height:1.7;
}
.bg-navy .ticks li{ color:rgba(255,255,255,.76); }

/* ============ 10. QUOTE, NOTICES, JOURNAL ============ */
.quote-wrap{ position:relative; }
.quote{
  font-family:var(--ff-display); font-weight:500; font-size:clamp(1.3rem,2.5vw,1.9rem);
  line-height:1.42; color:var(--navy-800); letter-spacing:-.018em; margin-bottom:1.8rem;
}
.quote-by{ display:flex; align-items:center; gap:1rem; }
.quote-by img{ width:54px; height:54px; object-fit:cover; border-radius:50%; }
.quote-by strong{ display:block; font-family:var(--ff-display); color:var(--navy-800); font-size:1rem; }
.quote-by small{ font-size:.85rem; color:var(--ink-3); }
.quote-stars{ color:var(--orange-500); font-size:.85rem; letter-spacing:.12em; margin-bottom:1.1rem; }

/* notices as a ruled list */
.notice-row{
  display:grid; grid-template-columns:104px 1fr auto; gap:1.4rem;
  padding:24px 0; border-bottom:1px solid var(--rule); align-items:start;
  transition:background-color .28s var(--ease);
}
.notice-row:hover{ background:var(--paper-2); }
.notice-row:hover{ box-shadow:inset 4px 0 0 var(--orange-500); }
.notice-row .nd{
  font-family:var(--ff-display); font-size:.76rem; font-weight:700; color:var(--orange-600);
  letter-spacing:.1em; padding-top:.3rem; text-transform:uppercase;
}
.notice-row h5{ font-size:1.04rem; margin-bottom:.35rem; }
.notice-row h5 a{ color:var(--navy-800); }
.notice-row h5 a:hover{ color:var(--orange-600); }
.notice-row p{ font-size:.92rem; margin:0; }
.notice-row .nx{ padding-top:.2rem; }

/* journal (blog) */
.entry{ display:block; height:100%; }
.entry-img{ overflow:hidden; aspect-ratio:16/10; background:var(--paper-3); margin-bottom:18px; }
.entry-img img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.entry:hover .entry-img img{ transform:scale(1.05); }
.entry-meta{
  font-family:var(--ff-display); font-size:.7rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3); display:flex; gap:1rem; margin-bottom:.6rem;
}
.entry h4{ font-size:1.1rem; margin-bottom:.5rem; }
.entry h4 a{ color:var(--navy-800); }
.entry:hover h4 a{ color:var(--orange-600); }
.entry p{ font-size:.94rem; margin-bottom:.9rem; }

/* logo strip */
.client{
  height:92px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  border:1px solid var(--rule); text-align:center; line-height:1.35;
  font-family:var(--ff-display); font-weight:700; font-size:.94rem;
  color:var(--ink-3); letter-spacing:.02em; padding:.8rem;
  transition:color .28s var(--ease),border-color .28s var(--ease);
  overflow-wrap:anywhere;
}
.client small{ display:block; font-weight:400; font-size:.72rem; }
.client:hover{ color:#fff; background:var(--navy-800); border-color:var(--navy-800); }

/* accordion, restyled flat */
.accordion-item{ border:0; border-bottom:1px solid var(--rule); border-radius:0!important; background:transparent; }
.accordion-item:first-of-type{ border-top:1px solid var(--rule); }
.accordion-button{
  font-family:var(--ff-display); font-weight:600; font-size:1.04rem; color:var(--navy-800);
  padding:1.25rem 2.5rem 1.25rem 0; background:transparent; box-shadow:none!important;
}
.accordion-button:not(.collapsed){ background:transparent; color:var(--orange-600); }
.accordion-button::after{
  background-image:none; content:"\F64D"; font-family:"bootstrap-icons";
  width:auto; height:auto; font-size:1rem; color:var(--ink-3); transform:none;
  position:absolute; right:0;
}
.accordion-button:not(.collapsed)::after{ content:"\F63B"; color:var(--orange-600); }
.accordion-body{ padding:0 2.5rem 1.5rem 0; font-size:.97rem; }

/* CTA panel */
.cta{
  background:var(--navy-800); color:rgba(255,255,255,.78);
  padding:64px 56px; position:relative; overflow:hidden;
  border-left:8px solid var(--orange-500);
}
.cta::before{
  content:""; position:absolute; right:-90px; top:-90px; width:340px; height:340px;
  background:var(--orange-500); opacity:.14; transform:rotate(32deg);
}
.cta::after{
  content:""; position:absolute; right:-30px; bottom:-120px; width:240px; height:240px;
  background:var(--orange-400); opacity:.09; transform:rotate(32deg);
}
.cta > *{ position:relative; z-index:1; }
.cta h2{ color:#fff; }
.cta p{ margin-bottom:0; }

/* ============ 11. PAGE MASTHEAD ============ */
.pagehead{
  background:var(--navy-800); position:relative; overflow:hidden;
  padding:84px 0 76px; border-bottom:5px solid var(--orange-500);
}
.pagehead .ph-img{ position:absolute; inset:0; }
.pagehead .ph-img img{ width:100%; height:100%; object-fit:cover; opacity:.52; }
.pagehead::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg,rgba(8,28,51,.94),rgba(10,32,58,.72) 60%,rgba(12,38,68,.4));
}
.pagehead > .container{ position:relative; z-index:2; }
.pagehead h1{ color:#fff; font-size:clamp(1.9rem,3.8vw,3rem); margin-bottom:.5rem; }
.pagehead p{ color:rgba(255,255,255,.7); max-width:640px; margin:0; }
.crumbs{
  font-family:var(--ff-display); font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.5); margin-bottom:1.1rem; display:flex; flex-wrap:wrap; gap:.5rem;
}
.crumbs a{ color:rgba(255,255,255,.62); }
.crumbs a:hover{ color:var(--orange-400); }
.crumbs span.sep{ opacity:.45; }
.crumbs .here{ color:var(--orange-400); }

/* ============ 12. FORMS ============ */
.form-label{
  font-family:var(--ff-display); font-size:.72rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--navy-800); margin-bottom:.45rem; display:block;
}
.form-label .req{ color:var(--orange-600); }
.form-control,.form-select{
  border:1px solid var(--rule); border-radius:var(--r-xs); padding:.78rem .95rem;
  font-size:.95rem; color:var(--ink); background-color:var(--paper);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.form-control::placeholder{ color:#a9a49c; }
.form-control:focus,.form-select:focus{
  border-color:var(--orange-400); box-shadow:0 0 0 .16rem rgba(232,134,42,.16); background:var(--paper);
}
.form-control.is-invalid,.form-select.is-invalid{ border-color:var(--stop); background-image:none; }
.form-control.is-valid,.form-select.is-valid{ border-color:var(--ok); background-image:none; }
.invalid-feedback{ font-size:.78rem; }
textarea.form-control{ min-height:132px; resize:vertical; }
.form-check-label{ font-size:.92rem; }

.formblock{ border:1px solid var(--rule); background:var(--paper); padding:34px 32px; }
.formblock-head{
  display:flex; align-items:center; gap:.9rem; padding-bottom:1.1rem;
  margin-bottom:1.6rem; border-bottom:1px solid var(--rule);
}
.formblock{ border-top:4px solid var(--orange-500); }
.formblock-head .fh-n{
  background:var(--orange-500); color:var(--navy-900); font-family:var(--ff-display);
  font-size:.72rem; font-weight:800; letter-spacing:.06em; padding:.32rem .5rem; line-height:1;
}
.formblock-head h4{ margin:0; font-size:1.1rem; }
.formblock-head small{ display:block; font-size:.82rem; color:var(--ink-3); font-weight:400; }

.dropfile{
  display:flex; align-items:center; gap:.85rem; width:100%;
  border:1px dashed var(--rule-strong); border-radius:var(--r-xs);
  padding:.68rem .95rem; background:var(--paper-2); cursor:pointer;
  transition:border-color .25s var(--ease),background-color .25s var(--ease);
}
.dropfile:hover{ border-color:var(--orange-400); background:var(--orange-050); }
.dropfile i{ font-size:1.3rem; color:var(--orange-500); flex:0 0 auto; }
.dropfile span{ font-size:.9rem; font-weight:600; color:var(--navy-800); line-height:1.35; }
.dropfile small{ display:block; font-weight:400; font-size:.76rem; color:var(--ink-3); }
.dropfile input[type=file]{ display:none; }
.filename{ font-size:.82rem; color:var(--ok); margin-top:.35rem; font-weight:600; }
.formnote{ font-size:.84rem; color:var(--ink-3); }
.alert-clean{
  background:#eef7f2; border:1px solid #bfe0cd; color:#15603c;
  border-radius:var(--r-xs);
}

/* spec table */
.spec{ width:100%; }
.spec tr{ border-bottom:1px solid var(--rule); }
.spec tr:last-child{ border-bottom:0; }
.spec td{ padding:.78rem 0; font-size:.93rem; vertical-align:top; }
.spec td:first-child{ color:var(--ink-3); width:46%; font-family:var(--ff-mono); font-size:.8rem; letter-spacing:.04em; }
.spec td:last-child{ color:var(--navy-800); font-weight:600; }

.sticky-col{ position:sticky; top:calc(var(--header-h) + 24px); }

/* article body */
.prose h4{ font-size:1.16rem; margin:2rem 0 .8rem; }
.prose h4:first-child{ margin-top:0; }
.prose ul{ padding-left:0; list-style:none; }
.prose ul li{ position:relative; padding-left:1.6rem; margin-bottom:.55rem; font-size:.96rem; }
.prose ul li::before{
  content:""; position:absolute; left:.25rem; top:.72em; width:5px; height:5px;
  background:var(--orange-500); border-radius:50%;
}

/* pagination */
.pagination .page-link{
  border:1px solid var(--rule); color:var(--navy-800); font-family:var(--ff-mono);
  font-size:.85rem; margin:0 .15rem; border-radius:var(--r-xs); padding:.5rem .85rem;
}
.pagination .page-item.active .page-link{ background:var(--navy-800); border-color:var(--navy-800); color:#fff; }
.pagination .page-link:hover{ background:var(--paper-3); }

/* document row */
.docrow{
  display:flex; align-items:center; gap:1.1rem; padding:20px 0;
  border-bottom:1px solid var(--rule);
}
.docrow .dc-i{ font-size:1.4rem; color:var(--orange-500); flex:0 0 auto; }
.docrow h5{ margin:0 0 .1rem; font-size:1rem; }
.docrow small{ font-family:var(--ff-mono); font-size:.74rem; color:var(--ink-3); letter-spacing:.04em; }

/* team */
.person-img{ aspect-ratio:1/1.12; overflow:hidden; background:var(--paper-3); margin-bottom:14px; }
.person-img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.person:hover .person-img img{ transform:scale(1.04); }
.person h5{ margin-bottom:.1rem; font-size:1.02rem; }
.person .p-role{
  font-family:var(--ff-display); font-size:.72rem; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--orange-600);
}
.person p{ font-size:.9rem; margin:.6rem 0 0; }

/* contact details list */
.contactlist{ list-style:none; padding:0; margin:0; border-top:1px solid var(--rule); }
.contactlist li{
  display:flex; gap:1.1rem; align-items:flex-start;
  padding:22px 0; border-bottom:1px solid var(--rule);
}
.contactlist > li > i{
  width:44px; height:44px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  background:var(--orange-050); border:1px solid #f0d3ad;
  color:var(--orange-600); font-size:1.15rem;
}
.contactlist h5{
  font-family:var(--ff-display); font-size:.74rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-3); margin-bottom:.35rem;
}
.contactlist div{ min-width:0; overflow-wrap:anywhere; font-size:1rem; color:var(--navy-800); }
.contactlist a{ color:var(--navy-800); font-weight:600; }
.contactlist a:hover{ color:var(--orange-600); }
.contactlist small{ display:block; font-size:.85rem; color:var(--ink-3); font-weight:400; margin-top:.25rem; }

/* map */
.mapbox{ border:1px solid var(--rule); border-top:4px solid var(--orange-500); line-height:0; }
.mapbox iframe{ width:100%; height:430px; border:0; }

/* ============ 13. FOOTER ============ */
.site-foot{ background:var(--navy-900); color:rgba(255,255,255,.62); padding-top:76px; border-top:5px solid var(--orange-500); }
.foot-logo{ height:52px; margin-bottom:1.2rem; }
.site-foot p{ font-size:.92rem; }
.foot-title{
  font-family:var(--ff-display); font-size:.76rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:#fff; margin-bottom:1.3rem;
  padding-bottom:.7rem; border-bottom:2px solid var(--orange-500); display:inline-block;
}
.foot-links{ list-style:none; padding:0; margin:0; }
.foot-links li{ margin-bottom:.55rem; }
.foot-links a{ color:rgba(255,255,255,.6); font-size:.91rem; }
.foot-links a:hover{ color:var(--orange-400); }
.foot-contact{ list-style:none; padding:0; margin:0; }
.foot-contact li{ display:flex; gap:.7rem; margin-bottom:.9rem; font-size:.91rem; overflow-wrap:anywhere; }
.foot-contact i{ color:var(--orange-500); font-size:1rem; margin-top:.2rem; flex:0 0 auto; }
.foot-contact a{ color:rgba(255,255,255,.6); }
.foot-contact a:hover{ color:var(--orange-400); }
.foot-licence{
  border:1px solid rgba(255,255,255,.14); padding:.75rem .9rem; font-size:.82rem;
  display:flex; gap:.6rem; margin-top:1.2rem;
}
.foot-licence i{ color:var(--orange-400); font-size:1.05rem; }
.foot-social{ display:flex; gap:.45rem; margin-top:1.3rem; }
.foot-social a{
  width:36px; height:36px; border:1px solid rgba(255,255,255,.16);
  display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.7);
  font-size:.95rem; transition:all .25s var(--ease);
}
.foot-social a:hover{ background:var(--orange-500); border-color:var(--orange-500); color:var(--navy-900); }
.foot-bottom{
  border-top:1px solid rgba(255,255,255,.1); margin-top:60px; padding:22px 0;
  font-size:.85rem; color:rgba(255,255,255,.45);
}
.foot-bottom a{ color:rgba(255,255,255,.55); }
.foot-bottom a:hover{ color:var(--orange-400); }
.foot-bottom .fb-l{ display:flex; gap:1.3rem; justify-content:flex-end; flex-wrap:wrap; }

/* ============ 14. UTILITIES & RESPONSIVE ============ */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
.reveal.seen{ opacity:1; transform:none; }

#toTop{
  position:fixed; right:22px; bottom:22px; width:42px; height:42px;
  background:var(--navy-800); color:#fff; border:0; display:flex;
  align-items:center; justify-content:center; font-size:1.05rem;
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:all .3s var(--ease); z-index:1040; border-radius:var(--r-xs);
}
#toTop.on{ opacity:1; visibility:visible; transform:none; }
#toTop:hover{ background:var(--orange-500); }

.mobilebar{ display:none; }

.arrows{ display:flex; gap:.4rem; }
.arrows button{
  width:42px; height:42px; border:1px solid var(--rule); background:var(--paper);
  color:var(--navy-800); font-size:1.05rem; border-radius:var(--r-xs);
  transition:all .25s var(--ease);
}
.arrows button:hover{ background:var(--navy-800); border-color:var(--navy-800); color:#fff; }

@media (max-width:1199.98px){
  .navbar .nav-link{ padding:.55rem .6rem!important; font-size:.86rem; }
  .navbar .nav-link::after{ left:.6rem; right:.6rem; }
}
@media (min-width:1200px) and (max-width:1439.98px){
  .head-tel{ display:none; }
}
@media (max-width:1199.98px){
  .navbar-collapse{
    background:var(--paper); border:1px solid var(--rule); margin:.6rem 0 1rem;
    padding:.8rem; max-height:74vh; overflow-y:auto;
  }
  .navbar .nav-link{ padding:.65rem .7rem!important; font-size:.95rem; }
  .navbar .nav-link::after{ display:none; }
  .navbar .nav-item.active > .nav-link{ background:var(--paper-3); }
  .navbar .dropdown-menu{ border:0; border-left:2px solid var(--rule); border-radius:0; margin-left:.6rem; box-shadow:none; }
  .head-actions{ width:100%; }
  .head-actions .btn{ width:100%; }
  .head-tel{ display:none; }
}
@media (max-width:991.98px){
  .section{ padding:72px 0; }
  .section-tight{ padding-bottom:72px; }
  .hero{ min-height:auto; }
  .hero > .container{ padding-top:96px; }
  .hero-actions{ margin-bottom:48px; }
  .hero-scroll{ display:none; }
  .hero::before{
    background:linear-gradient(180deg,rgba(6,20,38,.9) 0%,rgba(8,24,45,.82) 55%,rgba(10,32,58,.78) 100%);
  }
  .cta{ padding:44px 32px; }
  .sticky-col{ position:static; }
  .band-item{ padding:34px 4px 34px 22px; }
  .step{ padding-right:20px; }
}
@media (max-width:767.98px){
  body{ font-size:15.5px; }
  .section{ padding:56px 0; }
  .section-sm{ padding:40px 0; }
  .section-tight{ padding-bottom:56px; }
  .cell{ padding:28px 22px; }
  .box{ padding:24px 20px; }
  .formblock{ padding:24px 20px; }
  .cta{ padding:36px 22px; }
  .hero h1{ max-width:none; }
  .hero-ticker .row > div{ border-left:0; border-top:1px solid rgba(255,255,255,.13); }
  .hero-ticker .row > div:nth-child(-n+2){ border-top:0; }
  .tick{ padding:16px 0; }
  .hero-ticker .row > div .tick{ padding-left:0; }
  .tick .tk-n{ font-size:1.45rem; }
  .band .row > div{ border-left:0; border-top:1px solid rgba(255,255,255,.13); }
  .band .row > div:nth-child(-n+2){ border-top:0; }
  .band-item{ padding:26px 0; }
  .band-item .bn{ font-size:1.9rem; }
  .jobrow{ grid-template-columns:1fr; }
  .jobrow .jr-side{ align-items:flex-start; text-align:left; flex-direction:row;
                    justify-content:space-between; width:100%; }
  .jobrow.is-urgent{ margin-left:0; padding-left:14px; }
  .notice-row{ grid-template-columns:1fr; gap:.5rem; }
  .notice-row .nd{ padding-top:0; }
  .step{ padding:26px 0; }
  .foot-bottom .fb-l{ justify-content:flex-start; margin-top:.6rem; }
  .mobilebar{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:1035;
    background:var(--paper); border-top:1px solid var(--rule); padding:.55rem .8rem; gap:.55rem;
  }
  .mobilebar .btn{ flex:1; }
  body.has-bar{ padding-bottom:68px; }
  #toTop{ bottom:76px; }
}
@media (max-width:575.98px){
  .hero h1{ font-size:2.15rem; }
  .quote{ font-size:1.2rem; }
}

@media print{
  .utility,.masthead,.site-foot,#toTop,.mobilebar,.hero-media{ display:none!important; }
}