/* WEALSURE V44 — OFFICIAL LOGO + VISUAL IDENTITY SYSTEM */
:root{
  --ws-brand-green:#008a4b;
  --ws-brand-green-deep:#005f3b;
  --ws-brand-red:#f20d18;
  --ws-brand-red-deep:#c90813;
  --ws-brand-gradient:linear-gradient(105deg,#006b43 0%,#009e55 38%,#f20d18 78%,#c90813 100%);
  --ws-brand-soft:linear-gradient(135deg,rgba(0,138,75,.09),rgba(242,13,24,.075));
}

/* Official supplied logo image */
.wealsure-header .brand,
header .brand{
  display:inline-flex !important;
  align-items:center !important;
  width:188px !important;
  height:58px !important;
  flex:0 0 188px !important;
  overflow:hidden !important;
  text-decoration:none !important;
}
.wealsure-header .brand .ws-official-logo,
header .brand .ws-official-logo,
.footbrand .brand .ws-official-logo,
footer .brand .ws-official-logo{
  display:block !important;
  width:188px !important;
  height:auto !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:left center !important;
}
.footbrand .brand{
  display:inline-flex !important;
  width:205px !important;
  height:64px !important;
  overflow:hidden !important;
}
.footbrand .brand .ws-official-logo{width:205px !important}

/* Make the whole site visually follow the supplied green/red identity. */
body{
  background:
    radial-gradient(circle at 5% 0%,rgba(0,138,75,.055),transparent 25%),
    radial-gradient(circle at 95% 8%,rgba(242,13,24,.045),transparent 24%),
    #fff !important;
}
.wealsure-header, header.wealsure-header, header{
  background:rgba(255,255,255,.94) !important;
  border-top:2px solid transparent !important;
  border-image:var(--ws-brand-gradient) 1 !important;
  border-bottom:1px solid rgba(0,95,59,.10) !important;
}
.wealsure-header .links>a:after,
.wealsure-header .drop-wrap>a:after,
header .links>a:after,
header .drop-wrap>a:after{
  background:var(--ws-brand-gradient) !important;
}

/* Official logo palette for any legacy text-brand fallback. */
.brand .logo-weal{color:var(--ws-brand-green) !important;-webkit-text-fill-color:var(--ws-brand-green) !important}
.brand .logo-sure{color:var(--ws-brand-red) !important;-webkit-text-fill-color:var(--ws-brand-red) !important}

/* Replace remaining hard-black heading rendering with the identity gradient. */
html body :where(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.display,.display-title,.page-title,.section-title,.section-heading,.hero-title,.hero-heading,[class*="title"],[class*="heading"]){
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  background-image:var(--ws-brand-gradient) !important;
  background-color:transparent !important;
  background-size:200% auto !important;
  background-position:left center !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  text-shadow:none !important;
}
html body :where(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.display,.display-title,.page-title,.section-title,.section-heading,.hero-title,.hero-heading,[class*="title"],[class*="heading"]) :where(span,em,strong,b,i){
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  background-image:var(--ws-brand-gradient) !important;
  background-clip:text !important;
  -webkit-background-clip:text !important;
  text-shadow:none !important;
}

/* Premium green/red accents across UI elements. */
:where(.accent,.highlight,.eyebrow,.kicker,.section-kicker .eyebrow){
  color:var(--ws-brand-green) !important;
  -webkit-text-fill-color:var(--ws-brand-green) !important;
}
:where(button,.btn,a.btn,input[type="submit"],input[type="button"],.cta,.cta-button){
  background:var(--ws-brand-gradient) !important;
  border-color:transparent !important;
}
:where(button,.btn,a.btn,input[type="submit"],input[type="button"],.cta,.cta-button):hover{
  background:linear-gradient(105deg,#f20d18 0%,#d20a15 35%,#008a4b 100%) !important;
}

/* Footer follows the logo identity rather than the old maroon theme. */
footer{
  border-top:2px solid transparent !important;
  border-image:var(--ws-brand-gradient) 1 !important;
}

@media(max-width:820px){
  .wealsure-header .brand, header .brand{width:148px !important;height:50px !important;flex-basis:148px !important}
  .wealsure-header .brand .ws-official-logo,header .brand .ws-official-logo{width:148px !important}
  .footbrand .brand{width:175px !important;height:56px !important}
  .footbrand .brand .ws-official-logo{width:175px !important}
}