/* ------------------------------------------------------------ */

/* COLOURS  */


/* Smooth, consistent font rendering */
html, body {
  -webkit-font-smoothing: antialiased;       /* macOS / iOS */
  -moz-osx-font-smoothing: grayscale;        /* macOS Firefox */
  font-smooth: always;                       /* non-standard but helps on some browsers */
}
.fade-in-new {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.fade-in-new.loaded {
    opacity: 1;
    transform: translateY(0);
}

:root {
    --lightblue: #F0FBFF;
    --white: #ffffff;
    --warmblack: #292828;
    --darknavy: #004765;
	--blue: #0086DB;
	--orange:  #993414;
}

.lightblue { color: var(--lightblue); }
.warmblack { color: var(--warmblack); }
.darknavy  { color: var(--darknavy); }
.white     { color: var(--white); }

.bg_orange {background-color:var(--orange);}


.bg_lightblue { background-color: var(--lightblue); }
.bg_darknavy  { background-color: var(--darknavy); }
.bg_warmblack { background-color: var(--warmblack); }
.bg_white     { background-color: var(--white); }
.bg_blue    { background-color: var(--blue); }

body {
  background-color: var(--warmblack);
  font-family: "Inter", sans-serif;
}



/* ------------------------------------------------------------ */

/* ELEMENTS & TYPOGRAPHY */

html, body {
  padding: 0px;
  height: 100%;
  margin: 0px;
  font-family: "Inter", sans-serif;
}

p  {
  font-size: 1em;
}

a {}
a:hover {}
a:active {}
a:visited {text-decoration: none;}
a i {cursor: pointer;}

h1 {
  font-size: clamp(28px, 4vw, 40px);
  font-family: "Inter", sans-serif;
  line-height: clamp(36px, 5vw, 50px);
  font-weight: 700 !important;
}

h2 {
  font-size: clamp(20px, 2.4vw, 23px);
  font-family: "Inter", sans-serif;
  font-weight: 500 !important;
}

h3 {
  font-size: clamp(18px, 2vw, 20px);
  font-family: "Inter", sans-serif;
  font-weight: 500 !important;
}

h4 {
  font-size: clamp(18px, 2vw, 20px);
  font-family: "Inter", sans-serif;
  font-weight: 500 !important;
}
h5 {}
h6 {}

ul {}
ul li {}
ol {}
ol li {}
strong, b {}
em {}
blockquote {}

input {}
label {}
select {}
textarea {}
button {}
fieldset {}
legend {}
datalist {}
output {}
option {}
optgroup {}

input type="button" {}
input type="checkbox" {}
input type="color" {}
input type="date" {}
input type="datetime-local" {}
input type="email" {}
input type="file" {}
input type="hidden" {}
input type="image" {}
input type="month" {}
input type="number" {}
input type="password" {}
input type="radio" {}
input type="range" {}
input type="reset" {}
input type="search" {}
input type="submit" {}
input type="tel" {}
input type="text" {}
input type="time" {}
input type="url" {}
input type="week" {}

iframe:focus {outline: none;}
iframe[seamless] {display: block;}

header {display: block;}
footer {display: block;}
sup { vertical-align: super; font-size: smaller;}


.four0four {padding-bottom:300px !important;}
.statementtext {
  font-size: clamp(22px, 3vw, 30px);
  line-height: 130%;
  font-weight: 700;
}

a.whitebutton {
  background-color: white;
  padding: 10px;
  padding-left: 40px;
  padding-right: 40px;
  text-transform: uppercase;
  font-size: clamp(11px, 1.1vw, 12px);
  font-weight: 700;
  color: var(--darknavy);
  border-radius: 15px;
  text-align: center;
  text-decoration: none;
  margin-top: 20px;
  transition: all 0.3s ease;
}
a.whitebutton:hover { background-color: var(--lightblue); }

a.bluebutton {
  background-color: var(--darknavy);
  padding: 10px;
  padding-left: 40px;
  padding-right: 40px;
  text-transform: uppercase;
  font-size: clamp(11px, 1.1vw, 12px);
  font-weight: 700;
  color: white;
  border-radius: 15px;
  text-align: center;
  text-decoration: none;
  margin-top: 20px;
  transition: all 0.3s ease;
  border: none;
}
a.bluebutton:hover { background-color: var(--warmblack); }

.gform_button {
  background-color: var(--darknavy);
  padding: 10px;
  padding-left: 40px;
  padding-right: 40px;
  text-transform: uppercase;
  font-size: clamp(11px, 1.1vw, 12px);
  font-weight: 700;
  color: white;
  border-radius: 15px;
  text-align: center;
  text-decoration: none;
  margin-top: 20px;
  transition: all 0.3s ease;
  border: none;
}


.two-cols {
    column-gap: 2rem;
}

@media (min-width: 992px) {
    .two-cols {
        column-count: 2;
    }
}

.gform_button:hover { background-color: var(--warmblack); }
.gform-footer {padding-bottom:60px !important;}
 
/* GENERAL STYLING */

/* overall */

body {background-color:white;}


/* navigation */
.navigationbar {padding-top:10px; text-align:right; }
.topnav {padding-top:30px; padding-bottom:30px; }

/* Text header */

.textheader {padding-top:30px; padding-bottom:30px;}

.topnav img {max-width:160px;
}


/* image header */

.fullwidth-banner {
    width: 100%;
    height: 340px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;               /* so we can vertically center inner content if needed */
    align-items: center;
}

/* Blue text block sitting over image */
.banner-text-box h1 {
    display: inline-block;
    background-color: #993414;
    color: #fff;
    padding: 10px;
    padding-left: 40px;
    padding-right: 40px;
    margin-left: -15px;
}

/* main */

.homeboxes {
  /* already has bg_lightblue on parent; just spacing */
}

/* Text block styling */
.homebox-text {
  padding: 24px 28px;
  color: var(--warmblack);
}

/* Images */
.homebox-image {
  border-radius: 16px;
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* Your H3 + line combo */

.h3-line {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-left: 24px;
}

.h3-line h3 {
  margin: 0;
  white-space: nowrap;
}

.homeboxes .h3-line .line {
  height: 2px;
  flex: 1;
  max-width: 90%;
}

/* Optional: tighter spacing on smaller screens */
@media (max-width: 767.98px) {
  .homebox-text {
    padding: 20px 18px;
    border-radius: 12px;
  }
}

.hero-banner {
    position: relative;
    width: 100%;
    height: 500px;             /* ← fixed height you asked for */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #ffffff;
    display: flex;             /* allows vertical centering if needed */
    align-items: flex-end;     /* ← pushes content to the bottom */
    padding-bottom: 40px;      /* ← spacing from bottom */
}

.hero-banner-hex {
    position: absolute;
    top: 0;
    right: 0;
    max-width: 40%;           /* tweak as needed */
    height: auto;
    z-index: 1;               /* below text */
    pointer-events: none;     /* so it doesn’t block clicks */
}

/* Text sits above the overlay image */
.hero-banner-text {
    position: relative;
    z-index: 2;
    /* Optional: add a subtle background so text is readable */
    /* background: rgba(0, 0, 0, 0.4);
       padding: 20px; */
}

/* Responsive tweak: shrink mother image on smaller screens */
@media (max-width: 992px) {
    .hero-banner {
        padding: 60px 0;
    }

    .hero-banner-hex {
        max-width: 50%;
    }
}
.newsblockhome .post-card {margin-bottom:20px;}
.h3-line {
    display: flex;
    align-items: center;     /* vertically centre text + line */
    gap: 20px;               /* space between text and line */
}

.h3-line h3 {
    margin: 0;
    white-space: nowrap;     /* prevents wrapping if desired */
}

.h3-line .line {
    flex: 1;                 /* makes the line stretch to end */
    height: 2px;             /* thickness of the line */
    background-color: #ccc;  /* grey colour */
}


.veriqwrapper {padding-top:60px; padding-bottom:60px;}



.heximage img {max-height:250px; width:auto;}
.twocols {padding-top:60px; padding-bottom:60px;}
.statement {padding-top:60px; padding-bottom:60px;}
.statementwrapper {
    position: relative;           /* allows absolutely positioned children */
}

.statement-image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 150px;                 /* adjust size */
    height: auto;
    z-index: 3;                   /* sits on top of bg but under text if needed */
    pointer-events: none;         /* prevents blocking clicks */
}

.services {padding-top:60px; padding-bottom:60px;}

.services-container {
    padding-top: 10px;
    padding-bottom: 40px;
}

.service-box {
    background: #fff;              /* or var(--lightblue) etc */
    border-radius: 8px;
    padding: 30px 20px;
    text-align: center;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;          /* vertically centre content */
    height: 100%;                     /* used with h-100 on parent col */
}

.service-icon img {
    max-width: 80px;
    height: auto;
    margin-bottom: 20px;
}

.service-title {
    font-size: clamp(16px, 1.6vw, 18px);
    margin-bottom: 10px;
    font-weight: 700;
}

.service-text {
    font-size: clamp(14px, 1.4vw, 16px);
    margin: 0;
}

/* news */

.post-card {
    background: var(--blue);
    color: #fff;
    border-radius: 16px;
    padding: 24px 20px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 250px; /* tweak to taste */
}

/* Top row: date left, icon right */
.post-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.post-card-date {
    font-size: clamp(12px, 1.4vw, 14px);
    font-weight: 600;        /* semibold */
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

/* Icon area */
.post-card-icon span,
.post-card-icon i {
    font-size: 20px;
}

/* Underline between header and title */
.post-card-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.4);
    margin-bottom: 16px;
}

