@charset "utf-8";
/* ------------------------------------------------------------------
   PC Medic - style.css  (homepage)

   A blend: the deep-green masthead, black utility bar and mint accents
   of pcmatic.com, carrying PC Medic branding, copy and product.

   Typography
     Headlines ............... Lato (as specified)
     Main menu + hero H2 ...... Plus Jakarta Sans 700/400  (closest free match)
     Body / UI (Circular Book)  Plus Jakarta Sans 400/500/600

   Deep green (masthead) .... #0C413A
   Deep green dark .......... #062420
   Deep green light ......... #14855F
   Nav / ink ................ #14181B
   Kelly green (brand) ...... #00CE7C
   Green hover .............. #00B86E
   Green active ............. #009C5D
   Mint (bright accent) ..... #33F1B7
   Lime (gradient accent) ... #A0FF00
   Body text ................ #4C565C
   Muted .................... #7A858B
   Light surface ............ #F6F8F7
   Mint panel ............... #F2F5F7
   Hairline ................. #E2E7E4
   ------------------------------------------------------------------ */

/* ==================================================================
   1. COMMON HTML ELEMENTS
   ================================================================== */

/* No `scroll-behavior: smooth` here: the same-page anchors are animated
   with jQuery, and a CSS smooth-scroll on HTML competes with it. */

BODY
{
font-family: 'Plus Jakarta Sans', 'Helvetica Neue', Arial, sans-serif;
font-size: 17px;
line-height: 1.65;
color: #4C565C;
background-color: #FFFFFF;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
}

/* Headlines carry Lato. */
H1, H2, H3, H4, H5, H6
{
font-family: 'Lato', 'Helvetica Neue', Arial, sans-serif;
font-weight: 900;
line-height: 1.15;
color: #14181B;
letter-spacing: -0.015em;
}

H1
{
font-size: 48px;
}

H2
{
font-size: 36px;
}

H3
{
font-size: 26px;
}

P
{
margin-bottom: 1rem;
}

A
{
color: #009C5D;
}

A:hover, A:focus
{
color: #00B86E;
}

STRONG, B
{
font-weight: 800;
}

SECTION
{
position: relative;
padding: 76px 0;
}

IMG
{
max-width: 100%;
height: auto;
}

/* ==================================================================
   2. BOOTSTRAP OVERRIDES
   ================================================================== */

.container
{
max-width: 1200px;
}

.lead
{
font-size: 19px;
font-weight: 400;
line-height: 1.6;
}

.btn
{
font-family: 'Plus Jakarta Sans', 'Helvetica Neue', Arial, sans-serif;
font-weight: 700;
border-radius: 4px;
letter-spacing: 0.01em;
-webkit-transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease, color 150ms ease, -webkit-transform 150ms ease;
transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease, color 150ms ease, transform 150ms ease;
}

.btn:focus,
.btn.focus
{
outline: 0;
}

/* --- Primary CTA: mint green --- */
.btn-cta
{
display: inline-block;
padding: 17px 34px;
font-size: 19px;
line-height: 1.2;
color: #FFFFFF;
background-color: #00CE7C;
border: 1px solid #00CE7C;
box-shadow: 0 2px 0 0 #009C5D, 0 6px 14px 0 rgba(0, 156, 93, 0.28);
white-space: nowrap;
}

.btn-cta:hover
{
color: #FFFFFF;
background-color: #00B86E;
border-color: #00B86E;
box-shadow: 0 2px 0 0 #00854F, 0 9px 20px 0 rgba(0, 156, 93, 0.36);
-webkit-transform: translateY(-1px);
transform: translateY(-1px);
}

.btn-cta:focus,
.btn-cta.focus
{
color: #FFFFFF;
background-color: #00B86E;
border-color: #00B86E;
box-shadow: 0 0 0 3px rgba(0, 206, 124, 0.35);
}

.btn-cta:not(:disabled):not(.disabled):active,
.btn-cta:not(:disabled):not(.disabled).active
{
color: #FFFFFF;
background-color: #009C5D;
border-color: #009C5D;
box-shadow: inset 0 3px 6px 0 rgba(0, 0, 0, 0.24);
-webkit-transform: translateY(1px);
transform: translateY(1px);
}

.btn-cta.btn-lg
{
padding: 19px 40px;
font-size: 21px;
}

