/*
Theme Name: Total Child Theme
Theme URI: https://your-site.com
Description: Your site description. Go to Appearance > Editor to modify this file.
Author: Your Name
Author URI: https://your-site.com
Template: Total
Version: 1.0
*/


/*
------------
COLOURS
------------
*/
/* Brand palette — defaults; overridden per-site in each site's Custom CSS */
:root {
  --brand-accent: #623CE5;
  --brand-link:   #623CE5;
}

/*
------------
404 PAGE STYLING
------------
*/
.error404 .page-header{
  display:none !important
}

.error404-content{
  padding:100px 0 100px 0 !important
}

/*
------------
FONTS
------------
*/
@font-face {
  font-family: "Roobert";
  src: url(./fonts/Roobert-Bold.woff2) format("woff2"), url(./fonts/Roobert-Bold.woff) format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roobert";
  src: url(./fonts/Roobert-Light.woff2) format("woff2"), url(./fonts/Roobert-Light.woff) format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roobert";
  src: url(./fonts/Roobert-Medium.woff2) format("woff2"), url(./fonts/Roobert-Medium.woff) format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roobert";
  src: url(./fonts/Roobert-Regular.woff2) format("woff2"),
       url(./fonts/Roobert-Medium.woff) format("woff");  /* safety net */
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roobert";
  src: url(./fonts/Roobert-SemiBold.woff2) format("woff2"), url(./fonts/Roobert-SemiBold.woff) format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Roobert", sans-serif !important;
}


.counterTitle {
  font-family: "Roobert", sans-serif !important;
}



h1, h1.vcex-heading, h2, h2.vcex-heading, h3, h3.vcex-heading, h4, h4.vcex-heading, h5, h5.vcex-heading, h6, h6.vcex-heading, p {
  font-family: "Roobert" !important;
  color:#170133 !important;
}

h1.black, h2.black, h3.black, h4.black, h5.black, h6.black, p.black,
.black h1, .black h2, .black h3, .black h4, .black h5, .black h6, .black p {
  color: #170133 !important;
  font-weight: 700 !important;
}



h1, h1.vcex-heading {

  font-size: min(max(42px + 30 * ((100vw - 768px) / 1152), 42px), 72px);
  line-height: 133%;
  margin-bottom: min(max(10px + 8 * ((100vw - 768px) / 1152), 10px), 18px);
  position: relative;
}

@media(max-width:370px) {
  h1, h1.vcex-heading {
  font-size: 35px !important;
  }
}

h1:after, h1.vcex-heading:after {
  content: ".";
  font-family: serif;
  font-size: min(max(65px + 35 * ((100vw - 375px) / 1065), 65px), 100px);
  line-height: 0;
  color: var(--brand-accent);
}

h2, h2.vcex-heading  {
  color: var(--dark__blue);
  font-size: min(max(35px + 21 * ((100vw - 768px) / 1152), 35px), 56px);
  line-height: 100%;
  font-family: var(--font-main);
  font-weight: 700;
  position: relative;

  margin: 0 auto;
}


.mediaHubTitle h1.vcex-heading:after{content: ".";
    font-family: serif;
    font-size: min(max(65px + 35 * ((100vw - 375px) / 1065), 65px), 100px);
    line-height: 0;
    color: #fff !important;
  }

@media(max-width:370px) {

  h2, h2.vcex-heading  {
  font-size: 33px;
  }
}

h2:after, h2.vcex-heading:after  {
  content: ".";
  font-family: serif;
  font-size: min(max(55px + 35 * ((100vw - 375px) / 1065), 55px), 90px);
  line-height: 0;
  color: var(--brand-accent);

}

h3, h3.vcex-heading {
  color: var(--dark__blue);
  font-size: min(max(24px + 14 * ((100vw - 375px) / 1065), 24px), 38px);
  line-height: 100%;
  font-family: var(--font-main);
  font-weight: 500;
  position: relative;
  width: fit-content;
  margin: 0 auto;
}

h3:after, h3.vcex-headin:after {
  content: ".";
  font-family: serif;
  font-size: min(max(35px + 21 * ((100vw - 768px) / 1152), 35px), 56px);
  line-height: 0;
  color: var(--brand-accent);
}

h4, h4.vcex-heading {
  color: var(--dark__blue);
  font-size: min(max(24px + 11 * ((100vw - 768px) / 1152), 24px), 35px);
  font-family: var(--font-main);
  font-weight: 500;
  line-height: 130%;
  margin-bottom: min(max(16px + 4 * ((100vw - 768px) / 1152), 16px), 20px);
}

h5 , h5.vcex-heading{
  font-size: min(max(20px + 6 * ((100vw - 768px) / 1152), 20px), 26px);
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: min(max(10px + 8 * ((100vw - 768px) / 1152), 10px), 18px);
}

h6, h6.vcex-heading {

  font-size: min(max(18px + 4 * ((100vw - 768px) / 1152), 18px), 22px);
  font-weight: 500;
  line-height: 2;
}

p {

  font-size: min(max(15px + 9 * ((100vw - 768px) / 1152), 15px), 24px);
  font-weight: 300;
  line-height: 200%}

p:not(:last-child) {

  margin-bottom: min(max(10px + 15 * ((100vw - 768px) / 1152), 10px), 25px);

}

p a{font-weight:600 !important}



#site-main a {
  font-size: min(max(14px + 2 * ((100vw - 768px) / 1152), 14px), 16px);
  color: #161626 !important;
  font-family: inherit;
  line-height: 1.5;
}

#site-main{font-size:1rem}

/* Callout heading + its trailing dot */
.callout,
.callout .vcex-heading-inner {
  color: var(--brand-accent);
}
.callout .vcex-heading-inner::after {
  content: ".";
  color: var(--brand-accent);
}

/* Callout + "black" together: dark bold, dot included */
.callout.black,
.black .callout {
  --brand-accent: #170133;
  font-weight: 700 !important;
}

/* Callout headings — Roobert */
span.vcex-heading.callout,
span.vcex-heading.callout .vcex-heading-inner {
  font-family: "Roobert", sans-serif !important;
  font-weight: 600;
}

/* Content hyperlinks */
.entry a:not(.wpex-social-btn):not(.vcex-social-links__item) {
  color: var(--brand-link);
}

h1.vcex-heading.lefttitle, h1.lefttitle{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
}
h2.vcex-heading.lefttitle, h3.lefttitle{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
}

h3.vcex-heading.lefttitle, h4.lefttitle{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
}
h4.vcex-heading.lefttitle, h5.lefttitle{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
}


/* Raw content pasted into Text Blocks (privacy policy, etc.) */

/* Accent-coloured bullets and list numbers, text stays as-is */
.wpb_text_column ul li::marker,
.wpb_text_column ol li::marker {
  color: var(--brand-accent, #623CE5);
}

/* 40px under headings pasted as H tags — leaves vcex heading blocks alone */
.wpb_text_column h1,
.wpb_text_column h2,
.wpb_text_column h3,
.wpb_text_column h4,
.wpb_text_column h5,
.wpb_text_column h6 {
  margin-bottom: 30px;
  width:100%;
}

ul li, ol li{
  font-size: min(max(15px + 9 * ((100vw - 768px) / 1152), 15px), 24px);
  font-weight: 300;
  line-height: 200%;
  line-height: 32px;
  margin-bottom:21px
}

ul, ol{
  margin-bottom: 40px;
}

/* Brand-coloured bullets and list numbers, site-wide */
ul li::marker{
  color:var(--brand-accent, #623CE5);
}
ol li::marker{
  color:var(--brand-accent, #623CE5);
  font-weight:600;
}

blockquote{
  background-color:var(--brand-accent, #623CE5);
  border-radius:0px 52px 0px 52px;
  padding:30px 50px 30px 50px;
}

blockquote p{color:#fff !important; font-weight:600 !important; font-size:40px !important; line-height:48px !important}

blockquote h6{color:#fff !important}

blockquote::before{display:none !important}

.smallQuote {font-size:21px !important}

/*
------------
HEADER
------------
*/


#site-header{
  box-shadow:0 8px 24px -10px rgba(23,1,51,.20);
}

/* Always use the burger — hide Total's built-in nav */
#site-navigation{ display:none !important; }

/* Portfolio/page titles over background images: lift off the photo */
.background-image-page-header .page-header-title {
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.35), 0 10px 30px rgba(0, 0, 0, 0.35);
}

h1.page-header-title{
  color:#fff !important;
font-family: "Roobert" !important;
font-size:120px !important;
font-weight:700 !important;
text-transform:uppercase !important
}

h1.page-header-title:after{display:none !important}

.page-header{min-height:800px !important}


/*
------------
CASE STUDIES
------------
*/

.single-portfolio .page-header {
  background-size:cover !important;
  min-height:500px
}

.single-portfolio .page-header.background-image-page-header:not(.wpex-supports-mods) .page-header-title {
  font-weight: 700;
  color:#fff !important
}


.single-portfolio .page-header{
  background-attachment: scroll !important;
}

/* Profile-style image badge poking up into the header */
.profile-badge{
  width:170px;
  height:170px;
  margin:-120px auto 36px;       /* negative top lifts it up over the header edge */
  padding:18px;
  background:#fff;
  border-radius:20px;            /* 50% = circle; 10px 40px 40px 40px = brand corner mask */
  box-shadow:0 18px 40px -18px rgba(23,1,51,.35);
  position:relative;
  z-index:5;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
}
.profile-badge .vcex-image-inner,
.profile-badge .vcex-image-inner a{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%;
}
.profile-badge img{
  width:100%; height:100%;
  object-fit:contain;            /* fits the wide Sky logo in the square, no distortion */
}

/* Case-study featured image — centred square, brand corners, drop shadow */
.v5-dls--cases .v5-dls__media{
  display:flex;
  align-items:center;
  justify-content:center;
}
.v5-dls--cases .v5-dls__img{
  width:300px;
  height:300px;
  max-width:100%;
  object-fit:contain;
  background:#fff;
  padding:28px;
  box-sizing:border-box;
  border-radius:0px 52px 0px 52px;   /* same corner mask as the download image */
  box-shadow:0 18px 40px -18px rgba(23,1,51,.35);
}

/*
------------
COUNTERS
------------
*/
.lgx_counter_value{
  font-size:52px !important;
  color:var(--brand-accent, #623CE5) !important;
  font-family: "Roobert";
  text-align:center !important;
  font-weight:700 !important
}

.counterTitle{
  font-size: min(max(15px + 9 * ((100vw - 768px) / 1152), 15px), 24px);
  font-weight: 300;
    line-height: 200%;
    margin-top:-30px;
    font-family: "Roobert";
}


/* Counter: single item — collapse grid, center through both flex wrappers */
.lgx_counter_up_app .lgx_app_container-fluid {
  justify-content: center;
}

.lgx_counter_up_app .lgx_app_content_wrapper {
  width: 100%;
}

.lgx_counter_up_app .lgx_app_item_row {
  width: 100%;
  grid-template-columns: 1fr !important;
  justify-items: center;
}

.lgx_counter_up_app .lgx_app_item,
.lgx_counter_up_app .lgx_app_item_inner {
  width: 100%;
  text-align: center;
}

.lgx_counter_up_app .lgx_counter_value_wrap {
  display: flex;
  justify-content: center;
}

.lgx_counter_up_app .lgx_counter_value {
  display: inline-block;
  white-space: nowrap;
  width: auto !important;
  float: none !important;
}
/*
------------
LAYOUTS
------------
*/

#content-wrap{width:55% !important}

/* Landing pages: wider content wrap */
.page-template-landing-75 #content-wrap {
  width: 75% !important;
}

.page-id-86 #content-wrap {
  width:75% !important
}

.firstRow{
  margin-top:80px
}

.howWeWorkHolder{
  min-height:640px;
  padding-top:40px;
}

.topmargin{
  margin-top:60px
}

.vcrop img{
  border-radius:0px 52px 0px 52px; 
}

.vcrop .vc_column-inner > .wpb_wrapper > *{
  margtin-bottom:0px !important
}


/* Vertical gap between elements stacked inside a column */
.vc_column-inner > .wpb_wrapper > * {
  margin-bottom: 40px;
}
.vc_column-inner > .wpb_wrapper > *:last-child {
  margin-bottom: 0;
}

.logoSize img{
  height:80px;
  width:auto
}



/*
------------
BUTTONS
------------
*/

/* Total theme buttons — outlined pill, fills on hover */
.theme-button,
a.theme-button{
  --btn: var(--brand-accent, #623CE5);
  display:inline-block;
  padding:16px 20px;
  border:2px solid var(--btn);
  border-radius:999px;                 /* full pill */
  background-color:transparent;
  color:#170133 !important;
  font-weight:600;
  line-height:1.1;
  text-decoration:none;
  transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}

.theme-button:hover,
.theme-button:focus-visible,
a.theme-button:hover,
a.theme-button:focus-visible{
  background-color:var(--btn) !important;
  border-color:var(--btn);
  color:#fff !important;
  text-decoration:none;
}


/*
------------
FOOTER
------------
*/
.footerLogo img{
 height:35px;
}

#footer p{
  font-size: 1rem !important;
}

#footer a:not(.wpex-social-btn):not(.vcex-social-links__item){
  color: var(--brand-accent);
}


.footer-logos{
  display:flex;
  flex-wrap:wrap;              /* the fix — lets logos flow onto row two */
  justify-content:center;
  align-items:center;
  gap:32px 48px;               /* row gap / column gap */
  max-width:1200px;            /* forces the wrap point; tune to taste */
  margin-inline:auto;
  padding-inline:24px;
}
.footer-logos a{
  flex:0 0 auto;
}
.footer-logos img{
  display:block;
  max-height:40px;             /* keeps the mixed sizes on one visual scale */
  width:auto;
  max-width:160px;
  object-fit:contain;
}

.footerForm{
  min-height:400px;
  padding-top:50px;
  padding-bottom:50px;
}

#footer .footerForm h2,
#footer .footerForm h2.vcex-heading{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
}

/* tablet and below: let them wrap/stack */
@media (max-width: 1024px) {
  .footer-logos {
  flex-wrap: wrap;
  gap: 24px 28px;
  }
  .footer-logos img {
  height: 34px;
  }
}

@media (max-width: 600px) {
  .footer-logos img {
  height: 30px;
  }
}


.footerSocials .wpex-social-btn-flat{
  color:#fff;
  background-color: var(--brand-accent);
}

/* Footer social icons — wider spacing */
#footer .footerSocials{
  gap:10px !important;
}