/* Title at bottom, clickable */
.post-card-title {
    margin: 0;
    margin-top: auto;        /* pushes title to bottom of card */
    font-size: clamp(16px, 1.8vw, 18px);
    font-weight: 700;
}

.post-card-title a {
    color: #fff;
    text-decoration: none;
}

.post-card-title a:hover {
    text-decoration: underline;
}

@media (min-width: 992px) {
    .post-card-col {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

.post-card-icon svg {
    transition: transform .2s ease;
}

.post-card:hover .post-card-icon svg {
    transform: scale(1.1);
}
.newstext {min-height:500px;}
.newsblock {padding-top:40px;}
.newsblockhome {padding-top:40px; padding-bottom:40px;}
.newstitle {
    margin-top:25px;
    margin-bottom:10px;
    font-weight:700;
    font-size: clamp(14px, 1.6vw, 16px);
}
.newsintro {padding-right:30px; padding-bottom:30px;}
.divider {
    height: 1px;
    background: gray;
    margin-bottom: 16px;
    width:90%;
}

.morenews {padding-top:40px; padding-bottom:40px; background-color:#FBFBFB}

.morenewstitle {
    font-weight:700;
    font-size: clamp(14px, 1.6vw, 16px);
}

.storytop {min-height:100px;}

.overlapped-box {
    background: var(--blue);
    padding: 40px;
    border-radius: 16px;
    position: relative;
    color:white;
    font-weight:500;
    font-size: clamp(22px, 3vw, 30px);
    margin-top: -60px; /* adjust depending on how much overlap you want */
    z-index: 10;
}

.standfirst {padding-top:40px;}
.storydetails {
    padding-top:10px;
    padding-bottom:10px;
    background-color:#F8F8F8;
    color:black;
    font-size: clamp(14px, 1.6vw, 16px);
    border-radius:10px;
    margin-top:30px !important;
}

img {width:100%; height:auto;}
.maintext {padding-top:0px; padding-bottom:40px;}
.story-imagecontiner {padding-bottom:40px; padding-top:40px;}
.maintext a {color: var(--darknavy);}


/* footer */

footer {
    padding-top:20px;
    padding-bottom:20px;
    font-weight:500;
    font-size: clamp(12px, 1.8vw, 14px);
    padding-left:40px;
    padding-right:40px;
    border-bottom:5px solid #0086DB;
}
footer a {
    color:white;
    margin-left:20px;
    text-decoration:none;
    font-weight:500;
}



/* team */

.teamblockwrapper {padding-top:60px; padding-bottom:60px;}
.teamblockwrapper .h3-line {margin-bottom:30px;}



/* TEAM */

.boardimage img {border-radius: 50%; width:70% !important;}
.biog p { font-size:16px;}
.teamsection {background-color: #F2F2F2; padding-top:40px; padding-bottom:40px; } 
.teamsection h3 {margin-bottom:30px; text-transform:uppercase;}
.teamsection2 {background-color: #FFF; padding-top:40px; padding-bottom:40px; } 
.teamsection2 h3 {margin-bottom:30px; text-transform:uppercase;}
.board {text-align:center; margin-bottom:50px;}

.teamblock {width:40%; margin-right:30px; float:left; } 
.teamblock2 {float:left; width:50%; line-height:140%;} 

.boardimage img { filter: grayscale(100%);   -webkit-filter: grayscale(100%); transition: all 1s ease;}
.boardimage img:hover {    filter: none;   -webkit-filter: grayscale(0);}
.boardcaptionname a {font-weight:700; color:black; text-decoration:none;}

.nivo-lightbox-inline { width: 800px; margin-right:auto; margin-left: auto;}
.linkedin {margin-top:20px; margin-bottom:30px;}
.linkedin img {width:26px; height:auto;}

.partner-item { margin-top:40px;
    width: 160px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Normal state: full colour */
.partner-item img {
    max-height: 60px;
    width: auto;
    display: inline-block;
    vertical-align: baseline;
    transition: filter 0.3s ease, opacity 0.3s ease;
}

/* Hover: go grey */
.partner-item a:hover img {
    filter: grayscale(100%);
    opacity: 0.7;
}

/* First logo larger */
.partner-item--featured img {
    max-height: 85px;
}
.partner-item a {
    line-height: 1;
}

.partner-item {
    margin: 0 12px; /* horizontal spacing */
}


.partner-item:last-child {
    transform: translateY(-15px);
}

h3.partnertitle {margin-bottom:40px;}



@media (max-width: 576px) {
    .partner-item--featured img {
        max-height: 70px;
    }
}


/* MEDIA QUERIES */

@media (min-width: 992px) {
.about2 {margin-top:30px;}
}

@media (max-width: 992px) {
.mobilehide {display:none;}
.footerdetails, .footerheader, .footersocial {text-align:center !important;}
.intro-cols {column-count: 1; line-height:140% !important;}
.contactleft { padding-left:30px;}
.contactmain {padding-left:30px;}
.accreditations {display:none;}
}

@media (max-width: 576px) {
	
.teasertitle {margin-top:20px;}	
.productbox {margin-bottom:20px;}	
.mobilehide {display:none;}	
.mobileshow {display:inline;}	
.leadbannertext  {color:white; background-color: #511d47 !important; font-size:26px; line-height:40px; font-family:'Poppins', sans-serif; font-weight: 300; display:inline; ;}	
	
}

@media (max-width: 768px) {

.nivo-lightbox-inline { width: 100%;}	
.teampic {margin-bottom:20px;}
	
.teamblock  {width:100%; margin-right:0px; float:left; } 
	.teamblock 	img   {width:100%;}
.nivo-lightbox-theme-default .nivo-lightbox-ajax, .nivo-lightbox-theme-default .nivo-lightbox-inline {
    padding: 20px !important;	}
	.teamblock2  {width:90% !important; margin-right:0px !important; float:left !important; } 
.leftnav, .newsletterbox {display:none;}	
	}
	

/* ------------------------------------------------------------ */

/* HELPERS */

.hide {display: none;}


/* ------------------------------------------------------------ */