/* --- Ghost CTA: outline on dark --- */
.btn-ghost
{
display: inline-block;
padding: 16px 30px;
font-size: 17px;
line-height: 1.2;
color: #FFFFFF;
background-color: transparent;
border: 2px solid rgba(255, 255, 255, 0.55);
white-space: nowrap;
}

.btn-ghost:hover
{
color: #0C413A;
background-color: #FFFFFF;
border-color: #FFFFFF;
-webkit-transform: translateY(-1px);
transform: translateY(-1px);
}

.btn-ghost:focus,
.btn-ghost.focus
{
color: #0C413A;
background-color: #FFFFFF;
border-color: #FFFFFF;
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.4);
}

.btn-ghost:not(:disabled):not(.disabled):active,
.btn-ghost:not(:disabled):not(.disabled).active
{
color: #0C413A;
background-color: #E6FBF2;
border-color: #E6FBF2;
box-shadow: inset 0 3px 6px 0 rgba(0, 0, 0, 0.18);
-webkit-transform: translateY(1px);
transform: translateY(1px);
}

/* --- Ink CTA: black card button --- */
.btn-ink
{
display: inline-block;
padding: 15px 28px;
font-size: 16px;
line-height: 1.2;
color: #FFFFFF;
background-color: #14181B;
border: 1px solid #14181B;
white-space: nowrap;
}

.btn-ink:hover
{
color: #14181B;
background-color: #FFFFFF;
border-color: #FFFFFF;
-webkit-transform: translateY(-1px);
transform: translateY(-1px);
}

.btn-ink:focus,
.btn-ink.focus
{
color: #14181B;
background-color: #FFFFFF;
border-color: #FFFFFF;
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}

.btn-ink:not(:disabled):not(.disabled):active,
.btn-ink:not(:disabled):not(.disabled).active
{
color: #14181B;
background-color: #E6FBF2;
border-color: #E6FBF2;
box-shadow: inset 0 3px 6px 0 rgba(0, 0, 0, 0.18);
-webkit-transform: translateY(1px);
transform: translateY(1px);
}

.btn-ink.btn-block,
.btn-cta.btn-block
{
display: block;
width: 100%;
}

.eyebrow
{
display: block;
margin-bottom: 12px;
font-size: 13px;
font-weight: 800;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #00B86E;
}

.text-muted-soft
{
color: #7A858B;
}

.section-head
{
max-width: 720px;
margin: 0 auto 46px;
text-align: center;
}

.section-head P
{
margin-bottom: 0;
font-size: 18px;
color: #6B757B;
}

.section-head H2
{
margin-bottom: 14px;
}

/* ==================================================================
   3. PRE-NAV (thin black utility bar)
   ================================================================== */

.pre-nav
{
background-color: #000000;
}

.pre-nav-inner
{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
min-height: 38px;
}

.pre-tag
{
font-size: 13px;
font-weight: 600;
letter-spacing: 0.03em;
color: rgba(255, 255, 255, 0.72);
}

.pre-dot
{
display: inline-block;
width: 8px;
height: 8px;
margin-right: 8px;
background-color: #00CE7C;
border-radius: 50%;
vertical-align: middle;
}

.pre-links
{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 0;
}

.pre-links LI
{
margin-left: 22px;
}

.pre-links A
{
font-size: 13px;
font-weight: 600;
letter-spacing: 0.03em;
color: rgba(255, 255, 255, 0.65);
text-decoration: none;
-webkit-transition: color 150ms ease;
transition: color 150ms ease;
}

.pre-links A:hover,
.pre-links A:focus
{
color: #FFFFFF;
text-decoration: none;
}

/* ==================================================================
   4. MASTHEAD (one background image behind navbar + hero)
   ================================================================== */

.masthead
{
position: relative;
color: #FFFFFF;
background-color: #0C413A;
background-image: url("../img/hero-bg.jpg");
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
}

/* Left-side scrim: keeps the white headline legible over the artwork.
   Full width with a long fade, so it never leaves a visible seam. */