/* Footer socials — match staff slider icon hover */
#footer .footerSocials .wpex-social-btn{
  transition:background-color .2s ease;
}
#footer .footerSocials .wpex-social-btn:hover{
  background-color:color-mix(in srgb, var(--brand-accent, #623CE5) 82%, #000) !important;
}
#footer .footerSocials .wpex-social-btn:hover svg{
  fill:#fff !important;
}




/*
------------
TEAM SLIDER
------------
*/

/* Staff slider — name */
#content .wpex-carousel-staff .wpex-carousel-entry-title{
  margin-top:16px;
}
#content .wpex-carousel-staff .wpex-carousel-entry-title a{
  color:#170133;
  font-weight:700;
  font-size:32px;
  line-height:1.2;
  text-decoration:none;
  transition:color .2s ease;
}
#content .wpex-carousel-staff .wpex-carousel-entry-title a::after{
  content:".";
  color:var(--brand-accent, #623CE5);
}
#content .wpex-carousel-staff .wpex-carousel-entry-title a:hover{
  color:var(--brand-accent, #623CE5);
}

/* Staff slider — job title */
#content .wpex-carousel-staff .staff-entry-position{
  color:#6e6a7d;
  font-size:24px;
  font-weight:400;
  letter-spacing:.01em;
  margin-top:4px;
}

/* Staff slider — social icons: centred brand tiles */
#content .wpex-carousel-staff .staff-social{
  justify-content:center;
  gap:10px;
}
#content .wpex-carousel-staff .staff-social .wpex-social-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:0px !important;                              /* rounded square, beats wpex-rounded-full */
  background-color:var(--brand-accent, #623CE5) !important;   /* one brand colour, beats wpex-social-bg */
  transition:background-color .2s ease;
  margin-bottom:20px;
}
#content .wpex-carousel-staff .staff-social .wpex-social-btn svg{
  width:18px; height:18px;
  fill:#fff !important;                                       /* white glyphs */
}
#content .wpex-carousel-staff .staff-social .wpex-social-btn:hover{
  background-color:color-mix(in srgb, var(--brand-accent, #623CE5) 82%, #000) !important;
}

/* Staff slider arrows — centred, circular (values-slider style) */
#content .wpex-carousel-staff .owl-nav{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  margin-top:24px;
}
#content .wpex-carousel-staff .wpex-carousel__arrow{
  display:inline-flex; align-items:center; justify-content:center;
  width:50px; height:50px; padding:0;
  border-radius:50%;
  border:2px solid color-mix(in srgb, var(--brand-accent,#623CE5) 35%, #fff);
  background:#fff;
  color:var(--brand-accent,#623CE5);
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
  margin-top:40px;
}
#content .wpex-carousel-staff .wpex-carousel__arrow:hover{
  background:var(--brand-accent,#623CE5);
  border-color:var(--brand-accent,#623CE5);
  color:#fff;
}
/* Staff slider — headshot corner mask (re-added) */
#content .wpex-carousel-staff .wpex-carousel-entry-media img{
  border-radius:0px 52px 52px 52px;
  box-shadow:0 20px 40px -18px rgba(23,1,51,.35);
  display:block;
  width:100%;
}

/* Staff slider arrows — centre the nav row (correct Total class) */
#content .wpex-carousel-staff .wpex-carousel__nav{
  justify-content:center;
  gap:18px;
  margin-top:24px;
}

/* Neighbours smaller + faded; centred item full size (correct Total classes) */
#content .wpex-carousel-staff .wpex-carousel__item{
  transition:transform .4s ease, opacity .4s ease;
  transform:scale(.8);
  opacity:.4;
}
#content .wpex-carousel-staff .wpex-carousel__item.center{
  transform:scale(1);
  opacity:1;
}


/*
------------
TEAM GRID (Total staff grid — carousel styling ported over)
------------
*/

#team{
  padding-left:30px;
  padding-right:30px;
}

/* Centre each card's text (carousel had wpex-text-center; the grid doesn't) */
#content .vcex-staff-grid .staff-entry-details{
  text-align:center;
}

/* Headshot — brand corner crop + soft shadow, fixed size (no scale effect) */
#content .vcex-staff-grid .staff-entry-media img{
  border-radius:0px 52px 52px 52px;
  box-shadow:0 20px 40px -18px rgba(23,1,51,.35);
  display:block;
  width:100%;
}

/* Name */
#content .vcex-staff-grid .staff-entry-title{
  margin-top:16px;
}
#content .vcex-staff-grid .staff-entry-title a{
  color:#170133;
  font-weight:700;
  font-size:32px;
  line-height:1.2;
  text-decoration:none;
  transition:color .2s ease;
}
#content .vcex-staff-grid .staff-entry-title a::after{
  content:".";
  color:var(--brand-accent, #623CE5);
}
#content .vcex-staff-grid .staff-entry-title a:hover{
  color:var(--brand-accent, #623CE5);
}

/* Job title */
#content .vcex-staff-grid .staff-entry-position{
  color:#6e6a7d;
  font-size:24px;
  font-weight:400;
  letter-spacing:.01em;
  margin-top:4px;
}

/* Social icons — centred brand tiles
   (!important needed: beats wpex-rounded-full / wpex-social-bg utilities) */
#content .vcex-staff-grid .staff-social{
  justify-content:center;
  gap:10px;
}
#content .vcex-staff-grid .staff-social .wpex-social-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:0px !important;
  background-color:var(--brand-accent, #623CE5) !important;
  transition:background-color .2s ease;
}
#content .vcex-staff-grid .staff-social .wpex-social-btn svg{
  width:18px; height:18px;
  fill:#fff !important;
}
#content .vcex-staff-grid .staff-social .wpex-social-btn:hover{
  background-color:color-mix(in srgb, var(--brand-accent, #623CE5) 82%, #000) !important;
}

/* --- Team grid: equal-height cards + aligned Read bio buttons --- */
#content .vcex-staff-grid{
  display:flex;
  flex-wrap:wrap;              /* keeps the responsive column stacking */
}
#content .vcex-staff-grid .staff-entry{
  display:flex;                /* entry stretches to row height */
}
#content .vcex-staff-grid .staff-entry-inner{
  display:flex;
  flex-direction:column;
  width:100%;
}
#content .vcex-staff-grid .staff-entry-details{
  display:flex;
  flex-direction:column;
  flex:1;                      /* details fill remaining height */
}

/* --- Team grid: vertical rhythm --- */
/* job title → socials */
#content .vcex-staff-grid .staff-entry-social-links{
  margin-top:12px;
}
/* socials → Read bio: auto pushes it to the card bottom (aligns all four),
   padding-top guarantees breathing room even on the tallest card */
#content .vcex-staff-grid .staff-entry-readmore-wrap{
  margin-top:auto !important;
  padding-top:24px;
}

/*
------------
STAFF DETAIL
------------
*/

.single-staff .page-header{display:none}

.staffHolder{margin-top:80px}

