/*
Theme Name: STST Modern Corporate
Theme URI: https://stst.com.sg/
Author: STST Website Team
Description: Modern four-page corporate website for ST Semiconductor Testing Pte Ltd.
Version: 2.1.3
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: stst-modern
*/
:root{--orange:#f8991e;--black:#101112;--muted:#6e7278;--light:#f5f6f6;--line:#e6e8e9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--black);background:white;font:16px/1.7 Inter,Arial,sans-serif}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}button,input,textarea{font:inherit}.wrap{width:min(1180px,calc(100% - 48px));margin:auto}.header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid #ececec}.navrow{display:flex;align-items:center;justify-content:space-between;min-height:94px;gap:30px}.brand img{width:116px;height:auto}.menu{display:flex;gap:34px;align-items:center}.menu a{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.menu a:hover,.menu .current-menu-item a{color:#d87a00}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--orange);color:#101112;padding:8px 24px;font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;border:0;cursor:pointer;transition:.2s}.btn:hover{background:#ffae3d;transform:translateY(-2px)}.btn.dark{background:#161616;color:white}.btn.outline{background:transparent;color:white;border:1px solid #ffffff88}.navtoggle{display:none;border:0;background:transparent;font-size:25px}.hero{min-height:670px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(8,12,16,.92),rgba(8,12,16,.52)),url('assets/images/slide_img_24_2048x1152.jpg') center/cover;color:white}.eyebrow{color:var(--orange);font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;margin:0 0 18px}.hero h1{font-size:clamp(44px,6vw,80px);line-height:1.07;letter-spacing:-.055em;max-width:850px;margin:0 0 28px}.hero p.lead{font-size:18px;max-width:630px;color:#d8dcde;margin-bottom:35px}.actions{display:flex;flex-wrap:wrap;gap:14px}.section{padding:105px 0}.section.alt{background:var(--light)}.section.dark{background:#141617;color:white}.section h2,.page-hero h1{font-size:clamp(34px,4vw,55px);line-height:1.15;letter-spacing:-.045em;margin:0 0 22px}.section .intro{max-width:680px;color:var(--muted);font-size:17px}.section.dark .intro{color:#aab0b2}.split{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}.photo{width:100%;height:470px;object-fit:cover}.kicker{height:4px;width:45px;background:var(--orange);margin-bottom:22px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.product{background:white;border:1px solid var(--line);transition:.25s;overflow:hidden}.product:hover{box-shadow:0 20px 45px #00000012;transform:translateY(-4px)}.product img{width:100%;height:220px;object-fit:cover}.product .content{padding:27px}.product h3{font-size:21px;line-height:1.3;margin:5px 0 12px}.product p{font-size:14px;color:var(--muted);margin:0}.num{color:#dc810d;font-size:12px;font-weight:850;letter-spacing:.15em}.featureline{border-top:1px solid var(--line);padding:18px 0;font-weight:500}.cta{padding:80px 0;background:var(--orange)}.cta .wrap{display:flex;justify-content:space-between;align-items:center;gap:40px}.cta h2{font-size:clamp(30px,4vw,40px);line-height:1.1;max-width:680px;margin:0}.page-hero{padding:110px 0;background:#17191a;color:white;position:relative;overflow:hidden}.page-hero:after{content:'';position:absolute;right:-100px;top:-200px;width:450px;height:450px;border:90px solid #f8991e18;border-radius:50%}.page-hero p{max-width:650px;color:#bec3c5}.values{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.value{padding:32px;border:1px solid var(--line);background:white}.value h3{font-size:21px}.value p{color:var(--muted)}.contactgrid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px}.contactgrid h3{font-size:22px}.contact-detail{padding:22px 0;border-bottom:1px solid var(--line)}.contact-detail strong{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#d5820e}.contact-detail a:hover{color:#d5820e}.formbox{padding:42px;background:#f5f6f6}.field{margin-bottom:18px}.field label{display:block;font-weight:700;font-size:13px;margin-bottom:6px}.field input,.field textarea{width:100%;padding:13px 15px;border:1px solid #d8dbdd;background:white;border-radius:0}.field textarea{min-height:140px;resize:vertical}.notice{padding:12px 15px;background:#e8f4e8;margin-bottom:20px}.notice.error{background:#ffe8e5}.footer{background:#101112;color:white;padding:65px 0 20px}.footer-main{display:flex;justify-content:space-between;gap:35px;align-items:start;padding-bottom:45px}.footer-logo{background:white;padding:8px;display:inline-block}.footer-logo img{width:100px}.footer nav{display:flex;gap:20px;flex-wrap:wrap}.footer nav a:hover{color:var(--orange)}.footbottom{border-top:1px solid #3c3e40;padding-top:20px;color:#a2a5a8;font-size:12px}.certs{display:flex;gap:16px;flex-wrap:wrap;margin-top:22px}.certs a{border:1px solid #ddd;padding:12px 18px;font-weight:700;font-size:13px}.certs a:hover{border-color:var(--orange)}.small{font-size:14px;color:var(--muted)}.wp-block-image img{height:auto}@media(max-width:800px){.navrow{min-height:75px}.brand img{width:94px}.navtoggle{display:block}.menu{display:none;position:absolute;top:75px;left:0;right:0;background:white;padding:25px 24px;flex-direction:column;align-items:stretch;gap:20px;border-bottom:1px solid #ddd}.menu.open{display:flex}.header .desktop-cta{display:none}.hero{min-height:590px}.split,.contactgrid{grid-template-columns:1fr;gap:36px}.grid3,.values{grid-template-columns:1fr 1fr}.section{padding:70px 0}.photo{height:340px}.cta .wrap{align-items:flex-start;flex-direction:column}}@media(max-width:560px){.wrap{width:min(100% - 36px,1180px)}.hero h1{font-size:43px}.grid3,.values{grid-template-columns:1fr}.page-hero{padding:75px 0}.formbox{padding:24px}.footer-main{flex-direction:column}.footer nav{flex-direction:column}.section{padding:60px 0}}
/* V2.1 — softened surfaces and restrained motion */
:root{--radius-sm:12px;--radius-md:18px;--radius-lg:26px;--shadow-soft:0 8px 28px rgba(16,17,18,.075);--shadow-lift:0 22px 50px rgba(16,17,18,.15)}
.btn,.certs a{border-radius:12px;box-shadow:0 5px 16px rgba(0,0,0,.10);transition:transform .28s ease,box-shadow .28s ease,background-color .28s ease}
.btn:hover,.certs a:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(0,0,0,.16)}
.product,.value,.formbox{border-radius:var(--radius-md);box-shadow:var(--shadow-soft);overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}
.product:hover,.value:hover,.formbox:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift);border-color:rgba(248,153,30,.45)}
.product img{transition:transform .65s cubic-bezier(.2,.8,.2,1)}.product:hover img{transform:scale(1.045)}
.photo{border-radius:var(--radius-lg);box-shadow:var(--shadow-lift)}
.field input,.field textarea{border-radius:10px;transition:border-color .2s,box-shadow .2s}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(248,153,30,.16)}
.contact-detail{padding-left:16px;padding-right:16px;transition:none}.contact-detail:hover{background:transparent;transform:none;box-shadow:none;border-color:var(--line)}
.notice{border-radius:12px}.footer-logo{border-radius:12px;box-shadow:var(--shadow-soft)}
.hero .wrap{animation:ststHeroIn .85s both cubic-bezier(.2,.8,.2,1)}