.masthead:before
{
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 100%;
height: 100%;
content: "";
background-image: -webkit-linear-gradient(left, rgba(4, 20, 17, 0.80) 0%, rgba(4, 20, 17, 0.58) 34%, rgba(4, 20, 17, 0.24) 62%, rgba(4, 20, 17, 0) 100%);
background-image: linear-gradient(to right, rgba(4, 20, 17, 0.80) 0%, rgba(4, 20, 17, 0.58) 34%, rgba(4, 20, 17, 0.24) 62%, rgba(4, 20, 17, 0) 100%);
pointer-events: none;
}

/* The masthead meets the product band on a clean edge. The signature
   gradient hairline that used to sit here was removed on request; the
   band below now carries the separation as padding. */

/* ==================================================================
   5. HEADER / NAV (transparent over the masthead)
   ================================================================== */

#siteHeader
{
position: relative;
z-index: 1030;
}

#siteHeader .navbar
{
padding: 16px 0;
background-color: transparent;
}

#siteHeader .navbar-brand
{
padding: 0;
margin-right: 0;
}

#siteHeader .brand-logo
{
display: block;
width: 178px;
height: auto;
}

/* Menu items: Circular Std Bold stand-in. */
#siteHeader .nav-link
{
padding: 10px 15px;
font-family: 'Plus Jakarta Sans', 'Helvetica Neue', Arial, sans-serif;
font-size: 15.5px;
font-weight: 700;
letter-spacing: 0.005em;
color: rgba(255, 255, 255, 0.92);
-webkit-transition: background-color 150ms ease, color 150ms ease;
transition: background-color 150ms ease, color 150ms ease;
}

#siteHeader .nav-link:hover,
#siteHeader .nav-link:focus
{
color: #FFFFFF;
background-color: rgba(255, 255, 255, 0.14);
border-radius: 4px;
}

#siteHeader .navbar-nav .show > .nav-link
{
color: #33F1B7;
background-color: rgba(255, 255, 255, 0.14);
border-radius: 4px;
}

#siteHeader .dropdown-toggle:after
{
margin-left: 6px;
vertical-align: 0.16em;
border-top-color: currentColor;
}

#siteHeader .dropdown-menu
{
padding: 8px 0;
margin-top: 8px;
background-color: #FFFFFF;
border: 1px solid #E2E7E4;
border-radius: 6px;
box-shadow: 0 16px 36px 0 rgba(6, 20, 17, 0.28);
}

#siteHeader .dropdown-item
{
padding: 9px 20px;
font-size: 14.5px;
font-weight: 600;
color: #14181B;
}

#siteHeader .dropdown-item:hover,
#siteHeader .dropdown-item:focus
{
color: #009C5D;
background-color: #F2F5F7;
}

#siteHeader .navbar-toggler
{
padding: 7px 11px;
border: 1px solid rgba(255, 255, 255, 0.4);
border-radius: 4px;
}

#siteHeader .navbar-toggler:focus
{
outline: 0;
box-shadow: 0 0 0 3px rgba(51, 241, 183, 0.35);
}

/* ==================================================================
   6. HERO
   ================================================================== */

#pg-home #hero
{
position: relative;
z-index: 2;
/* 15px bottom padding gives the trailing phrasing ("No credit card...")
   breathing room inside the section. The figure carries a matching
   negative margin so it still reaches the masthead's bottom edge and the
   worker's fade keeps landing on the hairline. */
padding: 46px 0 15px;
}

#pg-home #hero .hero-chip
{
display: inline-block;
padding: 7px 16px;
margin-bottom: 20px;
font-size: 12.5px;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
color: #B6FFE4;
background-color: rgba(0, 206, 124, 0.18);
border: 1px solid rgba(51, 241, 183, 0.42);
border-radius: 100px;
}

#pg-home #hero .hero-chip-dot
{
display: inline-block;
width: 8px;
height: 8px;
margin-right: 8px;
background-color: #33F1B7;
border-radius: 50%;
vertical-align: middle;
}

#pg-home #hero H1
{
margin-bottom: 18px;
font-size: 56px;
line-height: 1.06;
color: #FFFFFF;
}

/* Heading emphasis sits in plain white, matching the rest of the H1. */
#pg-home #hero H1 .hl
{
color: #FFFFFF;
}

#pg-home #hero H2.hero-sub
{
max-width: 540px;
margin-bottom: 24px;
font-family: 'Plus Jakarta Sans', 'Helvetica Neue', Arial, sans-serif;
font-size: 20px;
font-weight: 400;
line-height: 1.5;
letter-spacing: 0;
color: rgba(255, 255, 255, 0.88);
}