/* Centre the "Other team members" cards when the row isn't full */
.teamHolder .vcex-staff-grid.entries {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2%;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.teamHolder .vcex-staff-grid.entries .vcex-grid-item {
  float: none !important;
  margin: 0 !important;
}

/*
------------
CONTACT PAGE
------------
*/

.addressDetails p{font-size:18px; line-height:28px}

.addressDetails p a{
  color: #170133 !important;
}

.addressDetails p a:hover{
  color:var(--brand-accent,#623CE5) !important;
}

.addressDetails h3.vcex-heading{font-size:30px; margin-bottom:5px}



/* CONTACT PAGE — address blocks */

/* 1. Kill the brand dot on country names */
.addressTitle::after,
.addressTitle .vcex-heading-inner::after {
  content: none !important;
}

/* 2. Country names: down from 2xl to match the design */
h3.addressTitle {
  font-size: 20px;
  line-height: 1.4;
  margin-bottom: 8px;
}

/* 3. "We're always available…" / "Or complete the form below" */
.callout.emailIntro,
.callout.emailIntro .vcex-heading-inner {
  font-size: 24px;
  font-weight: 500;
  color: #170133;
  line-height: 1.5;
}
.callout.emailIntro {
  display: block;
  margin: 24px 0 12px;
}
/* Country titles — the 2xl utility and heading rules outrank a bare h3,
   hence the !important */
h3.addressTitle,
h3.addressTitle .vcex-heading-inner {
  font-size: 24px !important;
  line-height: 1.4;
  font-weight:600;
}
h3.addressTitle {
  margin-bottom: 10px;
}

/* Callouts: kill the stray brand dots, tighten the rhythm */
.callout::after,
.callout .vcex-heading-inner::after {
  content: none !important;
}
.callout {
  margin: 20px 0 6px;   /* was 24/12 — pulls the email up under its intro */
}

/* Email link: black with underline, snug to the line above */
.callout + .wpb_text_column p {
  margin: 0;
}

/* Submit button text */
.wpcf7-submit.theme-button {
  font-size: 17px;
}


.contactEmail a{
  font-size:18px !important;
  font-weight:500 !important;
  color:#170133 !important;
  text-decoration:underline;
  text-decoration-color:var(--brand-accent, #623CE5);
  text-decoration-thickness:2px;
  text-underline-offset:3px;
  transition:color .2s ease;
}
.contactEmail a:hover,
.contactEmail a:focus-visible{
  color:var(--brand-accent, #623CE5) !important;
}
.address{
  font-weight:500 !important;
}

/* ===== Step contact form (CF7) ===== */

.contact-form-swiper{ overflow:hidden; width:100%; }
.contact-form-swiper .swiper-slide{ height:auto; }
.contact-form-swiper .wpcf7-form-control-wrap{ display:block; }

.contact-form-swiper .element input,
.contact-form-swiper .element select,
.contact-form-swiper .element textarea{
  width:100%;
  border:0;
  border-bottom:2px solid #170133;          /* was light purple */
  background:transparent;
  padding:14px 4px;
  font-family:inherit;
  font-size:clamp(20px,2.4vw,28px);
  color:#170133;
  outline:none;
  transition:border-color .2s ease;
  border-radius:0;
}
.contact-form-swiper .element textarea{ height:200px !important; resize:vertical; border:2px solid #170133; padding-left:14px}
.contact-form-swiper .element :is(input,select,textarea):focus{
  border-color:var(--brand-accent,#170133);
}
.contact-form-swiper .element ::placeholder{ color:#170133; opacity:1; }
.contact-form-swiper select:has(option[value=""]:checked){ color:#170133; }
.contact-form-swiper .is-invalid{ border-color:#e3342f !important; }

/* progress + buttons row (sibling of the swiper, stays put) */
.contact-form-info{ display:flex; align-items:center; gap:20px; margin-top:28px; }
.contact-us-swiper-progress{
  flex:1 1 auto; height:4px; border-radius:999px;
  background:color-mix(in srgb, var(--brand-accent,#623CE5) 18%, #fff);
  overflow:hidden;
}
.contact-us-swiper-progress span{
  display:block; height:100%; width:20%;
  background:var(--brand-accent,#623CE5);
  border-radius:999px;
  transition:width .4s ease;
}
.swiper-buttons-wrapper{ display:flex; gap:14px; }
.circled-btn{
  width:54px; height:54px; border-radius:50%; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  border:2px solid color-mix(in srgb, var(--brand-accent,#623CE5) 35%, #fff);
  background:#fff; color:var(--brand-accent,#623CE5); cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.circled-btn:hover{ background:var(--brand-accent,#623CE5); border-color:var(--brand-accent,#623CE5); color:#fff; }
.circled-btn svg{ width:22px; height:22px; }
.circled-btn.is-hidden{ display:none; }

/* the real CF7 submit is hidden — the next arrow triggers it on the last step */
.cf-contact-submit{ display:none !important; }

.wpcf7 form.sent .wpcf7-response-output {
  background-color:#00d413 !important;
  color:#170133 !important
}

.wpcf7 form .wpcf7-response-output{
  margin:15px 0 15px 0
}

/* ===== Simple contact form (CF7) ===== */
.cf-form .cf-field{ margin-bottom:30px; }
.cf-form .wpcf7-form-control-wrap{ display:block; }

.cf-form .cf-field input,
.cf-form .cf-field textarea{
  width:100%;
  border:0;
  border-bottom:2px solid #170133;
  border-radius:0px;
  background:transparent;
  padding:10px 2px;
  font-family:inherit;
  font-size:clamp(18px,2vw,24px);
  color:#170133;
  outline:none;
  transition:border-color .2s ease;
}
.cf-form .cf-field textarea{ height:150px; resize:vertical; }
.cf-form .cf-field input:focus,
.cf-form .cf-field textarea:focus{ border-color:var(--brand-accent,#623CE5); }
.cf-form .cf-field ::placeholder{ color:#170133; opacity:1; }

/* submit pushed to the right (styling comes from .theme-button) */
.cf-form .cf-actions{ display:flex; justify-content:flex-end; margin-top:10px; }


/*
------------
DOWNLOAD INLINE FORM
------------
*/

.v5-download-inline {
  max-width: 100%;
  margin: 40px auto;
  padding: 48px 56px;
  background: var(--brand-accent, #623CE5);
  color: #fff;
  border-radius: 0 52px 0 52px;
  box-sizing: border-box;
}

/* Optional heading */
.v5-di__heading {
  color: #fff;
  text-align: center;
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 32px;
}

h3.v5-di__heading{
  color:#fff !important
}

/* Grid layout — targets .v5-di wrapper (direct parent of the fields) */
.v5-download-inline .v5-di {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 22px 40px;
  align-items: end;
}

.v5-di__field {
  border-bottom: 1px solid rgba(255,255,255,0.85);
  padding: 4px 0 8px;
}

/* Hide field labels visually but keep them for accessibility */
.v5-di__field label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.v5-di__field .wpcf7-form-control-wrap {
  display: block;
}

.v5-di__field input {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 4px 0;
  font-size: 18px;
  color: #fff;
  outline: none;
  box-shadow: none;
  font-family: inherit;
}

.v5-di__field input::placeholder {
  color: #fff;
  opacity: 0.6;
}

/* Full-width rows for consent, privacy, submit */
.v5-di__consent,
.v5-di__submit,
.v5-di__privacy {
  grid-column: 1 / -1;
}

/* Consent checkbox */
.v5-di__consent {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.5;
  color: #fff;
}

.v5-di__consent .wpcf7-list-item {
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.v5-di__consent .wpcf7-list-item > label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  margin: 0;
}

.v5-di__consent .wpcf7-list-item-label {
  flex: 1;
}

.v5-di__consent input[type="checkbox"] {
  accent-color: #fff;
  width: 18px;
  height: 18px;
  margin: 4px 0 0;
  flex-shrink: 0;
  cursor: pointer;
  align-self: flex-start;
}

/* Privacy line — above submit */
.v5-di__privacy {
  font-size: 15px;
  line-height: 1.5;
  margin: 8px 0 0;
  color: #fff !important;
  opacity: 1;
  order: 1;
}

.v5-di__privacy a {
  color: #fff !important;
  font-weight: 600;
  text-decoration: underline;
}

.v5-di__privacy a:hover,
.v5-di__privacy a:focus-visible {
  opacity: 0.85;
}

/* Submit — right aligned */
.v5-di__submit {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
  order: 2;
}

.v5-download-inline .theme-button,
.v5-download-inline a.theme-button {
  border-color: #fff;
  color: #fff !important;
  background: transparent;
  padding: 14px 34px;
}

.v5-download-inline .theme-button:hover,
.v5-download-inline .theme-button:focus-visible {
  background: #fff;
  color: var(--brand-accent, #623CE5) !important;
  border-color: #fff;
}

.v5-download-inline .wpcf7-spinner {
  align-self: center;
  margin-left: 12px;
}

/* CF7 validation */
.v5-download-inline .wpcf7-not-valid-tip {
  font-size: 12px;
  margin-top: 4px;
  color: #fff;
}

.v5-download-inline .wpcf7-response-output {
  color: #fff !important;
  border-color: #fff !important;
  margin: 20px 0 0;
}

/* Media site override: yellow background needs dark text */
body.blog-4 .v5-di__heading,
body.blog-4 .v5-download-inline,
body.blog-4 .v5-di__consent,
body.blog-4 .v5-di__privacy,
body.blog-4 .v5-di__field input {
  color: #170123;
}

body.blog-4 .v5-di__field {
  border-bottom-color: rgba(23,1,35,0.7);
}

body.blog-4 .v5-di__field input::placeholder {
  color: #170123;
  opacity: 0.6;
}

body.blog-4 .v5-di__consent input[type="checkbox"] {
  accent-color: #170123;
}

body.blog-4 .v5-download-inline .theme-button {
  border-color: #170123;
  color: #170123 !important;
}

body.blog-4 .v5-download-inline .theme-button:hover,
body.blog-4 .v5-download-inline .theme-button:focus-visible {
  background: #170123;
  color: #fff !important;
  border-color: #170123;
}

body.blog-4 .v5-di__privacy a {
  color: #170123;
}

/* Mobile: stack fields to single column */
@media (max-width: 768px) {
  .v5-download-inline {
  padding: 32px 24px;
  border-radius: 0 32px 0 32px;
  }
  .v5-download-inline .v5-di {
  grid-template-columns: 1fr;
  gap: 20px;
  }
  .v5-di__submit {
  justify-content: stretch;
  }
  .v5-download-inline .theme-button {
  width: 100%;
  }
}

/* Success message — white background scoped to inline downloads only */
.v5-download-inline .wpcf7 form.sent .wpcf7-response-output,
.v5-download-inline form.sent .wpcf7-response-output {
  background: #fff !important;
  color: var(--brand-accent, #623CE5) !important;
  border-color: #fff !important;
}

/* Also cover validation and mail failure states */
.v5-download-inline .wpcf7 form.invalid .wpcf7-response-output,
.v5-download-inline .wpcf7 form.failed .wpcf7-response-output,
.v5-download-inline form.invalid .wpcf7-response-output,
.v5-download-inline form.failed .wpcf7-response-output {
  background: #fff !important;
  color: var(--brand-accent, #623CE5) !important;
  border-color: #fff !important;
}

/* ===== Network overlay menu ===== */

/* Burger — pinned to the right of the header container */
.nav-toggle{
  position:absolute; top:50%; right:0; transform:translateY(-50%);
  width:42px; height:42px; padding:0; border:0; background:transparent; cursor:pointer;
  display:flex; flex-direction:column; justify-content:center; gap:7px; z-index:5;
}
.nav-toggle span{ display:block; height:3px; width:34px; background:#170133; border-radius:2px; }
body.nav-open .nav-toggle{ display:none; }

/* Overlay shell */
.nav-overlay{
  position:fixed; inset:0; z-index:9990; background:#fff;
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
}
.nav-overlay.is-open{ opacity:1; visibility:visible; }
body.nav-open{ overflow:hidden; }

/* Image on the right */
.nav-overlay__media{
  position:absolute; top:0; right:0; bottom:0; width:40%;
  background-color:#e9e6f5; background-position:center; background-size:cover; background-repeat:no-repeat;
}

/* Top bar — matches the site header height + logo padding */
.nav-overlay__bar{
  position:absolute; top:0; left:0; right:0; z-index:3;
  background:#fff;
  box-shadow:0 8px 24px -10px rgba(23,1,51,.18);
  padding-block:30px;            /* = header wpex-py-30 */
}
.nav-overlay__bar .container{ display:flex; align-items:center; }
.nav-overlay__logo img,
.nav-overlay__logo .custom-logo-link img{ height:40px; width:auto; display:block; } /* match your header logo height */

.nav-overlay__close{
  position:absolute; top:50%; right:32px; transform:translateY(-50%);
  width:48px; height:48px; display:flex; align-items:center; justify-content:center;
  border:0; background:transparent; color:#170133; cursor:pointer; z-index:1;
}
.nav-overlay__close svg{ width:34px; height:34px; }

.nav-overlay__close svg{ width:34px; height:34px; }

/* Left content column */
.nav-overlay__inner{
  position:relative; z-index:2;
  width:60%; height:100%;
  display:flex; flex-direction:column;
  padding:120px clamp(24px,8vw,140px) 60px;
  box-sizing:border-box;
}

/* Main links — vertically centred, left-aligned, wrap if more than fits */
.nav-overlay__nav{ flex:1 1 auto; display:flex; align-items:center; }
.nav-overlay__menu{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 56px;
}
.nav-overlay__menu li{ margin:0; }
.nav-overlay__menu a{
  font-family:inherit; font-weight:700; text-decoration:none;
  font-size:clamp(32px,4vw,56px); line-height:1.1; color:#170133 !important;
}
.nav-overlay__menu a::after{ content:"."; color:var(--brand-accent,#623CE5); }
.nav-overlay__menu a:hover{ color:var(--brand-accent,#623CE5) !important; }

/* Network wordmarks, bottom */
.nav-overlay__sites{
  flex:0 0 auto; display:flex; flex-wrap:wrap; align-items:center; gap:clamp(24px,3vw,56px);
}
.nav-overlay__sites img{ height:clamp(28px,3vw,44px); width:auto; opacity:.55; transition:opacity .2s ease; }
.nav-overlay__sites a:hover img{ opacity:1; }

.nav-overlay__sites{
  flex:0 0 auto;
  display:flex; flex-wrap:nowrap; align-items:center;
  gap:clamp(16px,2.4vw,48px);
}
.nav-overlay__sites img{
  height:clamp(20px,2.6vw,40px);
  width:auto; opacity:.55; transition:opacity .2s ease;
}
.nav-overlay__sites a:hover img{ opacity:1; }

.nav-overlay__menu a{
  font-size:clamp(22px,2.6vw,40px);   /* was 32–56px */
}
.nav-overlay__menu{ gap:14px 44px; }

/* Line the bar logo up with the menu's left edge */
.nav-overlay__bar .container{
  width:100%;
  max-width:none;
  margin:0;
  padding-inline:clamp(24px,8vw,140px);   /* must match .nav-overlay__inner */
}

/* Mobile — drop the image, go full width */
@media (max-width:768px){
  .nav-overlay__media{ display:none; }
  .nav-overlay__inner{ width:100%; padding:110px 24px 40px; }
  .nav-overlay__menu{ flex-direction:column; align-items:flex-start; gap:20px; }
  .nav-overlay__menu a{ font-size:clamp(30px,9vw,46px); }
  .nav-overlay__logo{ left:24px; }
}

/* Floating network social icons */
.floating-socials {
  position: fixed;
  top: 50%;
  right: clamp(10px, 1.4vw, 22px);
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 95;
  transition: opacity .25s ease, visibility .25s ease;
}
.floating-socials a {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0px;
  background: var(--brand-accent, #623CE5);
  transition: background-color .2s ease;
}
.floating-socials a:hover {
  background: color-mix(in srgb, var(--brand-accent, #623CE5) 82%, #000);
}
.floating-socials svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}
/* hide while the full-screen menu is open */
body.nav-open .floating-socials {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
/* tuck away on small screens */
@media (max-width: 768px) {
  .floating-socials { display: none; }
}






/*
------------
LOGO WALL
------------
*/
/* Footer / partner logo wall — scaled up ~20% (stretched row) */
.logo-wall > .vc_column-inner > .wpb_wrapper {
  --logo-gap: clamp(24px, 3.5vw, 48px);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--logo-gap);
  max-width: 1320px;              /* was the 1100px container var — ×1.2 */
  margin-inline: auto;
  padding-inline: 16px;           /* stops cells kissing the viewport edge on smaller screens */
}
.logo-wall .vcex-image {
  margin: 0 !important;
  flex: 0 0 calc((100% - 3 * var(--logo-gap)) / 4); /* up to 4 per row */
  max-width: calc((100% - 3 * var(--logo-gap)) / 4);
  height: 144px;                  /* was 120px — equal cell → even rows */
  display: flex;
  align-items: center;
  justify-content: center;
}
.logo-wall .vcex-image-inner,
.logo-wall .vcex-image-inner a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.logo-wall .vcex-image img {
  max-width: 252px;   /* was 210px — cap width so wide logos don't dominate */
  max-height: 120px;  /* was 100px — cap height so tall/square ones match */
  width: auto;
  height: auto;
}
/* fewer columns as the screen narrows */
@media (max-width: 900px) {
  .logo-wall .vcex-image {
    flex-basis: calc((100% - var(--logo-gap)) / 2);
    max-width: calc((100% - var(--logo-gap)) / 2);
  }
}
@media (max-width: 480px) {
  .logo-wall .vcex-image {
    flex-basis: 100%;
    max-width: 100%;
  }
}


/*
------------
LOGO WALL
------------
*/


.vcex-icon-box img{
  height:150px;
  width:auto
}

.vcex-icon-box h4{
  font-size:24px;
  margin-bottom:15px;
}

/*
------------
VIDEO EMBED — centred, 800px, full width on mobile
------------
*/
.videoEmbed{
  max-width:800px;
  margin-left:auto !important;
  margin-right:auto !important;
}
.videoEmbed iframe{
  display:block;
  width:100% !important;
  height:auto !important;
  aspect-ratio:16 / 9;
  border:0;
}



/*
------------
GATED DOWNLOAD MODAL
------------
*/

.v5-dls__img{ width:100%; height:auto; display:block; border-radius:0px 52px 0px 52px !important; }

.v5-modal{ position:fixed; inset:0; z-index:9999; display:none; }
.v5-modal.is-open{ display:block; }
.v5-modal__overlay{ position:absolute; inset:0; background:rgba(23,1,51,.6); }
.v5-modal__box{
  position:relative; max-width:880px; width:calc(100% - 40px);
  margin:8vh auto 0; background:var(--brand-accent,#623CE5); color:#fff;
  border-radius:10px 40px 40px 40px; padding:clamp(28px,5vw,56px);
}
.v5-modal__close{ position:absolute; top:14px; right:20px; background:none; border:0; color:#fff; font-size:34px; line-height:1; cursor:pointer; }
.v5-modal__title{ width:100% !important;
    max-width:100% !important;
    margin:0 0 6px !important;
    text-align:center !important;
    color:#fff !important;
  }
.v5-modal__title{
  width:100% !important;
  max-width:100% !important;
  margin:0 0 6px !important;
  text-align:center !important;
}
.v5-modal__sub{ color:#fff!important; text-align:center; margin:0 0 28px; }
.v5-modal__box .wpcf7 input{ color:#fff; border-bottom-color:rgba(255,255,255,.6); }
.v5-modal__box .wpcf7 input::placeholder{ color:rgba(255,255,255,.85); }
body.v5-modal-open{ overflow:hidden; }

.v5-dl-cta{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%);
  z-index:3; pointer-events:none;            /* clicks pass through to the link */
  display:inline-block; padding:10px 22px; border-radius:40px;
  background:#fff; color:var(--brand-accent,#623CE5);
  font-weight:700; font-size:14px; white-space:nowrap;
  transition:background .2s ease, color .2s ease;
}
.v5-downloads-slider a:hover .v5-dl-cta{ background:var(--brand-accent,#623CE5); color:#fff; }


.v5-dls{ max-width:1080px; margin:0 auto; padding:0 16px; }
.v5-dls__card{ display:flex; gap:clamp(24px,5vw,64px); align-items:center; }
.v5-dls__media{ flex:0 0 44%; max-width:44%; }
.v5-dls__img{ width:100%; height:auto; display:block; border-radius:8px; }
.v5-dls__body{ flex:1 1 auto; text-align:left; padding-top:20px}
.v5-dls__title{ color:var(--brand-accent,#623CE5)!important; margin:0 0 18px; }
.v5-dls__desc{ margin-bottom:28px; }
.v5-dls__desc p{ margin:0 0 14px; }
.v5-dls__nav{ display:flex; justify-content:center; align-items:center; gap:18px; margin-top:32px; }
.v5-dls__arrow{ display:flex; align-items:center; justify-content:center; width:54px; height:54px; border-radius:50%; background:#fff; border:2px solid color-mix(in srgb, var(--brand-accent,#623CE5) 35%, #fff); color:var(--brand-accent,#623CE5); cursor:pointer; transition:background .2s ease,color .2s ease,border-color .2s ease; }
.v5-dls__arrow svg{ width:22px; height:22px; }
.v5-dls__arrow:hover{ background:var(--brand-accent,#623CE5); border-color:var(--brand-accent,#623CE5); color:#fff; }
.v5-dls__arrow.swiper-button-disabled{ opacity:.4; cursor:default; }
@media (max-width:768px){
  .v5-dls__card{ flex-direction:column; text-align:center; }
  .v5-dls__media{ flex-basis:auto; max-width:320px; width:100%; }
  .v5-dls__body{ text-align:center; }
}

.v5-dls{ width:75%; max-width:none; margin:0 auto; }
@media (max-width:768px){ .v5-dls{ width:88%; } }   /* widen on phones */

.v5-dls__card{ align-items:flex-start; }            /* was center */

.v5-dls__arrow{ color:#170133; }                    /* chevrons ink, was accent */


/* Download-gate form — stacked white underline fields + white outline button */
.v5-modal__box .wpcf7-form-control-wrap{ display:block; width:100%; margin-bottom:24px; }

.v5-modal__box .wpcf7-form input,
.v5-modal__box .wpcf7-form textarea{
  width:100%;
  background:transparent !important;
  border:0 !important;
  border-bottom:2px solid rgba(255,255,255,.55) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:10px 2px;
  color:#fff !important;
  font-size:18px;
  -webkit-appearance:none;
}
.v5-modal__box .wpcf7-form input::placeholder,
.v5-modal__box .wpcf7-form textarea::placeholder{ color:#fff; opacity:.85; }
.v5-modal__box .wpcf7-form input:focus,
.v5-modal__box .wpcf7-form textarea:focus{ outline:none; border-bottom-color:#fff !important; }

.v5-modal__box .wpcf7-form .wpcf7-submit{
  display:block;
  width:100%;
  margin-top:6px;
  background:transparent !important;
  border:2px solid #fff !important;
  border-radius:40px !important;
  color:#fff !important;
  padding:14px 24px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s ease, color .2s ease;
}
.v5-modal__box .wpcf7-form .wpcf7-submit:hover{
  background:#fff !important;
  color:var(--brand-accent,#623CE5) !important;
}

.v5-modal__box .wpcf7-response-output{ color:#fff; border-color:#fff; }
.v5-modal__box .wpcf7-not-valid-tip{ color:#fff; }





.wpcf7 form.sent .wpcf7-response-output {
  text-align:center;
  
}



/*
------------
BRAND LINKS
------------
*/
/* Discover our brands — break out of the 55% content column,
   equal-height cards with bottom-aligned buttons */
.brandLinks{
  position:relative;
  width:80vw;
  left:50%;
  transform:translateX(-50%);
  margin-left:0 !important;
  margin-right:0 !important;
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
}

/* Equal-height cards — flex-grow chain (height:100% is unreliable here) */
.brandLinks > .wpb_column{
  display:flex;
  flex-direction:column;
}
.brandLinks .vc_column-inner,
.brandLinks .vc_column-inner > .wpb_wrapper{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
}
.brandLinks .vc_column-inner > .wpb_wrapper > .wpb_text_column{
  flex:1 1 auto;          /* soaks up the height difference */
}
.brandLinks .vc_column-inner > .wpb_wrapper > .theme-button{
  margin-top:auto;        /* pins button to the shared baseline */
  align-self:flex-start;  /* stops flex stretching it full-width */
}

/* Logos — 50px, left-aligned, snug to the text below */
.brandLinks .vcex-image:not(.vcrop){
  margin-bottom:20px;
  text-align:left;
}
.brandLinks .vcex-image:not(.vcrop) .vcex-image-img{
  height:50px;
  width:auto;
  max-width:100%;
  object-fit:contain;
  object-position:left center;
}

/* Mobile (stacked) — full width, everything aligned with a 24px inset */
@media (max-width:767px){
  .brandLinks{
    width:100vw;
    box-sizing:border-box;
    padding-inline:0;
  }
  .brandLinks > .wpb_column > .vc_column-inner{
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .brandLinks .vcex-image.vcrop .vcex-image-inner,
  .brandLinks .vcex-image.vcrop img{
    width:100%;
    height:auto;
  }
  /* one consistent inset for photos, logos, text and buttons */
  .brandLinks .vcex-image.vcrop,
  .brandLinks .wpb_text_column,
  .brandLinks .vcex-image:not(.vcrop),
  .brandLinks .vc_column-inner > .wpb_wrapper > .theme-button{
    margin-left:24px;
    margin-right:24px;
  }
}
/* Heading dot — attach inside the inner span so it never wraps alone
   (site-wide h2 fix, lives here for now) */
h2.vcex-heading:after{
  content:none;
}
h2.vcex-heading .vcex-heading-inner:after{
  content:".";
  font-family:serif;
  font-size:min(max(55px + 35 * ((100vw - 375px) / 1065), 55px), 90px);
  line-height:0;
  color:var(--brand-accent);
}


/*
------------
JOIN OUR TEAM
------------
*/
.joinTeam{
  position:relative;
  width:100vw;
  left:50%;
  transform:translateX(-50%);
  margin-left:0 !important;
  margin-right:0 !important;
  display:flex;
  align-items:center;
  overflow:hidden;              /* clips the overhanging photos */
}

/* Image columns — dragged past the viewport edges */
.joinTeam > .wpb_column:first-child{ margin-left:-8vw; }
.joinTeam > .wpb_column:last-child{ margin-right:-8vw; }

.joinTeam > .wpb_column:first-child > .vc_column-inner,
.joinTeam > .wpb_column:last-child > .vc_column-inner{
  padding-left:0 !important;
  padding-right:0 !important;
}
.joinTeam .vcex-image{
  margin-bottom:0;
}
.joinTeam .vcex-image .vcex-image-inner,
.joinTeam .vcex-image img{
  display:block;
  width:100%;
  height:auto;
}

/* Corner radius applied here — covers the vcropvcrop typo and the
   missing vcrop on the hands image (or fix the classes and delete this) */
.joinTeam .vcex-image img{
  border-radius:0 52px 0 52px;
}

/* Text column */
.joinTeam > .wpb_column:nth-child(2){
  flex:1 1 auto;
  padding-inline:48px;
}

/* Mobile — drop the side photos, keep the copy readable */
@media (max-width:767px){
  .joinTeam > .wpb_column:first-child,
  .joinTeam > .wpb_column:last-child{
    display:none;
  }
  .joinTeam > .wpb_column:nth-child(2){
    padding-inline:24px;
  }
}


/* ------------------------------------------------------------
   SOCIAL FEEDS
------------------------------------------------------------ */

/* 1. Hide the Instagram Load More button
   (#sbi_load also wraps the follow button, so hide only the btn) */
#sbi_load .sbi_load_btn {
  display: none !important;
}

/* 2. Instagram Follow button -> theme button style */
.sbi_custom {
  background: #fff !important;
  color: var(--brand-accent, #623CE5) !important;
  border: 2px solid var(--brand-accent, #623CE5);
  border-radius: 999px;
  padding: 0 21px 6px 21px;
  font-family: "Roobert", sans-serif;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s ease;
  margin-top:30px !important
}

/* Anchor inside: fully neutralised — the plugin targets this element
   with its own hover styles (inset box-shadow) and JS (inline background) */
#sb_instagram .sbi_follow_btn a,
#sb_instagram .sbi_follow_btn a:hover,
#sb_instagram .sbi_follow_btn a:focus,
#sb_instagram .sbi_follow_btn a:active {
  background: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  color: #170133 !important;
  font-size: 21px !important;
}

/* Hover lives on the span (the pill), matching theme buttons */
.sbi_custom:hover {
  background: var(--brand-accent, #623CE5) !important;
}
.sbi_custom:hover a,
#sb_instagram .sbi_custom:hover a {
  color: #fff !important;
}

.fa-instagram{display:none !important}

/* 3. TikTok Follow button -> theme button style */
.sbtt-tiktok-feed .sb-follow-btn,
.sbtt-tiktok-feed .sb-btn,
.sbtt-tiktok-feed a[href*="tiktok.com/@"]:not([href*="/video/"]) {
  background: #fff !important;
  color: #170133 !important;
  border: 2px solid var(--brand-accent, #623CE5) !important;
  border-radius: 999px;
  padding: 18px 31px 22px 31px !important;
  font-family: "Roobert", sans-serif;
  font-weight: 600;
  font-size: 21px !important;
  text-decoration: none;
  box-shadow: none !important;
  opacity: 1 !important;
  transition: background 0.2s ease, color 0.2s ease;
}

.sbtt-tiktok-feed .sb-follow-btn:hover,
.sbtt-tiktok-feed .sb-follow-btn:focus,
.sbtt-tiktok-feed .sb-btn:hover,
.sbtt-tiktok-feed a[href*="tiktok.com/@"]:not([href*="/video/"]):hover {
  background: var(--brand-accent, #623CE5) !important;
  color: #fff !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* If the button contains an SVG/icon, keep it on the text colour */
.sbtt-tiktok-feed .sb-follow-btn svg,
.sbtt-tiktok-feed .sb-btn svg {
  fill: currentColor;
}

/*
------------
TIKTOK FEED — square thumbnails
------------
*/

/* Feed items — force square */
.sbtt-item,
.tiktok-feed-item,
.tiktok-feeds-item,
[class*="tiktok"] [class*="item"] {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  position: relative;
}

/* Anything that's a container (div, a, figure, span) inside — fill the square
   BUT exclude svg and things with 'play' or 'icon' in their class */
.sbtt-item :where(div, a, figure, span):not([class*="play"]):not([class*="icon"]),
.tiktok-feed-item :where(div, a, figure, span):not([class*="play"]):not([class*="icon"]),
[class*="tiktok"] [class*="item"] :where(div, a, figure, span):not([class*="play"]):not([class*="icon"]) {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  position: relative;
}

/* Image / video — fill and crop */
.sbtt-item img,
.sbtt-item video,
.tiktok-feed-item img,
.tiktok-feed-item video,
[class*="tiktok"] [class*="item"] img,
[class*="tiktok"] [class*="item"] video {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  aspect-ratio: auto !important;
  position: absolute !important;
  top: 0;
  left: 0;
}

/* Play button — reset to normal small size */
.sbtt-item svg,
.tiktok-feed-item svg,
[class*="tiktok"] [class*="item"] svg,
.sbtt-item [class*="play"],
.tiktok-feed-item [class*="play"],
[class*="tiktok"] [class*="item"] [class*="play"],
.sbtt-item [class*="icon"],
.tiktok-feed-item [class*="icon"],
[class*="tiktok"] [class*="item"] [class*="icon"] {
  width: 48px !important;
  height: 48px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 48px !important;
  max-height: 48px !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  aspect-ratio: 1 / 1 !important;
  z-index: 2;
  color: #fff;
  pointer-events: none;
  display: block !important;
}


/*
------------
MEDIA HUB
------------
*/
.mediaHubTitle h1{color:#fff !important; margin-top:40px !important}

.vcex-blog-entry-title a{color:#170133 !important; font-size:24px !important}

h2.vcex-blog-entry-title:after{display:none !important}


/*
------------
ARCHIVE FILTER BUTTONS — brand outlined style
------------
*/

.vcex-blog-filter,
.vcex-filter-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px !important;
  list-style: none;
  padding: 0;
  margin: 0 0 40px !important;
}

/* Default (inactive) button */
.vcex-filter-links li a.theme-button,
.vcex-filter-links li a.theme-button.minimal-border {
  display: inline-block;
  padding: 18px 28px !important;
  border: 2px solid var(--brand-accent, #623CE5) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #170133 !important;
  text-decoration: none;
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
  transition: background-color 0.2s ease, color 0.2s ease;
  cursor: pointer;
}

/* Hover state */
.vcex-filter-links li a.theme-button:hover,
.vcex-filter-links li a.theme-button.minimal-border:hover {
  background: var(--brand-accent, #623CE5) !important;
  color: #fff !important;
  border-color: var(--brand-accent, #623CE5) !important;
}

/* Active state — the current filter */
.vcex-filter-links li.active a.theme-button,
.vcex-filter-links li.active a.theme-button.minimal-border,
.vcex-filter-links li.current a.theme-button {
  background: var(--brand-accent, #623CE5) !important;
  color: #fff !important;
  border-color: var(--brand-accent, #623CE5) !important;
}

.mediaHubHolder{
  margin-top:80px !important
}

/*
------------
BLOG GRID — consistent image sizes
------------
*/

/* Image wrapper — enforce fixed aspect ratio */
.vcex-blog-grid .vcex-blog-entry-media,
.vcex-blog-grid .vcex-blog-entry-media a {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
  position: relative;
}

/* Image itself — fill the wrapper, crop from center */
.vcex-blog-grid .vcex-blog-entry-img,
.vcex-blog-grid .vcex-blog-entry-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block;
  max-width: none !important;
  aspect-ratio: auto !important;
  border-radius:0px 52px 0px 52px;
}

/*
------------
INSIGHTS — single blog post layout
------------
*/

.single-post #content-wrap { width: 100% !important; }


.single-post h1{color:#fff !important}
.single-post h2{margin-top:50px !important}
.single-post h3{margin-top:40px !important}


.single-post h1{margin-top:0px !important; width:70% !important}


.blogDate {color:#fff !important}

/* Remove margin around blog date */
.single-post .blogDate,
.single-post p:has(> .blogDate) {
  margin: 0 !important;
  padding: 0 !important;
}


.single-post .vc_row.blogTitle,
.single-post .vc_row.blogContent {
  width: 75vw !important;
  max-width: 75vw !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.single-post .vc_row.blogTitle {
  transform: translateY(-100px);
  margin-top: 0 !important;
}

.single-post .vc_row.blogContent {
  margin-top: -230px !important;
}

/* Left-align everything */
.single-post .blogTitle,
.single-post .blogTitle *,
.single-post .blogContent .wpb_text_column,
.single-post .blogContent p,
.single-post .blogContent h1,
.single-post .blogContent h2,
.single-post .blogContent h3,
.single-post .blogContent h4,
.single-post .blogContent ul,
.single-post .blogContent ol,
.single-post .blogContent blockquote {
  text-align: left !important;
}

.single-post .blogContent ul,
.single-post .blogContent ol {
  display: block !important;
}

.single-post .blogHero {
  position: relative;
  isolation: isolate;
}

/* Blog hero image */
.blogHero img {
  min-height: 700px !important;
  width: auto !important;
  object-fit: cover;
}

/* Tablet: reduce hero height */
@media (max-width: 1024px) {
  .blogHero img {
    min-height: 500px !important;
    width: 100% !important;
    height: auto !important;
    object-fit: cover;
  }
}

/* Mobile: even shorter, full width */
@media (max-width: 768px) {
  .blogHero img {
    min-height: 350px !important;
    max-height: 400px !important;
    width: 100% !important;
    object-fit: cover;
  }
}

/* Small mobile */
@media (max-width: 480px) {
  .blogHero img {
    min-height: 250px !important;
    max-height: 300px !important;
    width: 100% !important;
    object-fit: cover;
  }
}

.single-post .blogHeroRow .vcex-image-inner {
  position: relative;
}

.single-post .blogHeroRow .vcex-image-inner::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  pointer-events: none;
  z-index: 1;
}

@media (max-width: 768px) {
  .single-post .vc_row.blogTitle,
  .single-post .vc_row.blogContent {
    width: 98vw !important;
    max-width: 98vw !important;
  }
  .single-post .vc_row.blogTitle {
    transform: translateY(0px);
    margin-top:30px !important;
  }

  .single-post .vc_row.blogContent {
    margin-top: -10px !important;
  }
  
  .single-post h1{color:#fff !important}
  .single-post h2{margin-top:50px !important}
  .single-post h3{margin-top:40px !important}
  
  
  .single-post h1, .blogDate{color: #170133 !important; width:100% !important}
  
  .blogHero img{min-height:400px !important; width:auto !important}

}


/*
------------
BENEFITS CAROUSEL
------------
*/

.v5-bfs {
  position: relative;
  width: 100%;
  padding: 20px 0;
}

.v5-bfs__heading {
  text-align: center;
  margin: 0 0 32px;
  font-size: clamp(24px, 3vw, 34px);
}

.v5-bfs__swiper {
  overflow: hidden;
}

.v5-bfs__card {
  text-align: left;
  padding: 20px 12px;
  height: 100%;
  box-sizing: border-box;
}


.v5-bfs__title {
  color: var(--brand-accent, #623CE5);

  font-weight: 700;
  font-size: 26px;
  line-height: 1.2;
  letter-spacing: 0.02em;
  margin: 0 0 16px;
  padding-bottom: 16px;
  position: relative;
}

.v5-bfs__title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100px;
  height: 2px;
  background: var(--brand-accent, #623CE5);
}

/* Kill any trailing dot Total adds to headings */
.v5-bfs__title .dot,
.v5-bfs__title > span:last-child:not(:first-child) {
  display: none !important;
}


.v5-bfs__desc {
  font-size: 15px;
  line-height: 1.6;
  color: inherit;
}

.v5-bfs__desc p {
  margin: 0;
}

/* Navigation arrows */
.v5-bfs__nav {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 32px;
}

.v5-bfs__arrow {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  border: 2px solid var(--brand-accent, #623CE5);
  background: transparent;
  color: var(--brand-accent, #623CE5);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
  padding: 0;
}

.v5-bfs__arrow svg {
  width: 20px;
  height: 20px;
}

.v5-bfs__arrow:hover,
.v5-bfs__arrow:focus-visible {
  background: var(--brand-accent, #623CE5);
  color: #fff;
}

.v5-bfs__arrow.swiper-button-disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

/* Mobile tweaks */
@media (max-width: 640px) {
  .v5-bfs__nav {
  margin-top: 24px;
  gap: 16px;
  }
  .v5-bfs__arrow {
  width: 42px;
  height: 42px;
  }
}

/*
------------
LINKED CARD CAROUSEL (Initiatives / Solutions)
------------
*/

.v5-lcs {
  position: relative;
  width: 100%;
  padding: 20px 0;
}

.v5-lcs__heading {
  text-align: center;
  margin: 0 0 32px;
  font-size: clamp(24px, 3vw, 34px);
}

.v5-lcs__swiper {
  overflow: hidden;
}

/* Card as a link */
.v5-lcs__card {
  display: block;
  text-decoration: none;
  color: inherit;
  height: 100%;
  box-sizing: border-box;
  transition: transform 0.25s ease;
}

.v5-lcs__card:hover,
.v5-lcs__card:focus-visible {
  transform: translateY(-4px);
  text-decoration: none;
}

/* Media / featured image — force consistent aspect ratio */
.v5-lcs__media {
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 0 52px 0 52px;
  background: rgba(0, 0, 0, 0.05);
  margin-bottom: 16px;
}

.v5-lcs__img,
.v5-lcs__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block;
  transition: transform 0.4s ease;
}

.v5-lcs__card:hover .v5-lcs__img,
.v5-lcs__card:focus-visible .v5-lcs__img {
  transform: scale(1.03);
}

/* Title */
.v5-lcs__title {
  color: inherit;
  font-weight: 700;
  font-size: 26px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin: 0;
  text-align: center;
}

/* Kill any trailing dot Total adds to headings */
.v5-lcs__title .dot,
.v5-lcs__title > span:last-child:not(:first-child) {
  display: none !important;
}

.v5-lcs__title::after {
  content: none !important;
}

/* Navigation arrows — matches benefits carousel */
.v5-lcs__nav {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 32px;
}

.v5-lcs__arrow {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  border: 2px solid var(--brand-accent, #623CE5);
  background: transparent;
  color: var(--brand-accent, #623CE5);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
  padding: 0;
}

.v5-lcs__arrow svg {
  width: 20px;
  height: 20px;
}

.v5-lcs__arrow:hover,
.v5-lcs__arrow:focus-visible {
  background: var(--brand-accent, #623CE5);
  color: #fff;
}

.v5-lcs__arrow.swiper-button-disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

@media (max-width: 640px) {
  .v5-lcs__nav {
  margin-top: 24px;
  gap: 16px;
  }
  .v5-lcs__arrow {
  width: 42px;
  height: 42px;
  }
}

.single-solution .page-header{display:none !important}

.single-initiative .page-header{display:none !important}

/*
------------
SOLUTIONS & INITIATIVES — single page layout
The Solution-Initiative Dynamic Template reuses the blog row classes
(blogHeroRow / blogTitle / blogContent), so these rules mirror the
Insights blog width constraints but scoped to single-solution and
single-initiative (the existing blog rules only apply to .single-post).
------------
*/

.single-solution #content-wrap,
.single-initiative #content-wrap { width: 100% !important; }

/* Constrain title + content rows to a centred column,
   overriding WPBakery stretched-row inline styles */
.single-solution .vc_row.blogTitle,
.single-solution .vc_row.blogContent,
.single-initiative .vc_row.blogTitle,
.single-initiative .vc_row.blogContent {
  width: 75vw !important;
  max-width: 75vw !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  left: auto !important;
  right: auto !important;
}

/* Zero-specificity left default (:where): applies only when nothing
   else sets an alignment, so WPBakery alignment settings and component
   styles (e.g. icon boxes, which centre themselves) always win */
:where(.single-solution, .single-initiative) :where(.blogContent) :where(.wpb_text_column, p, h2, h3, h4, ul, ol, blockquote) {
  text-align: left;
}

/* Helper: add "centredHeading" as the Extra class name on any heading
   in the template you want force-centred (e.g. "How we help") */
.single-solution .blogContent .centredHeading,
.single-solution .blogContent .centredHeading h2,
.single-initiative .blogContent .centredHeading,
.single-initiative .blogContent .centredHeading h2 {
  text-align: center !important;
}

/* Centre Total icon boxes on these templates (title, content, icon) */
.single-solution .blogContent .vcex-icon-box,
.single-solution .blogContent .vcex-icon-box *,
.single-initiative .blogContent .vcex-icon-box,
.single-initiative .blogContent .vcex-icon-box * {
  text-align: center;
}

/* Fallback: if the boxes aren't the Total icon box element, add
   "centredBox" as the Extra class name on the row (or each column)
   holding them and everything inside gets centred */
.single-solution .blogContent .centredBox,
.single-solution .blogContent .centredBox *,
.single-initiative .blogContent .centredBox,
.single-initiative .blogContent .centredBox * {
  text-align: center !important;
}

.single-solution .blogContent .centredBox img,
.single-initiative .blogContent .centredBox img {
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
}

/* Centre the H1 title and pull it up closer to the hero image.
   Tweak the -40px to taste (more negative = closer to the image). */
.single-solution .blogTitle h1,
   .single-initiative .blogTitle h1 {
     text-align: center !important;
     width: 100% !important;
     margin-bottom: 0 !important;
   }

/* Kill the spacing WPBakery adds under the title's text block,
   and any bottom padding on the title row itself */
.single-solution .wpb_text_column.blogTitle,
.single-solution .vc_row.blogTitle,
.single-initiative .wpb_text_column.blogTitle,
.single-initiative .vc_row.blogTitle {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Empty paragraphs WPBakery sometimes leaves around headings */
.single-solution .blogTitle p:empty,
.single-initiative .blogTitle p:empty {
  display: none;
}

/* Only the heading in the first content row straight after the hero
   skips the 50px rhythm margin; later section headings keep theirs */
.single-solution .blogHeroRow + .vc_row.blogContent .wpb_wrapper > h2:first-child,
.single-solution .blogHeroRow + .vc_row.blogContent .wpb_wrapper > .vcex-heading:first-child,
.single-initiative .blogHeroRow + .vc_row.blogContent .wpb_wrapper > h2:first-child,
.single-initiative .blogHeroRow + .vc_row.blogContent .wpb_wrapper > .vcex-heading:first-child {
  margin-top: 0 !important;
}

/* Kill the column-inner bottom margin on the title row only
   (WPBakery sets it via --wpex-vc-column-inner-margin-bottom) */
.single-solution .vc_row.blogTitle .vc_column-inner,
.single-initiative .vc_row.blogTitle .vc_column-inner {
  --wpex-vc-column-inner-margin-bottom: 0;
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  .single-solution .blogTitle h1,
  .single-initiative .blogTitle h1 {
    margin-top: -15px !important;
  }
}

.single-solution .blogContent ul,
.single-solution .blogContent ol,
.single-initiative .blogContent ul,
.single-initiative .blogContent ol {
  display: block !important;
}

/* Consistent heading rhythm with blog posts */
.single-solution .blogContent h2,
.single-initiative .blogContent h2 { margin-top: 50px !important; }
.single-solution .blogContent h3,
.single-initiative .blogContent h3 { margin-top: 40px !important; }

/* Mobile — drop the vw sizing (it clips against WPBakery's inline
   stretched-row widths); let rows fill their parent with inner padding */
@media (max-width: 768px) {
  .single-solution .vc_row.blogTitle,
  .single-solution .vc_row.blogContent,
  .single-initiative .vc_row.blogTitle,
  .single-initiative .vc_row.blogContent {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 4vw !important;
    padding-right: 4vw !important;
    box-sizing: border-box !important;
  }

  /* Stop any stray full-bleed row creating sideways scroll */
  body.single-solution,
  body.single-initiative {
    overflow-x: hidden;
  }
}




.single-post .solutionHero {
  position: relative;
  isolation: isolate;
}

/* Blog/initiative hero: full width, natural aspect ratio, never cropped */
.solutionHero .vcex-image-inner {
  display: block !important;   /* theme sets inline-block */
  width: 100% !important;
}

.solutionHero img {
  display: block;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: initial !important; /* no cropping */
}






/* Kill the column-inner bottom margin on the title row
   (WPBakery sets it via --wpex-vc-column-inner-margin-bottom) */
.single-solution .vc_row .wpb_row:not(:has(h1)),
   .single-initiative .vc_row .wpb_row:not(:has(h1)) {
     margin-bottom: 60px !important;
   }

.contactCallout{border-radius:0px 52px 0px 52px !important; padding:30px}

.contactCallout p{text-align:center !important}

.contactCallout .theme-button{border-color:#170133 !important}
.post-pagination-wrap{display:none !important}
.wpex-social-share{display:none !important}




/*
------------
CARD GRID — Media Hub-style cards for CPT grids (Initiatives, Solutions…)
(add "cardGrid" as the Extra class name on each grid element)
------------
*/

/* Title — same size/colour as Media Hub, no auto-dot */
.cardGrid .entry-title a,
.cardGrid .vcex-post-type-entry-title a{
  color:#170133 !important;
  font-size:24px !important;
}
.cardGrid h2.entry-title:after,
.cardGrid h2.vcex-post-type-entry-title:after,
.cardGrid .entry-title .vcex-heading-inner:after{
  display:none !important;
}

/* Image wrapper — fixed 16:9, same as Media Hub */
.cardGrid .entry-media,
.cardGrid .entry-media a,
.cardGrid .vcex-post-type-entry-media,
.cardGrid .vcex-post-type-entry-media a{
  display:block !important;
  width:100% !important;
  aspect-ratio:16 / 9 !important;
  overflow:hidden !important;
  position:relative;
}

/* Image — fill, centre-crop, brand corner mask */
.cardGrid .entry-media img,
.cardGrid .vcex-post-type-entry-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block;
  max-width:none !important;
  aspect-ratio:auto !important;
  border-radius:0px 52px 0px 52px;
}


/*
------------
JOB TILES (Matador jobs listing — [matador_jobs class="v5-job-tiles"])
------------
*/
.matador-jobs.v5-job-tiles{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:32px;
  align-items:stretch;
}

.v5-job-tiles .v5-job-card{
  display:flex;
  flex-direction:column;
  background:#fff;
  border-radius:10px 40px 40px 40px;      /* squared TL, brand corner motif */
  box-shadow:0 20px 45px -22px rgba(23,1,51,.28);
  padding:28px 28px 24px;
}

.v5-job-tiles .v5-job-card__date{
  margin:0 0 10px;
  font-size:15px;
  font-weight:400;
  color:var(--brand-accent, #623CE5) !important;
}

.v5-job-tiles .v5-job-card__title{
  margin:0 0 12px;
  font-size:24px;
  line-height:1.25;
}
.v5-job-tiles .v5-job-card__title a{
  color:#170133 !important;
  font-weight:700;
  text-decoration:none;
  transition:color .2s ease;
}
.v5-job-tiles .v5-job-card__title a:hover{
  color:var(--brand-accent, #623CE5) !important;
}

.v5-job-tiles .v5-job-card__place,
.v5-job-tiles .v5-job-card__salary{
  margin:0 0 6px;
  font-size:17px;
  color:#170133;
}

/* pill pinned bottom-right; auto margin = equal-height alignment */
.v5-job-tiles .v5-job-card__more{
  margin:auto 0 0;
  padding-top:20px;
  text-align:right;
}

.v5-job-tiles .v5-job-card__title::after,
.v5-job-tiles .v5-job-card__title a::after{
  content:none !important;
}

.v5-job-tiles .v5-job-card__more .theme-button{
  padding:9px 20px;
  font-size:15px;
  border-width:2px;
}

.v5-job-tiles .v5-job-card{
  /* ...existing rules... */
  box-shadow:0 20px 45px -22px rgba(23,1,51,.28);
  transition:box-shadow .3s ease, transform .3s ease;
}

.v5-job-tiles .v5-job-card:hover{
  box-shadow:0 22px 50px -20px color-mix(in srgb, var(--brand-accent, #623CE5) 55%, transparent);

}

/* responsive: 2-up, then stacked */
@media (max-width: 1024px){
  .matador-jobs.v5-job-tiles{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 640px){
  .matador-jobs.v5-job-tiles{ grid-template-columns:1fr; gap:24px; }
}


/*
------------
JOB SINGLE (Matador job detail page)
------------
*/
body.single-matador-job-listings .page-header{ display:none !important; }

.v5-job-single-wrap{
  width:auto;
  max-width:1360px;          /* ← the px width you read off #site-header-inner */
  margin-inline:auto;
  padding-inline:16px;
  padding-top:60px;
  padding-bottom:80px;
}

.v5-job-single{
  display:grid;
  grid-template-columns:minmax(0,1fr) 380px;
  gap:64px;
  align-items:start;
}

/* --- main column --- */
.v5-job-single__date{
  margin:0 0 8px;
  font-size:19px;
  color:var(--brand-accent, #623CE5) !important;
}
.v5-job-single__title{
  margin:0 0 28px;
  font-size:clamp(28px, 3.5vw, 48px);   /* matches site H2 sizing */
  line-height:1.15;
}

/* h1 element at h2 scale → give it the h2-sized dot */
.v5-job-single__title:after{
  font-size: min(max(55px + 35 * ((100vw - 375px) / 1065), 55px), 90px) !important;
}
.v5-job-single__place,
.v5-job-single__type,
.v5-job-single__salary{
  margin:0 0 4px !important;
  font-size:22px;
  font-weight:500;
  color:var(--brand-accent, #623CE5) !important;
}
.v5-job-single__reference{
  margin:12px 0 24px !important;
  font-size:19px;
  color:#170133;
}
.v5-job-single__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:0 0 40px;
}
/* compact pills — same size as the job card buttons */
.v5-job-single__actions .theme-button{
  padding:15px 20px;
  font-size:15px;
  border-width:2px;
}
.v5-job-single__description{ margin-bottom:44px; }
.v5-job-single__description h2,
.v5-job-single__description h3{ margin-top:36px; }

/* share tiles */
.v5-job-single__share{ display:flex; gap:10px; margin:0; }
.v5-share-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px; height:38px;
  background:var(--brand-accent, #623CE5);
  color:#fff !important;
  transition:background-color .2s ease;
}
.v5-share-btn svg{ width:17px; height:17px; }
.v5-share-btn:hover{
  background:color-mix(in srgb, var(--brand-accent, #623CE5) 82%, #000);
}

/* description hyperlinks — brand colour */
.v5-job-single__description a{
  color:var(--brand-accent, #623CE5) !important;
  font-weight:600;
  text-decoration:none;
  transition:color .2s ease;
}
.v5-job-single__description a:hover,
.v5-job-single__description a:focus-visible{
  color:color-mix(in srgb, var(--brand-accent, #623CE5) 75%, #000) !important;
  text-decoration:underline;
  text-underline-offset:3px;
}

/* description headings — no auto-dot on any level */
.v5-job-single__description h2:after,
.v5-job-single__description h3:after,
.v5-job-single__description h4:after,
.v5-job-single__description h5:after{
  content:none !important;
}

/* --- sidebar: stacked job cards reuse the tile styling --- */
.v5-job-tiles--stack{ grid-template-columns:1fr !important; gap:28px; }

/* --- consultant card --- */
.v5-consultant{
  text-align:center;
  margin-bottom:44px;
}
.v5-consultant__photo img{
  display:block;
  width:100%;
  height:auto;
  border-radius:0px 52px 0px 52px;
}
.v5-consultant__name{
  margin:18px 0 2px;
  font-size:24px;
  font-weight:700;
  color:#170133;
}
.v5-consultant__name::after{
  content:".";
  color:var(--brand-accent, #623CE5);
}
.v5-consultant__role{
  margin:0 0 14px;
  font-size:17px;
  color:#170133;
}
.v5-consultant__socials{
  display:flex;
  justify-content:center;
  gap:8px;
  margin:0;
}

.v5-consultant__name{
  margin:16px 0 0 !important;
  font-size:22px;
  font-weight:700;
  line-height:1.2;
  color:#170133;
}
.v5-consultant__name::after{
  content:".";
  color:var(--brand-accent, #623CE5);
}
.v5-consultant__role{
  margin:3px 0 14px !important;
  font-size:16px;
  font-weight:500;
  line-height:1.3;
  color:#170133;
}

/* --- responsive --- */
@media (max-width: 1024px){
  .v5-job-single{ grid-template-columns:1fr; gap:48px; }
}



/*
------------
JOB SEARCH FILTERS (Matador search form)
------------
*/
.v5-job-search form{
  display:flex;
  flex-wrap:wrap;
  gap:20px 28px;
  align-items:flex-end;
  margin-bottom:48px;
}
.v5-job-search input[type="text"],
.v5-job-search input[type="search"]{
  flex:1 1 100%;
  border:0;
  border-bottom:2px solid #170133;
  background:transparent;
  font-size:19px;
  padding:10px 0;
  border-radius:0;
}
.v5-job-search select{
  flex:1 1 180px;
  border:0;
  border-bottom:2px solid #170133;
  background:transparent;
  font-size:17px;
  padding:10px 28px 10px 0;
  border-radius:0;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23170133' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 4px center;
  background-size:16px;
}
.v5-job-search input:focus,
.v5-job-search select:focus{
  outline:none;
  border-bottom-color:var(--brand-accent, #623CE5);
}
.v5-job-search button,
.v5-job-search input[type="submit"]{
  flex:0 0 auto;
  padding:9px 24px;
  font-size:15px;
  font-weight:600;
  border:2px solid var(--brand-accent, #623CE5);
  border-radius:999px;
  background:transparent;
  color:#170133;
  cursor:pointer;
  transition:background-color .2s ease, color .2s ease;
}
.v5-job-search button:hover,
.v5-job-search input[type="submit"]:hover{
  background:var(--brand-accent, #623CE5);
  color:#fff;
}


/* Job archive (search results) — hide default header, tidy no-results */
body.post-type-archive-matador-job-listings .page-header{ display:none !important; }
.v5-jobs-none{ font-size:19px; margin:24px 0 60px; }

/* Pagination on the archive */
body.post-type-archive-matador-job-listings .pagination,
body.post-type-archive-matador-job-listings .nav-links{
  margin-top:48px;
  text-align:center;
}

/* Jobs page + archive H1 — one rule drives both, no jump between pages */
h1.v5-jobs-title{
  font-size: clamp(44px, 6vw, 76px) !important;
  line-height: 1.1;
  margin-top: 48px !important;
  margin-bottom: 36px !important;
}

body.page-id-206 #content-wrap.container, body.page-id-471 #content-wrap.container, body.page-id-479 #content-wrap.container{
  width:auto !important;
  padding-top:100px !important;
  max-width:1360px !important;   /* ← copy the exact value from your .v5-job-single-wrap rule */
}


.v5-job-search .matador-search-form{
  display:flex;
  flex-wrap:wrap;
  gap:20px 28px;
  align-items:flex-end;
  width:100%;
}
/* keyword gets the lion's share, selects share the rest evenly */
.v5-job-search .matador-search-form-field-keyword{
  flex:2 1 260px;
}
.v5-job-search .matador-search-form-field-group{
  flex:1 1 160px;
}
/* button groups stay natural size */
.v5-job-search .matador-search-form-field-group:has(button),
.v5-job-search .matador-search-form-field-group:has(input[type="submit"]),
.v5-job-search .matador-search-form-field-group:has(input[type="reset"]){
  flex:0 0 auto;
}
/* fields fill their group */
.v5-job-search .matador-search-form-field-group input[type="text"],
.v5-job-search .matador-search-form-field-group input[type="search"],
.v5-job-search .matador-search-form-field-group select{
  width:100%;
}

@media (max-width: 768px){
  .v5-job-search .matador-search-form-field-keyword,
  .v5-job-search .matador-search-form-field-group{
    flex:1 1 100%;   /* stack on mobile */
  }
}


/*
------------
JOB APPLY FORM (5V application → Bullhorn — inc/v5-apply.php)
Card matches the job tiles; inputs match the search filters.
------------
*/
.v5-apply{
  background:#fff;
  border-radius:10px 40px 40px 40px;              /* same brand corner motif as tiles */
  box-shadow:0 20px 45px -22px rgba(23,1,51,.28);
  padding:36px 36px 32px;
  margin:0 0 48px;
  scroll-margin-top:120px;                        /* anchor lands clear of sticky header */
}

.v5-apply__title{
  margin:0 0 24px;
  font-size:clamp(24px, 2.6vw, 32px);
  color:#170133;
}
.v5-apply__title::after{ content:none !important; } /* no heading dot inside the card */

.v5-apply__form{
  display:flex;
  flex-wrap:wrap;
  gap:20px 28px;
}
.v5-apply__field{
  flex:1 1 100%;
  margin:0 !important;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.v5-apply__field--half{ flex:1 1 calc(50% - 14px); }

.v5-apply__field label{
  font-size:15px;
  font-weight:600;
  color:#170133;
}
.v5-apply__field label small{ font-weight:400; color:#555; }

.v5-apply__field input[type="text"],
.v5-apply__field input[type="email"],
.v5-apply__field input[type="tel"],
.v5-apply__field textarea{
  border:0;
  border-bottom:2px solid #170133;
  background:transparent;
  font-size:17px;
  padding:8px 0;
  border-radius:0;
}
.v5-apply__field textarea{ resize:vertical; }
.v5-apply__field input:focus,
.v5-apply__field textarea:focus{
  outline:none;
  border-bottom-color:var(--brand-accent, #623CE5);
}

/* file input as a soft brand chip */
.v5-apply__field input[type="file"]{
  font-size:15px;
  padding:12px;
  border:2px dashed color-mix(in srgb, var(--brand-accent,#623CE5) 45%, #fff);
  border-radius:12px;
  background:color-mix(in srgb, var(--brand-accent,#623CE5) 6%, #fff);
}
.v5-apply__field input[type="file"]::file-selector-button{
  margin-right:14px;
  padding:7px 18px;
  font-size:14px;
  font-weight:600;
  border:2px solid var(--brand-accent, #623CE5);
  border-radius:999px;
  background:transparent;
  color:#170133;
  cursor:pointer;
  transition:background-color .2s ease, color .2s ease;
}
.v5-apply__field input[type="file"]::file-selector-button:hover{
  background:var(--brand-accent, #623CE5);
  color:#fff;
}

.v5-apply__consent label{
  font-weight:400;
  font-size:15px;
  flex-direction:row;
  display:flex;
  gap:10px;
  align-items:flex-start;
  line-height:1.5;
}
.v5-apply__consent input[type="checkbox"]{
  margin-top:3px;
  accent-color:var(--brand-accent, #623CE5);
  width:18px;
  height:18px;
  flex:0 0 auto;
}

.v5-apply__submit{
  flex:1 1 100%;
  margin:8px 0 0 !important;
}
.v5-apply__submit .theme-button{
  padding:15px 28px;
  font-size:15px;
}
.v5-apply__submit .theme-button:disabled{
  opacity:.6;
  cursor:wait;
}

/* notices */
.v5-apply__notice{
  font-size:17px;
  padding:14px 18px;
  border-radius:12px;
  margin:0 0 20px;
}
.v5-apply__notice[hidden]{ display:none; }
.v5-apply__notice--success{
  background:color-mix(in srgb, #1a7f37 12%, #fff);
  border:2px solid #1a7f37;
  color:#0f5223;
}
.v5-apply__notice--error{
  background:color-mix(in srgb, #b32d2e 10%, #fff);
  border:2px solid #b32d2e;
  color:#7c1d1e;
}

/* honeypot — visually gone, still in the DOM for bots */
.v5-apply__hp{
  position:absolute !important;
  left:-9999px !important;
  width:1px; height:1px;
  overflow:hidden;
}

@media (max-width: 640px){
  .v5-apply{ padding:26px 22px; }
  .v5-apply__field--half{ flex:1 1 100%; }
}


/* --- Apply form tweaks (add to the JOB APPLY FORM block) ------------- */

/* THE FIX: our display:flex was overriding the browser's [hidden] rule,
   so the form never disappeared after submit (and the button stayed on
   "Sending…"). */
.v5-apply__form[hidden]{ display:none !important; }

/* Right-align the submit button */
.v5-apply__submit{ text-align:right; }

/* Notices now sit under the form/button — space above, not below */
.v5-apply__notice{ margin:20px 0 0; }


/* --- Apply form tweaks (add to the JOB APPLY FORM block) ------------- */

/* THE FIX: our display:flex was overriding the browser's [hidden] rule,
   so the form never disappeared after submit (and the button stayed on
   "Sending…"). */
.v5-apply__form[hidden]{ display:none !important; }

/* Right-align the submit button */
.v5-apply__submit{ text-align:right; }

/* Notices now sit under the form/button — space above, not below */
.v5-apply__notice{ margin:20px 0 0; }


/*
------------
CV UPLOAD MODAL (general CV drop — opened by any link to #upload-cv)
Form itself reuses the .v5-apply styles from the JOB APPLY FORM block.
Append this after that block in style.css.
------------
*/
.v5-cv-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.v5-cv-modal[hidden]{ display:none; }

.v5-cv-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(23,1,51,.55);
}

.v5-cv-modal__card{
  position:relative;
  width:min(720px, 100%);
  max-height:calc(100vh - 48px);
  overflow-y:auto;
  border-radius:10px 40px 40px 40px;    /* brand corner motif */
}
/* the .v5-apply card inside provides bg/padding/shadow — kill its bottom gap */
.v5-cv-modal__card .v5-apply{ margin:0; }

.v5-cv-modal__close{
  position:absolute;
  top:16px;
  right:20px;
  z-index:2;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:transparent;
  font-size:30px;
  line-height:1;
  color:#170133;
  cursor:pointer;
  transition:color .2s ease;
}
.v5-cv-modal__close:hover{ color:var(--brand-accent, #623CE5); }

/* stop the page scrolling behind the modal */
body.v5-cv-modal-open{ overflow:hidden; }

@media (max-width: 640px){
  .v5-cv-modal{ padding:12px; }
  .v5-cv-modal__card{ max-height:calc(100vh - 24px); }
}

/* consent privacy link — inline, black, underlined */
.v5-apply__consent a{
  color:#170133 !important;
  text-decoration:underline;
  text-underline-offset:2px;
}
.v5-apply__consent a:hover{
  color:var(--brand-accent, #623CE5) !important;
}

/* consent — block label with absolutely-positioned checkbox: text + link flow inline */
.v5-apply__consent label{
  display:block;
  position:relative;
  padding-left:30px;
  font-weight:400;
  font-size:15px;
  line-height:1.5;
}
.v5-apply__consent input[type="checkbox"]{
  position:absolute;
  left:0;
  top:2px;
  width:18px;
  height:18px;
  accent-color:var(--brand-accent, #623CE5);
}
.v5-apply__consent a{
  display:inline !important;
  color:#170133 !important;
  text-decoration:underline;
  text-underline-offset:2px;
}
.v5-apply__consent a:hover{
  color:var(--brand-accent, #623CE5) !important;
}




/*
------------
MOBILE PASS — 01: container width + header logo
Append to child theme style.css (after the existing LAYOUTS rules)
------------
*/

/* --- 1. Content wrap: full width on mobile ---------------------------
   The site-wide 55% (and the 75% landing overrides) have no mobile
   fallback, so phones get content squeezed into ~210px. Under 768px
   every variant goes to 100%; Total's .container gutter padding is
   kept so text doesn't touch the viewport edge. */

@media (max-width: 768px) {
  #content-wrap,
  .page-template-landing-75 #content-wrap,
  .page-id-86 #content-wrap {
    width: 100% !important;
  }
}

/* Tablet step — 769–1024px still inherits the 55% desktop rule, which
   is tight on an iPad. Delete this block if you want tablets to keep
   the desktop column. */
@media (min-width: 769px) and (max-width: 1024px) {
  #content-wrap,
  .page-template-landing-75 #content-wrap,
  .page-id-86 #content-wrap {
    width: 85% !important;
  }
}


/* Post-content lists — no indent, markers hug the text edge */
.single-post .blogContent ul,
.single-post .blogContent ol,
.single-solution .blogContent ul,
.single-solution .blogContent ol,
.single-initiative .blogContent ul,
.single-initiative .blogContent ol {
  padding-left: 1.15em;
  margin-left: 0;
}

/* --- 2. Header logo: left-aligned on mobile (v2) ---------------------
   Replaces the previous block. Doubled-ID selectors beat Total's
   Customizer-generated CSS on specificity (it loads after the child
   theme, so equal-specificity !important ties were going to it).
   Resets every centering mechanism Total uses across its mobile
   header styles: float, flex justify-content, margin:auto, and
   absolute positioning with translateX(-50%). */

@media (max-width: 999px) {
  #site-header #site-header-inner {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  #site-logo#site-logo,
  #site-header .header-logo {
    position: static !important;      /* kills absolute + translateX centering */
    left: auto !important;
    transform: none !important;
    float: none !important;
    width: auto !important;           /* kills width:100% + text-align:center */
    margin: 0 auto 0 0 !important;    /* auto right margin = pinned left */
    text-align: left !important;
    display: flex !important;
    justify-content: flex-start !important;
  }

  #site-logo#site-logo a,
  #site-logo#site-logo img,
  #site-logo#site-logo .logo-img {
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: block !important;
  }
}

@media (max-width: 999px) {
  #site-header #site-header-inner {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 20px !important;
  }
  /* burger positions against the container's padding edge, so it
     ignores the padding-inline above — re-inset it to match */
  .nav-toggle {
    right: 20px;
  }
}

/* Hero brand logos (.brandRow) — 3-up on mobile instead of stacking */
@media (max-width: 767px) {
  .brandRow {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
  }
  .brandRow > .wpb_column.vc_col-sm-4 {
    width: 33.333% !important;
    flex: 1 1 0 !important;
    min-width: 0;
    float: none !important;
  }
  /* wpex-vc_row-gap-60 pads each column-inner — too much at 380px wide */
  .brandRow > .wpb_column > .vc_column-inner {
    padding-left: 6px !important;
    padding-right: 6px !important;
    margin-bottom: 0 !important;   /* kill the 40px stack margin per column */
  }
  /* the image wrapper is inline-block — make it fill the column */
  .brandRow .vcex-image,
  .brandRow .vcex-image-inner {
    display: block !important;
    width: 100%;
    margin-bottom: 0;
  }
  .brandRow .vcex-image-img {
    width: 100%;
    height: auto;
    display: block;
  }
}


/* Single post / solution / initiative — mobile edge gutters */
@media (max-width: 768px) {
 /* One gutter, defined once — title and content share it */
 .single-post .blogTitle .vc_column-inner,
 .single-post .blogContent .vc_column-inner,
 .single-solution .blogTitle .vc_column-inner,
 .single-solution .blogContent .vc_column-inner,
 .single-initiative .blogTitle .vc_column-inner,
 .single-initiative .blogContent .vc_column-inner {
   padding-left: 20px !important;
   padding-right: 20px !important;
 }
}

@media (max-width: 768px) {

.staff-entry-media{
  width:70% !important;
  margin:0 auto!important
}

.teamHolder .staff-entry{
  padding-bottom:25px !important
}

h2.teamTitle{
  text-align:center !important
}

#footer{
  margin-top:40px !important}
}




/* Contact addresses — kill the doubled gap between the two
   addressDetails rows (column-inner margins already provide 40px) */
@media (max-width: 767px) {
  .vc_column-inner > .wpb_wrapper > .vc_row.addressDetails {
    margin-bottom: 0 !important;
  }
}


/* ---- Header/logo aligned to content at every width ---- */

/* Single knob per breakpoint: the header's inset from the viewport.
   Values mirror where the content's left edge actually falls. */
:root { --v5-header-gutter: 30px; }               /* ≤768: match vc column gutter */

@media (min-width: 769px) and (max-width: 999px) {
  :root { --v5-header-gutter: calc(7.5vw + 30px); } /* 85% wrap inset + gutter */
}

@media (max-width: 999px) {
  #site-header #site-header-inner {
    width: 100% !important;
    max-width: none !important;
    padding-inline: var(--v5-header-gutter) !important;
  }
  .nav-toggle { right: var(--v5-header-gutter); }
}

/* ≥1000px: Total's 75% container already matches the content container;
   add the column gutter so the logo lines up with the TEXT, not the row */
@media (min-width: 1000px) {
  #site-logo { padding-left: 30px; }
}


/* Icon-box grids (Our specialisms etc.) — 2-up on mobile */
@media (max-width: 767px) {
  .vc_row.vc_inner:has(> .wpb_column .vcex-icon-box) {
    display: flex !important;
    flex-wrap: wrap !important;
  }
  .vc_row.vc_inner:has(> .wpb_column .vcex-icon-box) > .wpb_column {
    width: 50% !important;
    float: none !important;
    min-width: 0;
  }
  .vc_row.vc_inner:has(> .wpb_column .vcex-icon-box) > .wpb_column .vc_column-inner {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  /* icons are 150px site-wide — too big for a half-width column */
  .vc_row.vc_inner:has(> .wpb_column .vcex-icon-box) .vcex-icon-box img {
    height: 90px;
    width: auto;
  }
  /* odd count per row (3-up desktop → 2+1 mobile): centre the orphan */
  .vc_row.vc_inner:has(> .wpb_column .vcex-icon-box) > .wpb_column:last-child:nth-child(odd) {
    margin-inline: auto;
  }
}


@media (max-width:900px){
  .hww__bracket{ display:none; }   /* existing */
  /* ...other existing rules... */

  .hww__modes{ flex-direction:column; align-items:stretch; }
  .hww__mode{ max-width:none; width:100%; }
  .hww__or{ align-self:center; }
  .hww__mode{max-width:100% !important}
  .hww__grid{margin-top:25px !important}
}

/* Proud to power — two logos side by side on mobile */
@media (max-width: 767px) {
  .proudLogos {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    justify-content: center;
  }
  /* the row's 1st and 4th columns are empty spacers — drop them */
  .proudLogos > .wpb_column:has(> .vc_column-inner > .wpb_wrapper:empty) {
    display: none !important;
  }
  .proudLogos > .wpb_column.vc_col-sm-3 {
    width: 50% !important;
    flex: 1 1 0 !important;
    min-width: 0;
    float: none !important;
  }
  .proudLogos > .wpb_column > .vc_column-inner {
    padding-left: 8px !important;
    padding-right: 8px !important;
    margin-bottom: 0 !important;
  }
  /* .logoSize pins height:80px site-wide — at half of ~380px the wide
     marks (502px & 450px wide at 140 tall) would overflow; fit-to-width */
  .proudLogos .logoSize img {
    height: auto !important;
    width: auto;
    max-width: 100%;
    max-height: 56px;
  }
}

@media (max-width: 768px) {
  .v5-dls__card { align-items: center; }   /* add to existing block */
  .v5-dls__media { margin-inline: auto; }  /* belt and braces */
  
  h1.page-header-title{font-size:40px !important}
  .page-header{min-height:400px !important}
}

/* How we work — icons top-aligned against their text on mobile */
@media (max-width: 900px) {
  .hww .hww__item,
  .hww .hww__item--wide {
    align-items: flex-start;
  }
  /* nudge down so the icon's optical centre sits on the title line
     rather than the icon cap towering above the text */
  .hww .hww__icon {
    margin-top: 2px;
  }
  .hww__grid{max-width:100% !important}
}

.mobvidHead{
  min-height:700px
}

@media (min-width: 769px) {
  .single-post .vc_row.blogContent { margin-top: 0 !important; }
  .single-post .vc_row.blogTitle  { transform: none; margin-top: 0 !important; }
}

@media (min-width: 769px) {
  .single-post .blogHeroRow .blogTitle h1 { margin-bottom: 35px !important; line-height:1.02em !important}
}