@keyframes ststHeroIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:no-preference){.stst-reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}.stst-reveal.is-visible{opacity:1;transform:translateY(0)}.grid3 .stst-reveal:nth-child(2),.values .stst-reveal:nth-child(2){transition-delay:.1s}.grid3 .stst-reveal:nth-child(3),.values .stst-reveal:nth-child(3){transition-delay:.2s}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:560px){.product,.value,.formbox{border-radius:16px}.photo{border-radius:18px}}

/* V2.1.2 — stronger title typography across all four pages */
.hero h1,.page-hero h1{font-weight:500;}
.section h2,.cta h2{font-weight:500;}
.product h3,.value h3,.contactgrid h3{font-weight:700;}
@media(max-width:560px){.hero h1,.page-hero h1,.section h2{letter-spacing:-.035em;}}
.cta {
	padding:40px 0 !important;
}

/* Products & Services Enquire Button */
.product-enquire-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 5px 15px;
    background: #f8991e;
    border: 1px solid #f8991e;
    border-radius: 10px;

    color: #111111 !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;

    transition: all 0.3s ease;
}

.product-enquire-btn:hover {
    background: #111111;
    border-color: #111111;
    color: #ffffff !important;
    transform: translateY(-2px);
}

.product-enquire-btn:focus-visible {
    outline: 3px solid #111111;
    outline-offset: 3px;
}
/* Make product cards equal height */
.product {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Make card content stretch */
.product .content {
    display: flex;
    flex-direction: column;
    flex: 1;
}
a.brand {
    width: 80px;
}

/* Push Enquire button to the bottom */
.product .content > p:last-child {
    margin-top: auto !important;
    padding-top: 20px;
}
/* ==========================================
   STST CORE VALUES - CLEAN MODERN DESIGN
========================================== */

.values {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-top: 32px !important;
}

/* Card */
.values .value {
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    column-gap: 18px;
    row-gap: 10px;
    align-items: start;

    min-height: 0 !important;
    height: 100%;
    padding: 28px !important;

    background: #ffffff;
    border: 1px solid #e8e8e8;
    border-radius: 18px;

    box-shadow: 0 8px 24px rgba(0,0,0,0.035);
    transition: border-color .3s ease, box-shadow .3s ease;
}

/* Remove orange top line */
.values .value::before {
    display: none !important;
}

/* Icon */
.values .value-icon {
    grid-column: 1;
    grid-row: 1 / 3;

    width: 56px;
    height: 56px;
    margin: 0 !important;

    display: flex;
    align-items: center;
    justify-content: center;
}

.values .value-icon svg {
    width: 28px;
    height: 28px;
    stroke: #f8991e;
    stroke-width: 1.8;
}

/* Title */
.values .value h3 {
    grid-column: 2;
    grid-row: 1;

    font-size: 18px;
    font-weight: 600 !important;
    line-height: 1.4;
    margin: 0 !important;
}

/* Description */
.values .value p {
    grid-column: 2;
    grid-row: 2;

    font-size: 14px;
    line-height: 1.7;
    color: #6b7280;
    margin: 0 !important;
}

/* Hover */
.values .value:hover {
    transform: none !important;
    border-color: #f8991e;
    box-shadow: 0 12px 30px rgba(0,0,0,0.06);
}

/* Tablet */
@media (max-width: 1000px) {
    .values {
        grid-template-columns: 1fr;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .values .value {
        padding: 22px !important;
        column-gap: 14px;
    }
}
/* ==========================================
   PHOTONICS ALIGNMENT - IMAGE HOVER FIX
========================================== */

.photonics-image-switch {
    position: relative !important;
    width: 100%;
    height: 220px;
    overflow: hidden;
}

/* Both images occupy exactly the same space */
.product .photonics-image-switch img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
}

/* First image visible by default */
.product .photonics-image-primary {
    opacity: 1;
    z-index: 1;
}

/* Second image hidden by default */
.product .photonics-image-secondary {
    opacity: 0;
    z-index: 2;
    transition: opacity 0.4s ease;
}

/* Desktop: show second image on hover */
@media (hover: hover) and (pointer: fine) {
    .product:hover .photonics-image-secondary {
        opacity: 1;
    }
}

/* Mobile: automatically alternate images */
@media (hover: none) {
    .product .photonics-image-secondary {
        animation: photonics-switch 10s infinite;
    }

    @keyframes photonics-switch {
        0%, 45% {
            opacity: 0;
        }

        50%, 95% {
            opacity: 1;
        }

        100% {
            opacity: 0;
        }
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .product .photonics-image-secondary {
        animation: none;
        transition: none;
    }
}

/* ==========================================
   STST CONTACT OFFICES - MINIMAL DESIGN
========================================== */

/* Office list */
.stst-contact-offices {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 28px;
}

/* Remove card appearance */
.stst-contact-office {
    position: relative;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    padding: 26px 0 !important;
    transition: none !important;
}

/* Remove the previous orange line */
.stst-contact-office::before {
    content: none !important;
    display: none !important;
}

/* Separate office sections with a subtle divider */
.stst-contact-office:not(:last-child) {
    border-bottom: 1px solid #e5e7eb !important;
}

.stst-contact-office:first-child {
    padding-top: 0 !important;
}

/* Office label */
.stst-contact-office .eyebrow {
    display: block;
    color: #d47a00;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.4px;
    margin-bottom: 12px;
}

/* Company title with orange line */
.stst-contact-office h3 {
    position: relative;
    padding-left: 16px;
    margin: 0 0 16px !important;

    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;
    color: #111;
}

/* Orange line attached to company title */
.stst-contact-office h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;

    width: 3px;
    height: calc(100% - 6px);

    background: #f8991e;
    border-radius: 3px;
}

/* Contact details */
.stst-contact-office p {
    margin: 0 0 9px;
    font-size: 14px;
    line-height: 1.7;
    color: #555;
}

/* Links */
.stst-contact-office a {
    color: #333;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.stst-contact-office a:hover {
    color: #e88700;
}

/* Chinese company name */
.stst-contact-office .stst-company-cn {
    margin-top: -8px;
    color: #777;
}

/* Chinese address */
.stst-contact-office .stst-address-cn {
    color: #777;
    font-size: 13px;
}

/* Business hours */
.stst-contact-office .stst-business-hours {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #eee;
    font-size: 13px;
    color: #777;
}

/* Disable old hover styling */
.stst-contact-office:hover {
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Mobile */
@media (max-width: 768px) {
    .stst-contact-office {
        padding: 22px 0 !important;
    }

    .stst-contact-office h3 {
        font-size: 16px;
        padding-left: 14px;
    }
}
/* Always show divider between office locations */
.stst-contact-office:not(:last-child) {
    border-bottom: 1px solid #e5e7eb !important;
}

/* Remove hover-dependent border changes */
.stst-contact-office:hover {
    border-color: #e5e7eb !important;
    box-shadow: none !important;
}

/* Keep the orange line beside company titles */
.stst-contact-office h3::before {
    background: #f8991e !important;
}

/* =====================================
   FIX HEADER LOGO + COMPANY NAME
===================================== */

/* Keep logo and company name side by side */
.header .navrow .stst-brand-group {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 16px !important;
    width: auto !important;
    min-width: 0;
    flex-shrink: 1;
}

/* Logo container */
.header .stst-brand-group .brand {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: auto !important;
    height: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
}

/* Logo image */
.header .stst-brand-group .brand img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 110px !important;
    max-height: 75px !important;
    object-fit: contain;
}

/* Company name beside logo */
.header .stst-brand-group .stst-header-company {
    display: block !important;
    position: static !important;
    width: auto !important;
    max-width: 350px;
    padding-left: 16px !important;
    border-left: 2px solid #f8991e !important;

    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    color: #111 !important;
    white-space: normal !important;
    margin: 0 !important;
}

/* Keep navigation aligned */
.header .navrow {
    display: flex !important;
    align-items: center !important;
}

.header .menu {
    margin-left: auto;
}

/* Tablet */
@media (max-width: 1200px) {
    .header .stst-brand-group .stst-header-company {
        max-width: 175px;
        font-size: 12px !important;
        padding-left: 12px !important;
    }

    .header .stst-brand-group .brand img {
        max-width: 90px !important;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .header .navrow .stst-brand-group {
        gap: 10px !important;
    }

    .header .stst-brand-group .brand img {
        max-width: 70px !important;
        max-height: 50px !important;
    }

    .header .stst-brand-group .stst-header-company {
        max-width: 145px;
        font-size: 11px !important;
        padding-left: 10px !important;
    }

    .header .navtoggle {
        margin-left: auto;
        flex-shrink: 0;
    }
}

/* Small mobile */
@media (max-width: 375px) {
    .header .stst-brand-group .brand img {
        max-width: 60px !important;
    }

    .header .stst-brand-group .stst-header-company {
        max-width: 120px;
        font-size: 10px !important;
    }
}


/* =====================================
   ABOUT US - CERTIFICATE SLIDER
===================================== */

.stst-cert-slider {
    width: 100%;
    max-width: 750px;
    margin: 35px auto 0;
    overflow: hidden;
}

.stst-cert-track {
    display: flex;
    transition: transform 0.5s ease;
}

.stst-cert-slide {
    flex: 0 0 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 10px;
    text-align: center;
}

.stst-cert-slide > a {
    display: block;
    max-width: 520px;
    margin: 0 auto;
    padding: 25px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 16px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    text-decoration: none;
    color: #111;
}

.stst-cert-image {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 420px;
    background: #fafafa;
    border-radius: 10px;
    overflow: hidden;
}

.stst-cert-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.stst-cert-slide h3 {
    margin: 18px 0 5px;
    font-size: 20px;
    font-weight: 700;
}

.stst-cert-slide p {
    margin: 0;
    font-size: 14px;
    color: #666;
}

/* Navigation */
.stst-cert-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.stst-cert-prev,
.stst-cert-next {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid #ddd;
    border-radius: 50%;
    background: #fff;
    color: #111;
    font-size: 20px;
    cursor: pointer;
    transition: 0.3s ease;
}

.stst-cert-prev:hover,
.stst-cert-next:hover {
    background: #f8991e;
    border-color: #f8991e;
}

.stst-cert-dots {
    display: flex;
    gap: 10px;
}

.stst-cert-dots button {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ccc;
    cursor: pointer;
}

.stst-cert-dots button.active {
    background: #f8991e;
}

/* Mobile */
@media (max-width: 768px) {
    .stst-cert-slider {
        margin-top: 25px;
    }

    .stst-cert-slide > a {
        padding: 15px;
    }

    .stst-cert-image {
        height: 320px;
    }
}

@media (max-width: 375px) {
    .stst-cert-image {
        height: 260px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .stst-cert-track {
        transition: none;
    }
}

/* ==========================================
   STST OFFICE LOCATIONS MAP
========================================== */

.stst-location-section {
    padding: 10px 0 90px;
    background: #ffffff;
}

.stst-location-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 36px;
}

.stst-location-header .eyebrow {
    color: #f8991e;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-bottom: 12px;
}

.stst-location-header h2 {
    font-size: clamp(28px, 3vw, 38px);
    font-weight: 700;
    color: #111;
    margin-bottom: 12px;
}

.stst-location-header > p:last-child {
    color: #666;
    font-size: 15px;
    line-height: 1.7;
}

.stst-location-map {
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    background: #031333;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08);
}

.stst-location-map img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Tablet */
@media (max-width: 1024px) {
    .stst-location-section {
        padding: 55px 0 70px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .stst-location-section {
        padding: 45px 0 60px;
    }

    .stst-location-header {
        margin-bottom: 25px;
    }

    .stst-location-header h2 {
        font-size: 26px;
    }

    .stst-location-map {
        border-radius: 10px;
    }
}

/* Version 2.1.3: distinct text-free banners with editable PHP headings */
.hero{background-image:linear-gradient(90deg,rgba(8,11,15,.90) 0%,rgba(8,11,15,.72) 35%,rgba(8,11,15,.12) 100%),url('assets/images/banner-home.jpg');background-position:center center;background-size:cover;}
.page-hero{min-height:390px;display:flex;align-items:center;background-size:cover;background-position:center center;padding:88px 0;isolation:isolate;}
.page-hero .wrap{position:relative;z-index:2;}
.page-hero::after{pointer-events:none;}
.page-hero--about-us{background-image:linear-gradient(90deg,rgba(8,11,15,.91) 0%,rgba(8,11,15,.68) 38%,rgba(8,11,15,.1) 100%),url('assets/images/banner-about-us.jpg');}
.page-hero--products-and-services{background-image:linear-gradient(90deg,rgba(8,11,15,.91) 0%,rgba(8,11,15,.68) 38%,rgba(8,11,15,.1) 100%),url('assets/images/banner-products-and-services.jpg');}
.page-hero--contact-us{background-image:linear-gradient(90deg,rgba(8,11,15,.91) 0%,rgba(8,11,15,.68) 38%,rgba(8,11,15,.1) 100%),url('assets/images/banner-contact-us.jpg');}
.page-hero h1{font-weight:700;color:#fff;text-shadow:0 3px 16px rgba(0,0,0,.22);}
.page-hero p:not(.eyebrow){color:#f0f1f2;max-width:650px;text-shadow:0 2px 10px rgba(0,0,0,.25);}
@media(max-width:700px){.hero{background-position:61% center}.page-hero{min-height:320px;padding:72px 0;background-position:63% center}.page-hero--contact-us{background-position:58% center}}
@media(prefers-reduced-motion:reduce){.page-hero .wrap{animation:none!important}}