#pg-home #hero .hero-points
{
margin-bottom: 28px;
}

#pg-home #hero .hero-points LI
{
position: relative;
padding-left: 34px;
margin-bottom: 11px;
font-size: 15.5px;
line-height: 1.5;
color: rgba(255, 255, 255, 0.9);
}

#pg-home #hero .hero-points LI:before
{
position: absolute;
top: 2px;
left: 0;
width: 22px;
height: 22px;
content: "";
background-color: #00CE7C;
border-radius: 50%;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' d='M5 12.5l5 5L19 7'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center center;
background-size: 13px 13px;
}

#pg-home #hero .hero-actions
{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}

#pg-home #hero .hero-actions .btn
{
margin-right: 14px;
margin-bottom: 12px;
}

#pg-home #hero .hero-note
{
margin-bottom: 0;
font-size: 13.5px;
letter-spacing: 0.01em;
color: rgba(255, 255, 255, 0.62);
}

/* --- 6.1 Hero figure (the photograph) --- */

#pg-home #hero .hero-figure
{
position: relative;
text-align: center;
/* Cancels the hero's 15px bottom padding so the worker still meets the
   masthead edge at every width even when the copy column is the taller
   one (about 992-1100px). */
margin-bottom: -15px;
}

#pg-home #hero .hero-worker
{
display: block;
width: 100%;
max-width: 620px;
height: auto;
margin: 0 auto;
/* True transparent cutout. The image is framed at the waist, so the lower
   body fades out. The fade is tuned to reach zero right at the masthead's
   bottom edge (the hero has no bottom padding and this column is the
   tallest, so its base sits flush with that edge): the figure therefore
   rises out of the dark instead of stopping in a hard line, and the mint
   hairline lands just under his last visible pixels. */
-webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 70%, rgba(0, 0, 0, 0) 100%);
mask-image: linear-gradient(to bottom, #000 0%, #000 70%, rgba(0, 0, 0, 0) 100%);
-webkit-mask-size: 100% 100%;
mask-size: 100% 100%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
/* No shadow: the artwork's own canvas edge was visible as a hard band.
   A slight lift and punch keep the on-brand green from muddying into
   the green mesh, without any outline that can betray the image box. */
-webkit-filter: brightness(1.06) contrast(1.05);
filter: brightness(1.06) contrast(1.05);
}

/* ==================================================================
   7. PAGE: HOME
   ================================================================== */

/* --- 7.1 AUDIENCE BAND: For Home / For Business / For Government --- */

#pg-home #products
{
/* Top padding is the breathing room between the masthead and the
   tri-box band; the masthead itself no longer paints a divider bar. */
padding: 76px 0 68px;
background-color: #F2F5F7;
margin-top: 0;
}

#pg-home #products .product-card
{
height: 100%;
padding: 32px 30px 30px;
color: #FFFFFF;
background-color: #14181B;
border-top: 4px solid #00CE7C;
border-radius: 8px;
box-shadow: 0 22px 46px 0 rgba(20, 24, 27, 0.24);
}

#pg-home #products .product-icon
{
display: block;
width: 44px;
height: 44px;
margin-bottom: 18px;
}

#pg-home #products .product-icon SVG
{
display: block;
width: 44px;
height: 44px;
stroke: #33F1B7;
stroke-width: 1.8;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}

#pg-home #products .product-heading
{
margin-bottom: 10px;
font-size: 24px;
color: #FFFFFF;
}

#pg-home #products .product-desc
{
margin-bottom: 22px;
font-size: 15.5px;
line-height: 1.6;
color: rgba(255, 255, 255, 0.72);
}

/* --- 7.2 FEATURE CARDS --- */

#pg-home #features
{
background-color: #FFFFFF;
}

#pg-home #features .features-headline
{
margin-bottom: 14px;
text-align: center;
}

#pg-home #features .features-sub
{
max-width: 700px;
margin: 0 auto 46px;
font-size: 18px;
color: #6B757B;
text-align: center;
}

#pg-home #features .feature-col
{
margin-bottom: 24px;
}

#pg-home #features .feature-card
{
height: 100%;
padding: 30px 26px;
background-color: #FFFFFF;
border: 1px solid #E2E7E4;
border-radius: 8px;
-webkit-transition: border-color 180ms ease, box-shadow 180ms ease, -webkit-transform 180ms ease;
transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

#pg-home #features .feature-card:hover
{
border-color: rgba(0, 206, 124, 0.55);
box-shadow: 0 14px 30px 0 rgba(20, 24, 27, 0.1);
-webkit-transform: translateY(-3px);
transform: translateY(-3px);
}

#pg-home #features .feature-icon
{
/* Flex centring, not a hand-tuned margin: a margin-top on the SVG
   collapses through this block span (it has no padding or border of its
   own), which shifted the whole pill down and pinned the icon to the top
   instead of centring it. */
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 52px;
height: 52px;
margin-bottom: 18px;
background-color: #E6FBF2;
border-radius: 12px;
}

#pg-home #features .feature-icon SVG
{
display: block;
width: 30px;
height: 30px;
/* The flex parent centres this; any margin here would collapse through
   the span and push the icon off-centre. */
margin: 0;
stroke: #009C5D;
stroke-width: 2;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}

#pg-home #features .feature-heading
{
margin-bottom: 8px;
font-size: 19px;
}

#pg-home #features .feature-desc
{
margin-bottom: 0;
font-size: 15.5px;
color: #6B757B;
}

/* --- 7.3 SAFETY / REASSURANCE --- */

#pg-home #safety
{
padding: 62px 0;
background-color: #0E1A16;
}

#pg-home #safety H2
{
color: #FFFFFF;
}

#pg-home #safety .safety-lead
{
max-width: 660px;
margin: 0 auto 44px;
font-size: 18px;
color: rgba(255, 255, 255, 0.72);
}

#pg-home #safety .safety-item
{
height: 100%;
padding: 26px 24px;
background-color: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(0, 206, 124, 0.24);
border-radius: 6px;
}

#pg-home #safety .safety-item H3
{
margin: 16px 0 8px;
font-size: 19px;
color: #FFFFFF;
}

#pg-home #safety .safety-item P
{
margin-bottom: 0;
font-size: 15.5px;
color: rgba(255, 255, 255, 0.68);
}

#pg-home #safety .safety-icon
{
display: block;
width: 42px;
height: 42px;
}

#pg-home #safety .safety-icon SVG
{
display: block;
width: 42px;
height: 42px;
stroke: #00CE7C;
stroke-width: 2;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}

#pg-home #safety .safety-note
{
max-width: 820px;
margin: 40px auto 0;
padding: 20px 26px;
font-size: 16px;
color: #FFFFFF;
text-align: center;
background-color: rgba(0, 206, 124, 0.12);
border-left: 4px solid #00CE7C;
border-radius: 4px;
}

/* --- 7.4 WHAT IT SCANS --- */

#pg-home #scans
{
background-color: #F6F8F7;
}

#pg-home #scans .row > DIV
{
padding-bottom: 10px;
}

#pg-home #scans .scan-card
{
height: 100%;
padding: 24px 22px;
background-color: #FFFFFF;
border: 1px solid #E2E7E4;
border-radius: 6px;
-webkit-transition: border-color 180ms ease, box-shadow 180ms ease, -webkit-transform 180ms ease;
transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

#pg-home #scans .scan-card:hover
{
border-color: rgba(0, 206, 124, 0.55);
box-shadow: 0 12px 26px 0 rgba(20, 24, 27, 0.09);
-webkit-transform: translateY(-3px);
transform: translateY(-3px);
}

#pg-home #scans .scan-icon
{
display: block;
width: 34px;
height: 34px;
margin-bottom: 14px;
}

#pg-home #scans .scan-icon SVG
{
display: block;
width: 34px;
height: 34px;
stroke: #00CE7C;
stroke-width: 2;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}

#pg-home #scans .scan-card H3
{
margin-bottom: 7px;
font-size: 18px;
}

#pg-home #scans .scan-card P
{
margin-bottom: 0;
font-size: 15px;
color: #6B757B;
}

/* --- 7.5 STATS BAND --- */

#pg-home #stats
{
padding: 58px 0;
background-color: #0C413A;
background-image: -webkit-linear-gradient(-70deg, #0C413A 0%, #062420 100%);
background-image: linear-gradient(-70deg, #0C413A 0%, #062420 100%);
}

#pg-home #stats .stat-col
{
margin-bottom: 26px;
}

#pg-home #stats .stat
{
padding: 0 14px;
text-align: center;
}

#pg-home #stats .stat-figure
{
display: block;
font-family: 'Lato', 'Helvetica Neue', Arial, sans-serif;
font-size: 44px;
font-weight: 900;
line-height: 1.1;
letter-spacing: -0.02em;
color: #33F1B7;
}

#pg-home #stats .stat-label
{
display: block;
margin-top: 8px;
font-size: 15px;
line-height: 1.4;
color: rgba(255, 255, 255, 0.72);
}

/* --- 7.6 HOW IT WORKS --- */

#pg-home #how .step
{
position: relative;
height: 100%;
padding: 0 6px;
text-align: center;
}

#pg-home #how .step-no
{
display: block;
width: 46px;
height: 46px;
margin: 0 auto 18px;
font-family: 'Lato', 'Helvetica Neue', Arial, sans-serif;
font-size: 21px;
font-weight: 900;
line-height: 42px;
color: #FFFFFF;
text-align: center;
background-color: #00CE7C;
border-radius: 50%;
box-shadow: 0 6px 14px 0 rgba(0, 156, 93, 0.3);
}

#pg-home #how .step H3
{
margin-bottom: 8px;
font-size: 19px;
}

#pg-home #how .step P
{
font-size: 15.5px;
color: #6B757B;
}

#pg-home #how .step-arrow
{
display: block;
padding-top: 16px;
font-size: 26px;
font-weight: 900;
color: #D8DEDA;
text-align: center;
}

/* --- 7.7 FINAL CTA --- */

#pg-home #finalCta
{
padding: 74px 0;
color: #FFFFFF;
background-color: #0C413A;
background-image: -webkit-radial-gradient(110% 140% at 18% 12%, #14855F 0%, #0C413A 48%, #062420 100%);
background-image: radial-gradient(110% 140% at 18% 12%, #14855F 0%, #0C413A 48%, #062420 100%);
}

#pg-home #finalCta H2
{
margin-bottom: 14px;
font-size: 38px;
color: #FFFFFF;
}

#pg-home #finalCta P
{
max-width: 620px;
margin: 0 auto 26px;
font-size: 18px;
color: rgba(255, 255, 255, 0.8);
}

#pg-home #finalCta .text-muted-soft
{
color: rgba(255, 255, 255, 0.6) !important;
}

/* ==================================================================
   8. FOOTER
   ================================================================== */

#siteFooter
{
padding: 62px 0 0;
color: rgba(255, 255, 255, 0.66);
background-color: #0E1A16;
}

#siteFooter .footer-logo
{
width: 178px;
height: auto;
margin-bottom: 16px;
}

#siteFooter .footer-brand P
{
max-width: 300px;
font-size: 15px;
color: rgba(255, 255, 255, 0.58);
}

#siteFooter .footer-col H3
{
margin-bottom: 18px;
font-size: 13px;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #FFFFFF;
}

#siteFooter UL
{
margin-bottom: 0;
}

#siteFooter UL LI
{
margin-bottom: 10px;
}

#siteFooter UL LI A
{
font-size: 15px;
color: rgba(255, 255, 255, 0.66);
text-decoration: none;
}

#siteFooter UL LI A:hover,
#siteFooter UL LI A:focus
{
color: #00CE7C;
text-decoration: none;
}

#siteFooter .footer-contact LI
{
font-size: 15px;
line-height: 1.55;
color: rgba(255, 255, 255, 0.66);
overflow-wrap: break-word;
word-wrap: break-word;
}

#siteFooter .footer-contact A
{
color: rgba(255, 255, 255, 0.66);
text-decoration: none;
}

#siteFooter .footer-contact A:hover
{
color: #00CE7C;
}

#siteFooter .footer-bottom
{
margin-top: 46px;
padding: 22px 0;
font-size: 14px;
color: rgba(255, 255, 255, 0.5);
border-top: 1px solid rgba(255, 255, 255, 0.12);
}

#siteFooter .footer-bottom P
{
margin-bottom: 6px;
}

/* ==================================================================
   9. UTILITY
   ================================================================== */

.sr-only-focusable:active,
.sr-only-focusable:focus
{
position: static;
width: auto;
height: auto;
overflow: visible;
clip: auto;
white-space: normal;
}