/* =========================================================
   SPEEDLINE TREE SERVICE V7
   Reference-layout recreation using Speedline's own branding
   ========================================================= */

:root{
    --navy:#062638;
    --navy-deep:#031c2a;
    --navy-footer:#031f25;
    --blue:#0589d6;
    --blue-2:#0b9ee6;
    --green:#13993c;
    --green-2:#22bd4f;
    --ink:#062337;
    --text:#2c4452;
    --muted:#6d7d87;
    --off:#f4f9fc;
    --white:#fff;
    --line:#d7e7ef;
    --shadow:0 12px 30px rgba(5,38,56,.11);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    color:var(--ink);
    background:#fff;
}
img{max-width:100%}
.sts-container{
    width:min(1440px,calc(100% - 64px));
    margin:0 auto;
}

/* HEADER */
.sts-site-header{
    background:#fff;
    border-top:1px solid #d9e3e8;
    border-bottom:1px solid #d9e3e8;
    position:relative;
    z-index:50;
}
.sts-header-inner{
    min-height:108px;
    display:flex;
    align-items:center;
    gap:42px;
}
.sts-brand{
    display:flex;
    align-items:center;
    gap:8px;
    text-decoration:none;
    flex:0 0 auto;
}
.sts-brand-icon{
    width:78px;
    height:76px;
    object-fit:contain;
}
.sts-brand-text{
    width:225px;
    height:58px;
    object-fit:contain;
    object-position:left center;
}
.sts-main-nav{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:42px;
}
.sts-main-nav a{
    color:#061f30;
    font-weight:800;
    text-decoration:none;
    padding:42px 0 31px;
    position:relative;
}
.sts-main-nav a:first-child{color:var(--blue)}
.sts-main-nav a:first-child:after{
    content:"";
    position:absolute;
    left:0;right:0;bottom:15px;
    height:3px;
    background:var(--blue);
}
.sts-header-actions{
    display:flex;
    align-items:center;
    gap:12px;
}
.sts-header-phone,
.sts-header-estimate{
    min-height:54px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    padding:0 22px;
    text-decoration:none;
    font-weight:900;
    white-space:nowrap;
}
.sts-header-phone{
    color:var(--blue);
    border:1px solid var(--blue);
    background:#fff;
}
.sts-header-estimate{
    color:#fff;
    border-radius:11px;
    background:var(--green);
    box-shadow:0 8px 18px rgba(19,153,60,.18);
}
.sts-mobile-toggle{
    display:none;
    border:0;
    background:none;
    padding:8px;
}
.sts-mobile-toggle span{
    display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;
}

/* HOME HERO */
.sts-home-hero{
    position:relative;
    min-height:640px;
    overflow:hidden;
    background:var(--navy);
    color:#fff;
}
.sts-hero-photo{
    position:absolute;
    inset:0 0 0 44%;
    background-size:88% auto;
    background-position:right center;
    background-repeat:no-repeat;
}
.sts-hero-photo:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(6,38,56,.82) 0%,rgba(6,38,56,.25) 34%,rgba(6,38,56,.02) 70%);
}
.sts-hero-photo-overlay{
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(90deg,var(--navy-deep) 0%,rgba(3,28,42,.97) 34%,rgba(3,28,42,.76) 49%,rgba(3,28,42,.18) 66%,rgba(3,28,42,.03) 100%);
}
.sts-hero-inner{
    min-height:640px;
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:minmax(0,1fr) 520px;
    gap:45px;
    align-items:center;
}
.sts-hero-copy{
    max-width:720px;
    padding:72px 0 58px;
}
.sts-hero-kicker{
    margin:0 0 14px;
    color:var(--green-2);
    font-size:12px;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.sts-hero-copy h1{
    margin:0;
    font-size:68px;
    line-height:1.04;
    letter-spacing:-.025em;
    font-weight:900;
}
.sts-hero-copy h1 span{color:var(--green-2)}
.sts-hero-description{
    max-width:650px;
    margin:18px 0 0;
    color:rgba(255,255,255,.88);
    line-height:1.6;
    font-size:18px;
}
.sts-hero-actions{
    display:flex;
    gap:14px;
    margin-top:20px;
}
.sts-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:50px;
    padding:0 19px;
    border-radius:999px;
    font-weight:900;
    font-size:15px;
    text-decoration:none;
    transition:.2s ease;
}
.sts-btn:hover{transform:translateY(-2px)}
.sts-btn-green{
    color:#fff;
    background:var(--green);
}
.sts-btn-outline{
    color:#fff;
    border:1px solid rgba(255,255,255,.75);
}
.sts-hero-trust{
    display:flex;
    align-items:center;
    gap:23px;
    margin-top:30px;
}
.sts-hero-trust>div{
    min-height:34px;
    display:flex;
    align-items:center;
    gap:10px;
    padding-right:23px;
    border-right:1px solid rgba(255,255,255,.18);
    font-size:12px;
    white-space:nowrap;
}
.sts-hero-trust>div:last-child{border-right:0;padding-right:0}
.sts-trust-icon{
    width:28px;height:28px;display:grid;place-items:center;
    font-size:28px;line-height:1;
}
.sts-trust-green{color:var(--green-2)}
.sts-trust-blue{color:var(--blue-2)}

.sts-hero-logo-card{
    width:350px;
    height:235px;
    position:relative;
    justify-self:center;
    align-self:end;
    margin-bottom:-10px;
}
.sts-card-back{
    position:absolute;
    width:325px;
    height:215px;
    border-radius:17px;
}
.sts-card-back-blue{
    right:-18px;
    top:-20px;
    background:#1c99da;
    transform:rotate(-4deg);
}
.sts-card-back-green{
    left:-17px;
    top:18px;
    background:#35a348;
    transform:rotate(4deg);
}
.sts-card-front{
    position:absolute;
    inset:0;
    z-index:3;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    background:#fff;
    border-radius:17px;
    box-shadow:0 15px 35px rgba(0,0,0,.19);
    transform:rotate(2deg);
}
.sts-card-icon{
    width:135px;
    height:118px;
    object-fit:contain;
}
.sts-card-text{
    width:235px;
    height:58px;
    object-fit:contain;
}

/* SERVICES STRIP */
.sts-services-strip{
    padding:54px 0 64px;
    background:#f8fbfd;
    border-bottom:1px solid #e0edf3;
}
.sts-services-heading{
    text-align:center;
    margin-bottom:20px;
}
.sts-services-heading p{
    margin:0 0 7px;
    color:var(--blue);
    font-size:11px;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.sts-services-heading h2{
    margin:0;
    color:var(--ink);
    font-size:42px;
}
.sts-services-row{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:24px;
}
.sts-service-mini-card{
    min-height:235px;
    padding:28px 26px 26px;
    border:1px solid #edf2f5;
    border-radius:9px;
    background:#fff;
    box-shadow:var(--shadow);
}
.sts-mini-icon{
    width:56px;height:56px;
    display:grid;place-items:center;
    float:left;
    margin:0 12px 7px 0;
    border-radius:50%;
    color:#fff;
    font-size:23px;
    font-weight:900;
}
.sts-mini-green{background:var(--green)}
.sts-mini-blue{background:var(--blue)}
.sts-service-mini-card h3{
    min-height:50px;
    margin:7px 0 3px;
    display:flex;
    align-items:center;
    color:var(--ink);
    font-size:20px;
}
.sts-service-mini-card p{
    clear:both;
    min-height:52px;
    margin:6px 0 7px;
    color:#41545e;
    font-size:15px;
    line-height:1.35;
}
.sts-service-mini-card a{
    color:var(--blue);
    font-size:15px;
    font-weight:900;
    text-decoration:none;
}

/* FOOTER */
.sts-site-footer{
    color:#fff;
    background:
        radial-gradient(circle at 72% 62%,rgba(19,153,60,.14),transparent 31%),
        var(--navy-footer);
    border-bottom:3px solid var(--blue);
}
.sts-footer-grid{
    display:grid;
    grid-template-columns:1.35fr .85fr .85fr 1fr 1.1fr;
    gap:36px;
    padding:52px 0 44px;
}
.sts-footer-grid>div+div{
    border-left:1px solid rgba(255,255,255,.10);
    padding-left:24px;
}
.sts-footer-logo{
    display:flex;
    align-items:center;
    gap:5px;
    margin-bottom:7px;
}
.sts-footer-icon{width:55px;height:50px;object-fit:contain}
.sts-footer-text{width:125px;height:39px;object-fit:contain}
.sts-footer-brand>p,
.sts-footer-column p{
    margin:8px 0;
    color:rgba(255,255,255,.73);
    font-size:12px;
    line-height:1.45;
}
.sts-footer-column{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.sts-footer-column h3{
    margin:4px 0 7px;
    font-size:11px;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.sts-footer-column h3.green{color:var(--green-2)}
.sts-footer-column h3.blue{color:var(--blue-2)}
.sts-footer-column a{
    color:rgba(255,255,255,.88);
    font-size:12px;
    text-decoration:none;
}
.sts-social-row{
    display:flex;
    gap:10px;
    margin-top:12px;
}
.sts-social-row span{
    width:24px;height:24px;
    display:grid;place-items:center;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    color:var(--blue-2);
    font-size:12px;
}
.sts-footer-bottom{
    min-height:37px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    color:rgba(255,255,255,.60);
    font-size:11px;
    border-top:1px solid rgba(255,255,255,.08);
}
.sts-footer-bottom>div{display:flex;gap:9px}
.sts-footer-bottom a{color:rgba(255,255,255,.73);text-decoration:none}

/* SUBPAGES */
.sts-page-hero{
    padding:75px 0;
    color:#fff;
    background:var(--navy);
    border-bottom:5px solid var(--blue);
}
.sts-page-kicker{
    color:var(--green-2);
    text-transform:uppercase;
    letter-spacing:.16em;
    font-weight:900;
    font-size:12px;
}
.sts-page-hero h1{
    max-width:850px;
    margin:8px 0 15px;
    font-size:52px;
    line-height:1.02;
}
.sts-page-hero>div>p:last-child{
    max-width:700px;
    color:rgba(255,255,255,.8);
}
.sts-content-section{padding:70px 0;background:#f6fafc}
.sts-full-service-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
}
.sts-full-service-card,
.sts-contact-panel{
    padding:30px;
    background:#fff;
    border-radius:16px;
    box-shadow:var(--shadow);
}
.sts-full-service-card h2{margin-top:0}
.sts-about-layout{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:55px;
    align-items:center;
}
.sts-about-image img{
    width:100%;height:520px;object-fit:cover;border-radius:20px;box-shadow:var(--shadow)
}
.sts-about-layout h2{font-size:42px}
.sts-about-layout p{color:var(--text);line-height:1.7}
.sts-contact-layout{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:24px;
}
.sts-contact-panel a{color:var(--blue)}

/* RESPONSIVE */
@media(max-width:1050px){
    .sts-header-phone{display:none}
    .sts-brand-text{width:145px}
    .sts-hero-inner{grid-template-columns:1fr 330px}
    .sts-footer-grid{grid-template-columns:1.3fr 1fr 1fr}
    .sts-footer-grid>div:nth-child(4),
    .sts-footer-grid>div:nth-child(5){border-left:0;padding-left:0}
}
@media(max-width:820px){
    .sts-header-inner{min-height:72px}
    .sts-brand-icon{width:48px;height:48px}
    .sts-brand-text{width:125px;height:38px}
    .sts-header-estimate{display:none}
    .sts-mobile-toggle{display:block}
    .sts-main-nav{
        display:none;
        position:absolute;
        left:0;right:0;top:72px;
        padding:15px 22px;
        flex-direction:column;
        align-items:stretch;
        gap:0;
        background:#fff;
        border-bottom:1px solid #dce8ed;
    }
    .sts-main-nav.is-open{display:flex}
    .sts-main-nav a{padding:13px 0}
    .sts-main-nav a:first-child:after{display:none}
    .sts-hero-photo{inset:0;background-position:60% center}
    .sts-hero-photo-overlay{
        background:linear-gradient(90deg,rgba(3,28,42,.97),rgba(3,28,42,.88) 55%,rgba(3,28,42,.55))
    }
    .sts-hero-inner{grid-template-columns:1fr}
    .sts-hero-logo-card{display:none}
    .sts-hero-copy{max-width:620px}
    .sts-services-row{grid-template-columns:repeat(2,minmax(0,1fr))}
    .sts-full-service-grid,
    .sts-about-layout,
    .sts-contact-layout{grid-template-columns:1fr}
}
@media(max-width:560px){
    .sts-container{width:calc(100% - 28px)}
    .sts-brand-text{width:110px}
    .sts-home-hero{min-height:520px}
    .sts-hero-inner{min-height:520px}
    .sts-hero-copy h1{font-size:42px}
    .sts-hero-actions{flex-direction:column;align-items:stretch}
    .sts-btn{width:100%}
    .sts-hero-trust{flex-direction:column;align-items:flex-start;gap:12px}
    .sts-hero-trust>div{border-right:0;padding-right:0}
    .sts-services-row{grid-template-columns:1fr}
    .sts-footer-grid{grid-template-columns:1fr}
    .sts-footer-grid>div+div{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.08);padding-top:16px}
    .sts-footer-bottom{padding:14px 0;flex-direction:column;align-items:flex-start}
}


/* =========================================================
   V8 LARGE-SCREEN / 1440P EXPANSION
   ========================================================= */

.sts-topbar{
    background:#041923;
    color:rgba(255,255,255,.72);
    font-size:12px;
    letter-spacing:.03em;
}
.sts-topbar .sts-container{
    min-height:34px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.sts-topbar span{
    color:#56c86b;
    font-weight:800;
}

.sts-site-header{
    position:sticky;
    top:0;
}

.sts-main-nav a{
    font-size:17px;
}

.sts-header-phone,
.sts-header-estimate{
    font-size:15px;
}

.sts-hero-copy h1{
    font-size:clamp(58px,4.2vw,76px);
}

.sts-hero-kicker,
.sts-section-kicker,
.sts-page-kicker{
    font-size:13px;
    letter-spacing:.18em;
    font-weight:900;
    text-transform:uppercase;
}

.sts-hero-description{
    font-size:18px;
    line-height:1.7;
}

.sts-hero-photo{
    background-color:#193745;
    background-size:auto 90%;
    background-position:right center;
}

.sts-hero-photo:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(6,38,56,.08),rgba(6,38,56,.16));
}

.sts-hero-logo-card{
    margin-bottom:36px;
}

.sts-services-heading{
    margin-bottom:36px;
}

.sts-services-heading p,
.sts-section-kicker{
    color:var(--blue);
}

.sts-service-mini-card{
    display:block;
}

.sts-service-mini-card h3{
    min-height:auto;
    margin:12px 0 12px;
}

.sts-service-mini-card p{
    min-height:76px;
    font-size:15px;
}

.sts-service-mini-card a{
    font-size:15px;
}

.sts-home-intro{
    padding:88px 0;
    background:#fff;
}

.sts-home-intro-grid{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:80px;
    align-items:start;
}

.sts-home-intro h2,
.sts-section-title-row h2,
.sts-home-feature h2,
.sts-service-cta h2,
.sts-home-cta-large h2{
    margin:8px 0 0;
    color:var(--ink);
    font-size:clamp(42px,3.4vw,60px);
    line-height:1.02;
    letter-spacing:-.035em;
}

.sts-home-intro-copy p{
    margin:0 0 18px;
    color:var(--text);
    font-size:18px;
    line-height:1.8;
}

.sts-home-process{
    padding:100px 0;
    background:#edf6fa;
}

.sts-section-title-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(300px,.55fr);
    gap:70px;
    align-items:end;
    margin-bottom:42px;
}

.sts-section-title-row>p{
    margin:0;
    color:var(--text);
    font-size:18px;
    line-height:1.7;
}

.sts-process-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
}

.sts-process-grid article{
    min-height:270px;
    padding:30px;
    border-radius:18px;
    background:#fff;
    box-shadow:var(--shadow);
    border-top:5px solid var(--green);
}

.sts-process-grid article:nth-child(even){
    border-top-color:var(--blue);
}

.sts-process-grid article>span{
    display:block;
    margin-bottom:58px;
    color:var(--blue);
    font-weight:900;
    letter-spacing:.12em;
}

.sts-process-grid article h3{
    margin:0 0 12px;
    color:var(--ink);
    font-size:24px;
}

.sts-process-grid article p{
    margin:0;
    color:var(--text);
    font-size:15px;
    line-height:1.65;
}

.sts-home-feature{
    padding:100px 0;
    background:#fff;
}

.sts-home-feature-grid{
    display:grid;
    grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);
    gap:70px;
    align-items:center;
}

.sts-feature-copy>p:not(.sts-section-kicker){
    max-width:760px;
    color:var(--text);
    font-size:18px;
    line-height:1.8;
}

.sts-feature-checks{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin:30px 0 32px;
}

.sts-feature-checks span{
    padding:15px 18px;
    border-radius:12px;
    background:#f2f8fb;
    border:1px solid #dbeaf1;
    color:var(--ink);
    font-weight:800;
}

.sts-feature-stat-card{
    padding:38px;
    border-radius:24px;
    color:#fff;
    background:#062638;
    box-shadow:0 20px 45px rgba(3,28,42,.18);
    border-left:7px solid var(--green);
}

.sts-feature-stat-card strong,
.sts-feature-stat-card span{
    display:block;
}

.sts-feature-stat-card strong{
    color:#fff;
    font-size:34px;
}

.sts-feature-stat-card span{
    margin-top:4px;
    color:rgba(255,255,255,.68);
}

.sts-feature-stat-card hr{
    margin:24px 0;
    border:0;
    border-top:1px solid rgba(255,255,255,.12);
}

.sts-home-cta-large,
.sts-service-cta{
    padding:78px 0;
    color:#fff;
    background:#087ebd;
}

.sts-home-cta-large .sts-section-kicker,
.sts-service-cta .sts-section-kicker{
    color:#a9efbc;
}

.sts-home-cta-large h2,
.sts-service-cta h2{
    color:#fff;
    max-width:900px;
}

.sts-home-cta-large-inner,
.sts-service-cta-grid{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:50px;
}

.sts-home-cta-large-actions{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
}

.sts-btn-white{
    color:var(--ink);
    background:#fff;
}

.sts-btn-blue{
    color:#fff;
    background:var(--blue);
}

.sts-page-hero{
    padding:110px 0 95px;
}

.sts-page-hero h1{
    max-width:1050px;
    font-size:clamp(58px,5vw,82px);
}

.sts-page-hero>div>p:last-child{
    max-width:850px;
    font-size:19px;
    line-height:1.75;
}

.sts-content-section{
    padding:100px 0;
}

.sts-page-intro-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px,.65fr);
    gap:70px;
    align-items:end;
    margin-bottom:50px;
}

.sts-page-intro-grid h2{
    margin:8px 0 0;
    font-size:clamp(42px,3vw,58px);
    line-height:1.05;
}

.sts-page-intro-grid>p{
    margin:0;
    color:var(--text);
    font-size:18px;
    line-height:1.75;
}

.sts-full-service-grid-large{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px;
}

.sts-full-service-card{
    overflow:hidden;
    padding:0;
    min-height:460px;
}

.sts-full-service-card>div{
    padding:36px;
}

.sts-service-with-image img{
    width:100%;
    height:360px;
    object-fit:cover;
    object-position:center 35%;
}

.sts-full-service-card h2{
    font-size:38px;
    line-height:1.05;
}

.sts-full-service-card p{
    color:var(--text);
    font-size:17px;
    line-height:1.7;
}

.sts-full-service-card ul{
    margin:24px 0 30px;
    padding-left:20px;
    color:var(--text);
    line-height:1.8;
}

.sts-service-number{
    display:block;
    margin-bottom:18px;
    color:var(--blue);
    font-size:13px;
    font-weight:900;
    letter-spacing:.14em;
}

.sts-service-accent-green{
    border-top:7px solid var(--green);
}

.sts-service-accent-blue{
    border-top:7px solid var(--blue);
}

.sts-about-image-stack{
    position:relative;
    min-height:650px;
}

.sts-about-main-img{
    width:84%;
    height:590px;
    object-fit:cover;
    object-position:center 35%;
    border-radius:22px;
    box-shadow:var(--shadow);
}

.sts-about-small-img{
    position:absolute;
    right:0;
    bottom:0;
    width:46%;
    height:300px;
    object-fit:cover;
    border:9px solid #fff;
    border-radius:20px;
    box-shadow:var(--shadow);
}

.sts-about-copy h2{
    margin:8px 0 20px;
    font-size:clamp(44px,3.2vw,62px);
    line-height:1.04;
}

.sts-about-copy p{
    color:var(--text);
    font-size:18px;
    line-height:1.8;
}

.sts-about-values{
    padding:100px 0;
    color:#fff;
    background:#062638;
}

.sts-section-title-row-light h2,
.sts-section-title-row-light>p{
    color:#fff;
}

.sts-about-values .sts-process-grid article{
    background:#0a3145;
    box-shadow:none;
}

.sts-about-values .sts-process-grid article h3{
    color:#fff;
}

.sts-about-values .sts-process-grid article p{
    color:rgba(255,255,255,.72);
}

.sts-contact-cards{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px;
    margin-bottom:34px;
}

.sts-contact-method{
    min-height:180px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:34px;
    border-radius:20px;
    color:#fff;
    text-decoration:none;
    box-shadow:var(--shadow);
}

.sts-contact-method-green{background:#178f3a}
.sts-contact-method-blue{background:#087ebd}

.sts-contact-method span{
    margin-bottom:14px;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.15em;
    opacity:.74;
}

.sts-contact-method strong{
    font-size:30px;
}

.sts-contact-method small{
    margin-top:10px;
    font-size:14px;
    opacity:.76;
}

.sts-contact-layout-large{
    grid-template-columns:minmax(0,1.3fr) minmax(340px,.7fr);
}

.sts-contact-panel{
    padding:40px;
}

.sts-contact-panel h2{
    margin:8px 0 12px;
    font-size:46px;
}

.sts-contact-panel h3{
    font-size:28px;
}

.sts-contact-panel ul{
    padding-left:22px;
    color:var(--text);
    line-height:1.9;
}

.sts-contact-sidebar{
    display:flex;
    flex-direction:column;
    gap:24px;
}

.sts-contact-hours{
    padding:34px;
    border-radius:20px;
    color:#fff;
    background:#062638;
    border-left:6px solid var(--green);
}

.sts-contact-hours strong,
.sts-contact-hours span,
.sts-contact-hours small{
    display:block;
}

.sts-contact-hours strong{
    margin-top:16px;
    color:#55d170;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.14em;
}

.sts-contact-hours strong:first-child{
    margin-top:0;
}

.sts-contact-hours span{
    margin-top:5px;
    font-size:18px;
}

.sts-contact-hours small{
    margin-top:12px;
    color:rgba(255,255,255,.58);
}

.sts-footer-brand>p,
.sts-footer-column p,
.sts-footer-column a{
    font-size:14px;
}

.sts-footer-column h3{
    font-size:13px;
}

.sts-footer-bottom{
    min-height:54px;
    font-size:12px;
}

/* LARGE MONITORS */
@media(min-width:1600px){
    .sts-container{
        width:min(1500px,calc(100% - 100px));
    }

    .sts-home-hero,
    .sts-hero-inner{
        min-height:690px;
    }

    .sts-hero-copy h1{
        font-size:78px;
    }

    .sts-hero-photo{
        background-size:auto 92%;
    }

    .sts-services-strip{
        padding-top:64px;
        padding-bottom:74px;
    }

    .sts-service-mini-card{
        min-height:250px;
    }
}

/* TABLET */
@media(max-width:1050px){
    .sts-topbar{display:none}

    .sts-home-intro-grid,
    .sts-page-intro-grid,
    .sts-home-feature-grid{
        grid-template-columns:1fr;
        gap:36px;
    }

    .sts-process-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .sts-hero-photo{
        background-size:cover;
    }
}

@media(max-width:820px){
    .sts-site-header{
        top:0;
    }

    .sts-main-nav{
        top:88px;
    }

    .sts-header-inner{
        min-height:88px;
    }

    .sts-brand-icon{
        width:58px;
        height:58px;
    }

    .sts-brand-text{
        width:150px;
        height:44px;
    }

    .sts-home-hero,
    .sts-hero-inner{
        min-height:610px;
    }

    .sts-hero-copy{
        padding:70px 0;
    }

    .sts-hero-copy h1{
        font-size:54px;
    }

    .sts-service-mini-card{
        min-height:220px;
    }

    .sts-full-service-grid-large,
    .sts-contact-cards{
        grid-template-columns:1fr;
    }

    .sts-section-title-row,
    .sts-home-cta-large-inner,
    .sts-service-cta-grid{
        display:block;
    }

    .sts-section-title-row>p{
        margin-top:18px;
    }

    .sts-home-cta-large-actions,
    .sts-service-cta .sts-btn{
        margin-top:26px;
    }
}

@media(max-width:560px){
    .sts-container{
        width:calc(100% - 28px);
    }

    .sts-brand-text{
        width:125px;
    }

    .sts-hero-copy h1{
        font-size:45px;
    }

    .sts-hero-description{
        font-size:16px;
    }

    .sts-process-grid,
    .sts-feature-checks{
        grid-template-columns:1fr;
    }

    .sts-home-intro,
    .sts-home-process,
    .sts-home-feature,
    .sts-about-values,
    .sts-content-section{
        padding:70px 0;
    }

    .sts-service-with-image img{
        height:290px;
    }

    .sts-contact-method strong{
        font-size:23px;
    }
}



/* =========================================================
   V9 HEADER + HOMEPAGE REFINEMENT
   ========================================================= */

/* Remove the V8 announcement strip completely */
.sts-topbar{
    display:none !important;
}

/* HEADER */
.sts-site-header{
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(255,255,255,.98);
    border-top:0;
    border-bottom:1px solid #dce8ee;
    box-shadow:0 8px 30px rgba(3,28,42,.06);
    backdrop-filter:blur(12px);
}

.sts-header-inner{
    min-height:124px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:54px;
}

.sts-brand{
    display:flex;
    align-items:center;
    gap:14px;
}

.sts-brand-icon{
    width:86px;
    height:82px;
}

.sts-brand-text{
    width:255px;
    height:66px;
}

.sts-main-nav{
    margin:0;
    justify-self:center;
    display:flex;
    align-items:stretch;
    justify-content:center;
    gap:18px;
    height:100%;
}

.sts-main-nav a{
    min-height:124px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 18px;
    color:#062337 !important;
    font-size:18px;
    line-height:1;
    font-weight:900;
    position:relative;
}

.sts-main-nav a:first-child:after{
    display:none;
}

.sts-main-nav a.is-active{
    color:var(--blue) !important;
}

.sts-main-nav a.is-active:after{
    content:"";
    position:absolute;
    left:18px;
    right:18px;
    bottom:25px;
    height:4px;
    border-radius:999px;
    background:var(--blue);
}

.sts-main-nav a:hover{
    color:var(--blue) !important;
}

.sts-header-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:14px;
}

.sts-header-phone,
.sts-header-estimate{
    min-height:58px;
    padding:0 23px;
    gap:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:1;
    font-size:16px;
}

.sts-header-phone{
    border:2px solid var(--blue);
}

.sts-header-estimate{
    min-width:170px;
    border-radius:14px;
}

.sts-inline-icon{
    width:20px;
    height:20px;
    flex:0 0 auto;
    fill:currentColor;
}

.sts-arrow-icon{
    fill:none;
    stroke:currentColor;
    stroke-width:2.25;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.sts-header-estimate .sts-arrow-icon{
    width:18px;
    opacity:.9;
}

/* HERO */
.sts-home-hero{
    min-height:680px;
    background:
        radial-gradient(circle at 58% 52%,rgba(5,137,214,.17),transparent 30%),
        linear-gradient(120deg,#031c2a 0%,#062638 49%,#0a3a4b 100%);
}

.sts-hero-inner{
    min-height:680px;
    grid-template-columns:minmax(0,1fr) 480px;
    gap:70px;
}

/*
 * The photo lives on the right, but the left side is masked/faded into
 * the navy background so there is no hard vertical rectangle.
 */
.sts-hero-photo{
    inset:0 0 0 46%;
    background-color:transparent;
    background-size:auto 86%;
    background-position:right center;
    background-repeat:no-repeat;
    -webkit-mask-image:linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.08) 8%,
        rgba(0,0,0,.35) 22%,
        #000 47%,
        #000 100%
    );
    mask-image:linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.08) 8%,
        rgba(0,0,0,.35) 22%,
        #000 47%,
        #000 100%
    );
}

.sts-hero-photo:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,rgba(3,28,42,.62) 0%,rgba(3,28,42,.22) 35%,rgba(3,28,42,.02) 72%),
        linear-gradient(180deg,rgba(3,28,42,.10),rgba(3,28,42,.18));
}

.sts-hero-photo:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(5,137,214,.05),transparent 50%);
}

.sts-hero-photo-overlay{
    background:
        linear-gradient(
            90deg,
            #031c2a 0%,
            rgba(3,28,42,.99) 30%,
            rgba(3,28,42,.92) 42%,
            rgba(3,28,42,.62) 53%,
            rgba(3,28,42,.18) 66%,
            rgba(3,28,42,0) 80%
        );
}

.sts-hero-copy{
    max-width:760px;
    padding:86px 0 74px;
}

.sts-hero-copy h1{
    font-size:clamp(64px,4.4vw,82px);
    line-height:1.02;
}

.sts-hero-description{
    max-width:690px;
    font-size:19px;
    line-height:1.7;
}

.sts-hero-actions{
    margin-top:28px;
    gap:16px;
}

.sts-hero-actions .sts-btn{
    min-height:56px;
    padding:0 24px;
}

.sts-hero-trust{
    margin-top:36px;
}

.sts-hero-trust>div{
    font-size:13px;
}

.sts-trust-icon{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
}

.sts-trust-icon svg{
    width:27px;
    height:27px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.sts-trust-icon:first-child svg{
    fill:none;
}

.sts-hero-logo-card{
    width:360px;
    height:240px;
    align-self:end;
    margin-bottom:42px;
    transform:translateX(-20px);
}

/* HOME CONTENT - slightly larger to match the new header/hero scale */
.sts-home-intro{
    padding:105px 0;
}

.sts-services-strip{
    padding:72px 0 84px;
}

.sts-services-heading h2{
    font-size:48px;
}

.sts-service-mini-card{
    min-height:260px;
    padding:32px 30px 30px;
    border-radius:16px;
}

.sts-mini-icon{
    width:58px;
    height:58px;
}

.sts-mini-icon svg{
    width:27px;
    height:27px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.sts-mini-green svg:first-child{
    fill:currentColor;
    stroke:none;
}

.sts-service-mini-card h3{
    font-size:21px;
}

.sts-service-mini-card p{
    font-size:16px;
    line-height:1.55;
}

.sts-service-mini-card a{
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:16px;
}

/* Bigger spacing on desktop and 1440p */
@media(min-width:1440px){
    .sts-container{
        width:min(1500px,calc(100% - 100px));
    }

    .sts-header-inner{
        min-height:132px;
    }

    .sts-main-nav a{
        min-height:132px;
        font-size:19px;
    }

    .sts-main-nav a.is-active:after{
        bottom:27px;
    }

    .sts-brand-icon{
        width:92px;
        height:88px;
    }

    .sts-brand-text{
        width:275px;
        height:70px;
    }

    .sts-header-phone,
    .sts-header-estimate{
        min-height:62px;
        font-size:17px;
    }

    .sts-home-hero,
    .sts-hero-inner{
        min-height:720px;
    }

    .sts-hero-photo{
        background-size:auto 84%;
    }
}

/* TABLET */
@media(max-width:1120px){
    .sts-header-inner{
        grid-template-columns:auto 1fr auto;
        gap:24px;
    }

    .sts-brand-text{
        width:180px;
    }

    .sts-main-nav{
        gap:4px;
    }

    .sts-main-nav a{
        padding:0 12px;
        font-size:15px;
    }

    .sts-header-estimate{
        min-width:auto;
    }

    .sts-hero-photo{
        inset:0 0 0 40%;
        background-size:auto 82%;
    }
}

@media(max-width:820px){
    .sts-header-inner{
        min-height:90px;
        display:flex;
    }

    .sts-brand-icon{
        width:58px;
        height:58px;
    }

    .sts-brand-text{
        width:150px;
        height:42px;
    }

    .sts-main-nav{
        height:auto;
        top:90px;
        justify-self:auto;
        align-items:stretch;
    }

    .sts-main-nav a{
        min-height:auto;
        padding:15px 0;
        justify-content:flex-start;
    }

    .sts-main-nav a.is-active:after{
        display:none;
    }

    .sts-hero-photo{
        inset:0;
        background-size:cover;
        background-position:65% center;
        -webkit-mask-image:none;
        mask-image:none;
    }

    .sts-hero-photo-overlay{
        background:linear-gradient(90deg,rgba(3,28,42,.98),rgba(3,28,42,.92) 55%,rgba(3,28,42,.52));
    }
}

@media(max-width:560px){
    .sts-brand-text{
        width:120px;
    }

    .sts-home-hero,
    .sts-hero-inner{
        min-height:620px;
    }

    .sts-hero-copy{
        padding:70px 0;
    }

    .sts-hero-copy h1{
        font-size:46px;
    }

    .sts-hero-description{
        font-size:16px;
    }

    .sts-hero-actions .sts-btn{
        min-height:54px;
    }
}



/* =========================================================
   V10 NAV / MOBILE MENU / CONTACT COMING SOON
   ========================================================= */

/*
 * WordPress admin-bar correction.
 * Without this, a sticky header using top:0 slides underneath the
 * WordPress admin bar as soon as it becomes sticky, which looks like
 * the navigation jumps upward while scrolling.
 */
body.admin-bar .sts-site-header{
    top:32px !important;
}

@media screen and (max-width:782px){
    body.admin-bar .sts-site-header{
        top:46px !important;
    }
}

/* Keep the desktop header at one stable height */
.sts-site-header{
    position:sticky;
    top:0;
    width:100%;
    transition:box-shadow .2s ease, background-color .2s ease;
}

.sts-header-inner{
    height:132px;
    min-height:132px;
}

/* Desktop navigation alignment */
.sts-main-nav{
    height:132px;
    align-items:center;
    gap:12px;
}

.sts-main-nav > a{
    height:132px;
    min-height:132px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
    border-radius:12px;
    isolation:isolate;
    transition:
        color .2s ease,
        transform .2s ease;
}

/* Subtle hover pill directly around the nav text */
.sts-main-nav > a:before{
    content:"";
    position:absolute;
    z-index:-1;
    left:6px;
    right:6px;
    top:50%;
    height:46px;
    transform:translateY(-50%) scale(.94);
    border-radius:12px;
    background:linear-gradient(
        135deg,
        rgba(5,137,214,.09),
        rgba(19,153,60,.07)
    );
    opacity:0;
    transition:opacity .2s ease, transform .2s ease;
}

.sts-main-nav > a:hover{
    color:var(--blue) !important;
    transform:translateY(-1px);
}

.sts-main-nav > a:hover:before{
    opacity:1;
    transform:translateY(-50%) scale(1);
}

/*
 * Active line is positioned relative to the vertical centre of the
 * link, not the bottom of the whole 132px header. This keeps the line
 * close to the text.
 */
.sts-main-nav > a.is-active:after{
    content:"";
    position:absolute;
    left:18px;
    right:18px;
    top:calc(50% + 22px);
    bottom:auto;
    height:3px;
    border-radius:999px;
    background:var(--blue);
}

/* Desktop action button hover effects */
.sts-header-phone,
.sts-header-estimate{
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.sts-header-phone:hover{
    color:#fff;
    background:var(--blue);
    border-color:var(--blue);
    transform:translateY(-2px);
    box-shadow:0 10px 24px rgba(5,137,214,.22);
}

.sts-header-estimate:hover{
    color:#fff;
    background:#0d8733;
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(19,153,60,.28);
}

.sts-header-phone .sts-inline-icon,
.sts-header-estimate .sts-inline-icon{
    transition:transform .2s ease;
}

.sts-header-phone:hover .sts-inline-icon{
    transform:rotate(-8deg) scale(1.05);
}

.sts-header-estimate:hover .sts-arrow-icon{
    transform:translateX(4px);
}

/* Mobile-only actions stay hidden on desktop */
.sts-mobile-nav-actions{
    display:none;
}

/* Hamburger animation */
.sts-mobile-toggle{
    width:48px;
    height:48px;
    padding:10px;
    border-radius:12px;
    cursor:pointer;
    transition:background-color .2s ease;
}

.sts-mobile-toggle:hover{
    background:#eef7fb;
}

.sts-mobile-toggle span{
    width:27px;
    height:3px;
    margin:5px auto;
    border-radius:999px;
    transition:transform .2s ease, opacity .2s ease;
}

.sts-mobile-toggle.is-open span:nth-child(1){
    transform:translateY(8px) rotate(45deg);
}

.sts-mobile-toggle.is-open span:nth-child(2){
    opacity:0;
}

.sts-mobile-toggle.is-open span:nth-child(3){
    transform:translateY(-8px) rotate(-45deg);
}

/* CONTACT - COMING SOON PANEL */
.sts-contact-coming-soon{
    position:relative;
    overflow:hidden;
    min-height:480px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:58px !important;
    background:
        radial-gradient(circle at 90% 10%,rgba(5,137,214,.12),transparent 32%),
        radial-gradient(circle at 12% 90%,rgba(19,153,60,.10),transparent 30%),
        #fff;
}

.sts-contact-coming-soon:after{
    content:"";
    position:absolute;
    width:240px;
    height:240px;
    right:-100px;
    bottom:-100px;
    border-radius:50%;
    border:1px solid rgba(5,137,214,.13);
    box-shadow:
        0 0 0 34px rgba(5,137,214,.035),
        0 0 0 70px rgba(19,153,60,.025);
}

.sts-coming-soon-mark{
    margin:18px 0 6px;
}

.sts-coming-soon-mark span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 18px;
    border-radius:999px;
    color:#087ebd;
    background:#eaf6fc;
    border:1px solid #c8e8f8;
    font-size:14px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.sts-contact-coming-soon h2{
    max-width:720px;
    margin:18px 0 18px;
}

.sts-contact-coming-soon > p{
    max-width:720px;
    color:var(--text);
    font-size:18px;
    line-height:1.75;
}

.sts-coming-soon-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:28px;
}

.sts-coming-soon-actions .sts-btn{
    min-height:56px;
    padding:0 24px;
}

/* =========================================================
   MOBILE NAV
   ========================================================= */

@media(max-width:820px){

    .sts-header-inner{
        height:90px;
        min-height:90px;
        display:flex;
        align-items:center;
        gap:14px;
    }

    .sts-brand{
        flex:0 1 auto;
        min-width:0;
    }

    .sts-header-actions{
        margin-left:auto;
        flex:0 0 auto;
    }

    /* Desktop phone and estimate move INSIDE the hamburger menu */
    .sts-header-actions .sts-header-phone,
    .sts-header-actions .sts-header-estimate{
        display:none !important;
    }

    /* Hamburger stays on the far right */
    .sts-mobile-toggle{
        display:block;
        margin-left:auto;
    }

    .sts-main-nav{
        display:none;
        position:absolute;
        left:0;
        right:0;
        top:90px;
        height:auto;
        min-height:0;
        padding:22px 20px 28px;
        flex-direction:column;
        align-items:center;
        justify-content:flex-start;
        gap:4px;
        background:rgba(255,255,255,.99);
        border-top:1px solid #e3edf2;
        border-bottom:1px solid #d7e5ec;
        box-shadow:0 20px 35px rgba(3,28,42,.13);
    }

    .sts-main-nav.is-open{
        display:flex;
    }

    .sts-main-nav > a{
        width:min(100%,420px);
        height:auto;
        min-height:52px;
        padding:0 20px;
        display:flex;
        align-items:center;
        justify-content:center;
        text-align:center;
        font-size:17px;
        border-radius:11px;
    }

    .sts-main-nav > a:before{
        left:0;
        right:0;
        height:48px;
    }

    .sts-main-nav > a.is-active{
        color:var(--blue) !important;
        background:#edf8fd;
    }

    .sts-main-nav > a.is-active:after{
        display:none;
    }

    .sts-mobile-nav-actions{
        width:min(100%,420px);
        display:grid;
        grid-template-columns:1fr;
        gap:12px;
        margin-top:18px;
        padding-top:20px;
        border-top:1px solid #dbe8ee;
    }

    .sts-mobile-nav-actions a{
        width:100%;
        min-height:56px;
        display:flex;
        align-items:center;
        justify-content:center;
        gap:10px;
        padding:0 20px;
        border-radius:14px;
        font-size:16px;
        font-weight:900;
        text-decoration:none;
        text-align:center;
    }

    .sts-mobile-nav-phone{
        color:var(--blue) !important;
        border:2px solid var(--blue);
        background:#fff;
    }

    .sts-mobile-nav-estimate{
        color:#fff !important;
        border:2px solid var(--green);
        background:var(--green);
        box-shadow:0 9px 22px rgba(19,153,60,.18);
    }

    .sts-mobile-nav-actions .sts-inline-icon{
        width:20px;
        height:20px;
    }

    .sts-contact-coming-soon{
        min-height:400px;
        padding:38px 30px !important;
    }
}

@media(max-width:560px){

    .sts-header-inner{
        width:calc(100% - 24px);
    }

    .sts-brand{
        gap:7px;
    }

    .sts-brand-icon{
        width:52px;
        height:52px;
    }

    .sts-brand-text{
        width:118px;
        height:38px;
    }

    .sts-mobile-toggle{
        width:46px;
        height:46px;
    }

    .sts-main-nav{
        padding-left:14px;
        padding-right:14px;
    }

    .sts-contact-coming-soon{
        min-height:360px;
        padding:30px 22px !important;
    }

    .sts-coming-soon-actions{
        flex-direction:column;
    }

    .sts-coming-soon-actions .sts-btn{
        width:100%;
    }
}


/* =========================================================
   V11 CONTACT COLORS + LIFT/HOVER FIXES
   ========================================================= */

/*
 * WordPress/theme link rules can override anchor text colors.
 * Force the contact CTA/button labels and icons to stay readable.
 */
.sts-contact-page .sts-btn-green,
.sts-contact-page .sts-btn-green:visited,
.sts-contact-page .sts-btn-green:hover,
.sts-contact-page .sts-btn-green:focus,
.sts-contact-page .sts-btn-blue,
.sts-contact-page .sts-btn-blue:visited,
.sts-contact-page .sts-btn-blue:hover,
.sts-contact-page .sts-btn-blue:focus{
    color:#fff !important;
}

.sts-contact-page .sts-btn-green *,
.sts-contact-page .sts-btn-blue *{
    color:inherit !important;
}

.sts-contact-page .sts-btn-green .sts-inline-icon,
.sts-contact-page .sts-btn-blue .sts-inline-icon{
    color:#fff !important;
    stroke:currentColor;
    fill:currentColor;
}

/* Arrow SVG is stroke-only */
.sts-contact-page .sts-btn-blue .sts-arrow-icon,
.sts-contact-page .sts-btn-green .sts-arrow-icon{
    fill:none !important;
    stroke:#fff !important;
}

/* Call + Email cards: keep ALL text white */
.sts-contact-method,
.sts-contact-method:visited,
.sts-contact-method:hover,
.sts-contact-method:focus,
.sts-contact-method span,
.sts-contact-method strong,
.sts-contact-method small{
    color:#fff !important;
}

/* Make every important contact card feel interactive */
.sts-contact-method,
.sts-contact-panel,
.sts-contact-hours{
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.sts-contact-method:hover{
    transform:translateY(-8px);
    box-shadow:0 22px 42px rgba(3,28,42,.19);
}

.sts-contact-method-green:hover{
    background:#168a38;
}

.sts-contact-method-blue:hover{
    background:#0877b1;
}

/* Main coming-soon card + sidebar cards */
.sts-contact-panel:hover{
    transform:translateY(-6px);
    box-shadow:0 22px 44px rgba(3,28,42,.12);
}

.sts-contact-hours:hover{
    transform:translateY(-6px);
    box-shadow:0 22px 44px rgba(3,28,42,.20);
}

/* Buttons: stronger, smoother lift */
.sts-contact-page .sts-btn{
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background-color .2s ease;
}

.sts-contact-page .sts-btn:hover{
    transform:translateY(-4px);
}

.sts-contact-page .sts-btn-green:hover{
    background:#0d8733;
    box-shadow:0 14px 28px rgba(19,153,60,.26);
}

.sts-contact-page .sts-btn-blue:hover{
    background:#076fa8;
    box-shadow:0 14px 28px rgba(5,137,214,.25);
}

.sts-contact-page .sts-btn:hover .sts-arrow-icon{
    transform:translateX(4px);
}

.sts-contact-page .sts-btn .sts-arrow-icon{
    transition:transform .2s ease;
}

/* Keep normal paragraph/sidebar text dark, not link-blue */
.sts-contact-coming-soon h2,
.sts-contact-coming-soon > p,
.sts-contact-panel h3,
.sts-contact-panel ul,
.sts-contact-panel li{
    color:var(--ink) !important;
}

.sts-contact-coming-soon > p,
.sts-contact-panel ul,
.sts-contact-panel li{
    color:var(--text) !important;
}

/* Mobile: slightly smaller lift so touch layouts don't jump too much */
@media(max-width:820px){
    .sts-contact-method:hover,
    .sts-contact-panel:hover,
    .sts-contact-hours:hover{
        transform:translateY(-3px);
    }
}



/* =========================================================
   V12 — CARD LIFT EFFECTS + TRUE MOBILE HOMEPAGE
   ========================================================= */

/* ---------- Consistent interactive card lift ---------- */
.sts-service-mini-card,
.sts-process-grid article,
.sts-feature-stat-card,
.sts-full-service-card,
.sts-about-image-stack,
.sts-contact-method,
.sts-contact-panel,
.sts-contact-hours {
    will-change: transform;
    transition:
        transform .24s ease,
        box-shadow .24s ease,
        border-color .24s ease;
}

.sts-service-mini-card:hover,
.sts-process-grid article:hover,
.sts-feature-stat-card:hover,
.sts-full-service-card:hover,
.sts-about-image-stack:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(3, 28, 42, .15);
}

.sts-service-mini-card:hover {
    border-color: rgba(5, 137, 214, .22);
}

.sts-process-grid article:hover {
    border-color: rgba(19, 153, 60, .26);
}

.sts-full-service-card:hover {
    border-color: rgba(5, 137, 214, .24);
}

.sts-full-service-card.sts-service-accent-green:hover {
    border-color: rgba(19, 153, 60, .36);
}

.sts-full-service-card.sts-service-accent-blue:hover {
    border-color: rgba(5, 137, 214, .38);
}

/* Service-card images get a tiny zoom while the whole card lifts */
.sts-service-with-image {
    overflow: hidden;
}

.sts-service-with-image > img {
    transition: transform .4s ease, filter .4s ease;
}

.sts-service-with-image:hover > img {
    transform: scale(1.025);
    filter: saturate(1.05);
}

/* Buttons throughout Home / About / Services */
.sts-home-hero .sts-btn,
.sts-home-intro .sts-btn,
.sts-services-strip .sts-btn,
.sts-home-process .sts-btn,
.sts-home-feature .sts-btn,
.sts-home-cta-large .sts-btn,
.sts-about-layout .sts-btn,
.sts-about-values .sts-btn,
.sts-services-page .sts-btn,
.sts-service-cta .sts-btn {
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background-color .2s ease,
        border-color .2s ease;
}

.sts-home-hero .sts-btn:hover,
.sts-home-intro .sts-btn:hover,
.sts-services-strip .sts-btn:hover,
.sts-home-process .sts-btn:hover,
.sts-home-feature .sts-btn:hover,
.sts-home-cta-large .sts-btn:hover,
.sts-about-layout .sts-btn:hover,
.sts-about-values .sts-btn:hover,
.sts-services-page .sts-btn:hover,
.sts-service-cta .sts-btn:hover {
    transform: translateY(-4px);
}

.sts-btn-green:hover {
    box-shadow: 0 15px 30px rgba(19, 153, 60, .25);
}

.sts-btn-blue:hover {
    box-shadow: 0 15px 30px rgba(5, 137, 214, .25);
}

.sts-btn-white:hover {
    box-shadow: 0 15px 30px rgba(0, 0, 0, .16);
}

/* ---------- About page image stack ---------- */
.sts-about-image-stack {
    border-radius: 24px;
}

.sts-about-image-stack img {
    transition: transform .35s ease;
}

.sts-about-image-stack:hover .sts-about-main-img {
    transform: scale(1.015);
}

.sts-about-image-stack:hover .sts-about-small-img {
    transform: translateY(-6px) rotate(1deg);
}

/* =========================================================
   HOMEPAGE MOBILE/TABLET RESPONSIVENESS
   Fixes the hero copy being squeezed into the far left.
   ========================================================= */

@media (max-width: 1024px) {
    .sts-home-hero,
    .sts-hero-inner {
        min-height: auto !important;
    }

    .sts-home-hero {
        position: relative;
        overflow: hidden;
        background: #031c2a;
    }

    /* Use the photo as a full hero background on tablet/mobile. */
    .sts-hero-photo {
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background-size: cover !important;
        background-position: 62% center !important;
        background-repeat: no-repeat !important;
        -webkit-mask-image: none !important;
        mask-image: none !important;
        opacity: .78;
    }

    .sts-hero-photo:before {
        background:
            linear-gradient(
                90deg,
                rgba(3, 28, 42, .98) 0%,
                rgba(3, 28, 42, .93) 48%,
                rgba(3, 28, 42, .62) 76%,
                rgba(3, 28, 42, .40) 100%
            ) !important;
    }

    .sts-hero-photo-overlay {
        inset: 0 !important;
        background:
            linear-gradient(
                180deg,
                rgba(3, 28, 42, .10) 0%,
                rgba(3, 28, 42, .28) 100%
            ) !important;
    }

    .sts-hero-inner {
        position: relative;
        z-index: 3;
        display: block !important;
        width: min(100% - 48px, 760px) !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    .sts-hero-copy {
        width: 100% !important;
        max-width: 680px !important;
        padding: 82px 0 76px !important;
        margin: 0 !important;
    }

    .sts-hero-copy h1 {
        max-width: 620px;
        font-size: clamp(54px, 8vw, 72px) !important;
        line-height: 1.02 !important;
    }

    .sts-hero-description {
        max-width: 600px !important;
        font-size: 18px !important;
    }

    /* The decorative logo card causes the squeeze on smaller layouts.
       Hide it here because the full brand is already in the header. */
    .sts-hero-logo-card {
        display: none !important;
    }

    .sts-home-intro-grid,
    .sts-section-title-row,
    .sts-home-feature-grid,
    .sts-home-cta-large-inner {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    .sts-services-row,
    .sts-process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .sts-full-service-grid,
    .sts-full-service-grid-large {
        grid-template-columns: 1fr !important;
    }

    .sts-about-layout {
        grid-template-columns: 1fr !important;
        gap: 52px !important;
    }

    .sts-about-copy {
        max-width: 760px;
    }
}

@media (max-width: 760px) {
    .sts-hero-inner {
        width: min(100% - 32px, 680px) !important;
    }

    .sts-hero-copy {
        padding: 68px 0 64px !important;
    }

    .sts-hero-copy h1 {
        max-width: 100% !important;
        font-size: clamp(46px, 12vw, 62px) !important;
        line-height: 1.02 !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .sts-hero-kicker {
        font-size: 12px !important;
        letter-spacing: .16em !important;
    }

    .sts-hero-description {
        max-width: 100% !important;
        font-size: 17px !important;
        line-height: 1.65 !important;
    }

    .sts-hero-actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 430px !important;
    }

    .sts-hero-actions .sts-btn {
        width: 100% !important;
        min-height: 56px !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .sts-hero-trust {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        max-width: 430px;
    }

    .sts-hero-trust > div {
        border-left: 0 !important;
        padding-left: 0 !important;
        justify-content: flex-start !important;
    }

    .sts-services-row,
    .sts-process-grid {
        grid-template-columns: 1fr !important;
    }

    .sts-service-mini-card,
    .sts-process-grid article,
    .sts-full-service-card {
        min-height: 0 !important;
    }

    .sts-page-hero .sts-container,
    .sts-content-section .sts-container,
    .sts-about-values .sts-container,
    .sts-service-cta .sts-container {
        width: min(100% - 32px, 680px) !important;
    }

    .sts-page-hero h1 {
        font-size: clamp(42px, 11vw, 58px) !important;
        line-height: 1.05 !important;
    }

    .sts-page-intro-grid,
    .sts-service-cta-grid {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
    }

    .sts-about-image-stack {
        min-height: 500px;
    }

    .sts-about-main-img {
        width: 84% !important;
    }

    .sts-about-small-img {
        width: 48% !important;
    }
}

@media (max-width: 520px) {
    .sts-hero-inner {
        width: calc(100% - 28px) !important;
    }

    .sts-hero-copy {
        padding: 58px 0 56px !important;
    }

    .sts-hero-copy h1 {
        font-size: clamp(42px, 12.8vw, 54px) !important;
    }

    .sts-hero-description {
        font-size: 16px !important;
    }

    .sts-home-intro,
    .sts-services-strip,
    .sts-home-process,
    .sts-home-feature,
    .sts-content-section,
    .sts-about-values {
        padding-top: 64px !important;
        padding-bottom: 64px !important;
    }

    .sts-services-heading h2,
    .sts-section-title-row h2,
    .sts-home-intro h2,
    .sts-home-feature h2,
    .sts-about-copy h2,
    .sts-page-intro-grid h2 {
        font-size: clamp(34px, 9vw, 46px) !important;
        line-height: 1.08 !important;
    }

    .sts-service-mini-card,
    .sts-process-grid article,
    .sts-full-service-card > div {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    .sts-full-service-card img {
        min-height: 260px !important;
        height: 260px !important;
        object-fit: cover !important;
    }

    .sts-about-image-stack {
        min-height: 400px;
    }

    .sts-about-main-img {
        width: 90% !important;
    }

    .sts-about-small-img {
        width: 52% !important;
    }

    /* Disable big lift distance on touch-size layouts */
    .sts-service-mini-card:hover,
    .sts-process-grid article:hover,
    .sts-feature-stat-card:hover,
    .sts-full-service-card:hover,
    .sts-about-image-stack:hover {
        transform: translateY(-3px);
    }
}


/* =========================================================
   V13 — BLOG COMING SOON + MOBILE NAV BUTTON FIXES
   ========================================================= */

.sts-blog-coming-soon {
    position: relative;
    overflow: hidden;
    padding: 110px 0 120px;
    background:
        radial-gradient(circle at 18% 22%, rgba(19,153,60,.10), transparent 26%),
        radial-gradient(circle at 84% 18%, rgba(5,137,214,.12), transparent 30%),
        linear-gradient(180deg, #f8fbfd 0%, #eef7fb 100%);
}

.sts-blog-coming-soon:before,
.sts-blog-coming-soon:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.sts-blog-coming-soon:before {
    width: 420px;
    height: 420px;
    right: -170px;
    top: -160px;
    border: 1px solid rgba(5,137,214,.12);
    box-shadow:
        0 0 0 55px rgba(5,137,214,.035),
        0 0 0 105px rgba(19,153,60,.025);
}

.sts-blog-coming-soon:after {
    width: 280px;
    height: 280px;
    left: -120px;
    bottom: -130px;
    border: 1px solid rgba(19,153,60,.10);
    box-shadow: 0 0 0 42px rgba(19,153,60,.025);
}

.sts-blog-coming-card {
    position: relative;
    z-index: 2;
    max-width: 980px;
    margin: 0 auto;
    padding: 76px 72px;
    text-align: center;
    border: 1px solid #dceaf1;
    border-radius: 30px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 26px 65px rgba(3,28,42,.12);
}

.sts-blog-coming-icon {
    width: 76px;
    height: 76px;
    margin: 0 auto 24px;
    display: grid;
    place-items: center;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, var(--blue), var(--green));
    box-shadow: 0 15px 32px rgba(5,137,214,.18);
}

.sts-blog-coming-icon svg {
    width: 36px;
    height: 36px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sts-blog-coming-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 17px;
    margin-bottom: 20px;
    border-radius: 999px;
    color: var(--blue);
    background: #eaf6fc;
    border: 1px solid #cbe8f6;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.sts-blog-coming-card h1 {
    max-width: 760px;
    margin: 0 auto 22px;
    color: var(--ink);
    font-size: clamp(48px, 5vw, 76px);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.sts-blog-coming-card > p {
    max-width: 720px;
    margin: 0 auto;
    color: var(--text);
    font-size: 19px;
    line-height: 1.75;
}

.sts-blog-topic-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin: 34px auto 0;
}

.sts-blog-topic-row span {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border-radius: 999px;
    color: var(--ink);
    background: #f4f9fc;
    border: 1px solid #dceaf1;
    font-size: 14px;
    font-weight: 800;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.sts-blog-topic-row span:hover {
    transform: translateY(-4px);
    border-color: rgba(5,137,214,.28);
    box-shadow: 0 10px 24px rgba(3,28,42,.08);
}

.sts-blog-coming-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    margin-top: 36px;
}

/* Fix mobile nav CTA colours with stronger specificity. */
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-estimate,
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-estimate span,
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-estimate svg,
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-estimate path {
    color: #fff !important;
    stroke: currentColor !important;
}

.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-phone,
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-phone span,
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-phone svg,
.sts-main-nav .sts-mobile-nav-actions .sts-mobile-nav-phone path {
    color: var(--blue) !important;
}

.sts-mobile-nav-phone,
.sts-mobile-nav-estimate {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    font-family: Arial, Helvetica, sans-serif;
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.sts-mobile-nav-phone:before,
.sts-mobile-nav-estimate:before {
    content: none !important;
}

.sts-mobile-nav-phone {
    border: 2px solid var(--blue) !important;
    background: #fff !important;
    box-shadow: 0 8px 20px rgba(5,137,214,.08);
}

.sts-mobile-nav-phone:hover {
    color: #fff !important;
    background: var(--blue) !important;
    transform: translateY(-3px);
    box-shadow: 0 13px 28px rgba(5,137,214,.22);
}

.sts-mobile-nav-phone:hover span,
.sts-mobile-nav-phone:hover svg,
.sts-mobile-nav-phone:hover path {
    color: #fff !important;
}

.sts-mobile-nav-estimate {
    color: #fff !important;
    border: 2px solid var(--green) !important;
    background: linear-gradient(135deg, var(--green), #0e8734) !important;
    box-shadow: 0 10px 24px rgba(19,153,60,.20);
}

.sts-mobile-nav-estimate:hover {
    color: #fff !important;
    background: linear-gradient(135deg, #0d8733, #08722a) !important;
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(19,153,60,.28);
}

.sts-mobile-nav-estimate:hover .sts-arrow-icon {
    transform: translateX(4px);
}

.sts-mobile-nav-actions .sts-inline-icon {
    flex: 0 0 auto;
    transition: transform .2s ease;
}

.sts-header-phone {
    border-radius: 999px !important;
    background: #fff;
    box-shadow: 0 7px 18px rgba(5,137,214,.07);
}

.sts-header-estimate {
    color: #fff !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, var(--green), #0e8734);
    border: 0 !important;
}

.sts-header-estimate span,
.sts-header-estimate svg,
.sts-header-estimate path {
    color: #fff !important;
}

@media(max-width:820px) {
    .sts-main-nav {
        padding: 24px 20px 30px !important;
    }

    .sts-main-nav > a {
        width: min(100%, 430px) !important;
        min-height: 54px !important;
        justify-content: center !important;
        text-align: center !important;
        border-radius: 12px !important;
    }

    .sts-main-nav > a:hover {
        background: #f1f8fb;
        transform: none;
    }

    .sts-mobile-nav-actions {
        width: min(100%, 430px) !important;
        gap: 13px !important;
        margin-top: 20px !important;
        padding-top: 22px !important;
    }

    .sts-mobile-nav-actions a {
        min-height: 58px !important;
        border-radius: 14px !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    .sts-blog-coming-soon {
        padding: 78px 0 86px;
    }

    .sts-blog-coming-card {
        padding: 54px 34px;
        border-radius: 24px;
    }

    .sts-blog-coming-card h1 {
        font-size: clamp(44px, 10vw, 62px);
    }
}

@media(max-width:560px) {
    .sts-blog-coming-soon {
        padding: 56px 0 64px;
    }

    .sts-blog-coming-card {
        padding: 42px 22px;
        border-radius: 20px;
    }

    .sts-blog-coming-card h1 {
        font-size: clamp(40px, 12vw, 52px);
    }

    .sts-blog-coming-card > p {
        font-size: 16px;
    }

    .sts-blog-coming-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .sts-blog-coming-actions .sts-btn {
        width: 100%;
    }
}


/* =========================================================
   V14 — CLEAN NAVIGATION UNDERLINES
   - Home text removed; logo is Home.
   - Every page link uses the same underline system.
   - Hover line grows outward from the center.
   - Current page keeps its line visible.
   ========================================================= */

/* Remove old pill / legacy underline effects so every nav item behaves alike. */
.sts-main-nav > a:before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: calc(50% - 27px) !important;
    width: 0 !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--blue), var(--green)) !important;
    opacity: 1 !important;
    transform: translateX(-50%) !important;
    transition:
        width .24s ease,
        background-color .2s ease !important;
    z-index: 2 !important;
}

/* Completely neutralize all older :after underline rules. */
.sts-main-nav > a:after,
.sts-main-nav > a:first-child:after,
.sts-main-nav > a.is-active:after {
    content: none !important;
    display: none !important;
}

/* Normal links are dark; current page and hover use blue. */
.sts-main-nav > a {
    color: var(--ink) !important;
    background: transparent !important;
    transform: none !important;
}

.sts-main-nav > a:hover {
    color: var(--blue) !important;
    background: transparent !important;
    transform: none !important;
}

/* Hover line extends from center. */
.sts-main-nav > a:hover:before {
    width: calc(100% - 36px) !important;
    transform: translateX(-50%) !important;
}

/* Current page keeps the line visible even when not hovered. */
.sts-main-nav > a.is-active {
    color: var(--blue) !important;
}

.sts-main-nav > a.is-active:before {
    width: calc(100% - 36px) !important;
}

/* Tiny extra movement on hover for a more polished feel. */
.sts-main-nav > a > span {
    transition: transform .2s ease;
}

/* The logo is the Home control, so give it a subtle hover response. */
.sts-brand {
    transition: transform .22s ease, opacity .22s ease;
}

.sts-brand:hover {
    transform: translateY(-2px);
    opacity: .94;
}

/* Keep CTA buttons completely separate from nav underline styling. */
.sts-mobile-nav-actions a:before,
.sts-header-actions a:before {
    content: none !important;
}

/* MOBILE:
   Keep links centered, but do not use desktop underline animation.
   Current page gets a subtle blue/green accent bar underneath. */
@media (max-width: 820px) {
    .sts-main-nav > a:before {
        content: "" !important;
        position: absolute !important;
        left: 50% !important;
        bottom: 7px !important;
        width: 0 !important;
        height: 2px !important;
        background: linear-gradient(90deg, var(--blue), var(--green)) !important;
        transform: translateX(-50%) !important;
        transition: width .22s ease !important;
    }

    .sts-main-nav > a:hover:before,
    .sts-main-nav > a.is-active:before {
        width: 64px !important;
    }

    .sts-main-nav > a:hover {
        background: #f4f9fc !important;
    }

    .sts-mobile-nav-actions a:before {
        content: none !important;
    }
}


/* =========================================================
   V15 — BIGGER HERO PHOTO / BETTER BLEND
   ========================================================= */

/*
 * Make the existing treeservciceimage.webp fill much more of the right side.
 * We intentionally allow the low-res image to scale up for now.
 */
.sts-home-hero .sts-hero-photo {
    inset: 0 0 0 40% !important;
    background-size: cover !important;
    background-position: center 42% !important;
    background-repeat: no-repeat !important;

    /* Fade the photo softly into the navy on the left. */
    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.18) 7%,
        rgba(0,0,0,.58) 19%,
        #000 35%,
        #000 100%
    ) !important;
    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.18) 7%,
        rgba(0,0,0,.58) 19%,
        #000 35%,
        #000 100%
    ) !important;
}

/* Dark/blue treatment over the enlarged photo so it feels integrated. */
.sts-home-hero .sts-hero-photo:before {
    background:
        linear-gradient(
            90deg,
            rgba(3,28,42,.82) 0%,
            rgba(3,28,42,.48) 18%,
            rgba(3,28,42,.18) 38%,
            rgba(3,28,42,.04) 66%,
            rgba(3,28,42,.02) 100%
        ),
        linear-gradient(
            180deg,
            rgba(3,28,42,.08),
            rgba(3,28,42,.20)
        ) !important;
}

.sts-home-hero .sts-hero-photo:after {
    background:
        linear-gradient(
            90deg,
            rgba(5,137,214,.08),
            rgba(5,137,214,.025) 48%,
            transparent 75%
        ) !important;
}

/*
 * The overall overlay now fades out sooner so the photograph remains
 * visible instead of looking like a narrow vertical strip.
 */
.sts-home-hero .sts-hero-photo-overlay {
    background: linear-gradient(
        90deg,
        #031c2a 0%,
        rgba(3,28,42,.99) 24%,
        rgba(3,28,42,.92) 36%,
        rgba(3,28,42,.60) 48%,
        rgba(3,28,42,.20) 60%,
        rgba(3,28,42,0) 73%
    ) !important;
}

/* Give the right-hand logo card a little more presence over the photo. */
.sts-home-hero .sts-hero-logo-card {
    width: 390px !important;
    height: 260px !important;
    transform: translateX(-5px) !important;
}

.sts-home-hero .sts-card-back {
    width: 360px !important;
    height: 235px !important;
}

.sts-home-hero .sts-card-front {
    inset: 0 !important;
}

/* Large desktop / 1440p+ */
@media (min-width: 1440px) {
    .sts-home-hero .sts-hero-photo {
        inset: 0 0 0 37% !important;
        background-size: cover !important;
        background-position: center 40% !important;
    }

    .sts-home-hero .sts-hero-photo-overlay {
        background: linear-gradient(
            90deg,
            #031c2a 0%,
            rgba(3,28,42,.99) 22%,
            rgba(3,28,42,.90) 34%,
            rgba(3,28,42,.55) 46%,
            rgba(3,28,42,.15) 58%,
            rgba(3,28,42,0) 70%
        ) !important;
    }
}

/* Tablet */
@media (max-width: 1050px) {
    .sts-home-hero .sts-hero-photo {
        inset: 0 !important;
        background-size: cover !important;
        background-position: 64% center !important;
        -webkit-mask-image: none !important;
        mask-image: none !important;
    }

    .sts-home-hero .sts-hero-photo-overlay {
        background: linear-gradient(
            90deg,
            rgba(3,28,42,.98) 0%,
            rgba(3,28,42,.91) 52%,
            rgba(3,28,42,.48) 100%
        ) !important;
    }
}

/* Mobile */
@media (max-width: 560px) {
    .sts-home-hero .sts-hero-photo {
        background-position: 66% center !important;
    }

    .sts-home-hero .sts-hero-photo-overlay {
        background: rgba(3,28,42,.82) !important;
    }
}


/* =========================================================
   V16 — HERO LOGO CARD LEFT + NAV BRAND NO HOVER
   ========================================================= */

/* Move the hero logo card noticeably left so it sits closer to the hero copy. */
.sts-home-hero .sts-hero-logo-card {
    justify-self: start !important;
    transform: translateX(-145px) !important;
}

/* Give the card a touch more overlap into the center on large screens. */
@media (min-width: 1440px) {
    .sts-home-hero .sts-hero-logo-card {
        transform: translateX(-175px) !important;
    }
}

/* Normal desktop/laptop: still left, but not so far that it crowds the copy. */
@media (min-width: 1060px) and (max-width: 1439px) {
    .sts-home-hero .sts-hero-logo-card {
        transform: translateX(-125px) !important;
    }
}

/* Tablet: don't force the desktop overlap. */
@media (max-width: 1050px) {
    .sts-home-hero .sts-hero-logo-card {
        transform: none !important;
        justify-self: center !important;
    }
}

/* ---------------------------------------------------------
   HEADER LOGO: absolutely NO hover animation/effect.
   The brand remains clickable as the Home link.
   --------------------------------------------------------- */

.sts-brand,
.sts-brand:hover,
.sts-brand:focus,
.sts-brand:active {
    transform: none !important;
    translate: none !important;
    scale: 1 !important;
    filter: none !important;
    opacity: 1 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

/* Prevent generic anchor underline/pseudo-element rules from touching the logo. */
.sts-brand::before,
.sts-brand::after,
.sts-brand:hover::before,
.sts-brand:hover::after,
.sts-brand:focus::before,
.sts-brand:focus::after {
    content: none !important;
    display: none !important;
}

/* Images themselves must never animate on logo hover. */
.sts-brand .sts-brand-icon,
.sts-brand .sts-brand-text,
.sts-brand:hover .sts-brand-icon,
.sts-brand:hover .sts-brand-text,
.sts-brand:focus .sts-brand-icon,
.sts-brand:focus .sts-brand-text {
    transform: none !important;
    scale: 1 !important;
    filter: none !important;
    opacity: 1 !important;
    transition: none !important;
}

/* Keep nav-item hover effects scoped to the actual text navigation only. */
.sts-main-nav > a {
    transition: color .2s ease !important;
}



/* =========================================================
   V17 CONTACT MOBILE RESPONSIVENESS + ABOUT CTA SPACING
   ========================================================= */

/* Desktop hover/lift polish */
.sts-contact-method,
.sts-contact-panel,
.sts-contact-hours,
.sts-service-mini-card,
.sts-full-service-card,
.sts-process-grid article,
.sts-feature-stat-card {
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.sts-contact-method:hover,
.sts-contact-panel:hover,
.sts-contact-hours:hover,
.sts-service-mini-card:hover,
.sts-full-service-card:hover,
.sts-process-grid article:hover,
.sts-feature-stat-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 42px rgba(5,38,56,.15);
}

/* Keep cards from forcing overflow */
.sts-contact-page,
.sts-contact-page .sts-container,
.sts-contact-cards,
.sts-contact-layout,
.sts-contact-layout-large,
.sts-contact-sidebar,
.sts-contact-panel,
.sts-contact-method,
.sts-contact-hours,
.sts-contact-coming-soon {
    min-width: 0;
    max-width: 100%;
}

.sts-contact-method strong,
.sts-contact-method small,
.sts-contact-panel h2,
.sts-contact-panel h3,
.sts-contact-panel p,
.sts-contact-panel li,
.sts-contact-hours span,
.sts-contact-hours small {
    overflow-wrap: anywhere;
    word-break: normal;
}

/* About page CTA button spacing */
.sts-about-copy .sts-btn,
.sts-about-layout .sts-btn,
.sts-home-cta-large .sts-btn {
    margin-top: 24px;
}

/* Contact action buttons */
.sts-coming-soon-actions {
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    margin-top:28px;
}

.sts-coming-soon-actions .sts-btn {
    min-width: 190px;
}

/* Tablet/mobile contact layout */
@media (max-width: 900px) {

    .sts-contact-page .sts-container {
        width: min(100% - 36px, 760px);
    }

    .sts-contact-cards {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
        margin-bottom: 22px !important;
    }

    .sts-contact-layout,
    .sts-contact-layout-large {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .sts-contact-sidebar {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .sts-contact-method {
        min-height: auto !important;
        padding: 26px 24px !important;
        border-radius: 18px !important;
    }

    .sts-contact-method strong {
        font-size: clamp(22px, 5vw, 30px) !important;
        line-height: 1.15 !important;
    }

    .sts-contact-method small {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    .sts-contact-coming-soon {
        min-height: auto !important;
        padding: 34px 28px !important;
        justify-content: flex-start !important;
    }

    .sts-contact-coming-soon:after {
        width: 180px !important;
        height: 180px !important;
        right: -80px !important;
        bottom: -80px !important;
    }

    .sts-contact-panel {
        padding: 30px 26px !important;
    }

    .sts-contact-panel h2 {
        font-size: clamp(32px, 7vw, 44px) !important;
        line-height: 1.08 !important;
    }

    .sts-contact-panel h3 {
        font-size: clamp(24px, 5.5vw, 30px) !important;
        line-height: 1.14 !important;
    }

    .sts-contact-hours {
        padding: 28px 24px !important;
    }

    .sts-coming-soon-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    .sts-coming-soon-actions .sts-btn {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
    }

    /* On touch screens we don't want hover-lift causing visual jumping */
    .sts-contact-method:hover,
    .sts-contact-panel:hover,
    .sts-contact-hours:hover {
        transform: none;
    }
}

@media (max-width: 600px) {

    .sts-contact-page.sts-content-section {
        padding: 52px 0 !important;
    }

    .sts-contact-page .sts-container {
        width: calc(100% - 24px) !important;
    }

    .sts-page-hero {
        padding: 70px 0 58px !important;
    }

    .sts-page-hero h1 {
        font-size: clamp(40px, 12vw, 54px) !important;
        line-height: 1.02 !important;
    }

    .sts-page-hero > div > p:last-child {
        font-size: 16px !important;
        line-height: 1.65 !important;
    }

    .sts-contact-method {
        padding: 22px 20px !important;
        border-radius: 16px !important;
    }

    .sts-contact-method span {
        margin-bottom: 10px !important;
    }

    .sts-contact-method strong {
        font-size: 22px !important;
    }

    .sts-contact-panel,
    .sts-contact-coming-soon {
        padding: 24px 20px !important;
        border-radius: 16px !important;
    }

    .sts-contact-panel h2 {
        font-size: 34px !important;
    }

    .sts-coming-soon-mark {
        margin: 14px 0 4px !important;
    }

    .sts-coming-soon-mark span {
        min-height: 38px !important;
        padding: 0 14px !important;
        font-size: 12px !important;
    }

    .sts-contact-hours {
        padding: 24px 20px !important;
        border-radius: 16px !important;
    }

    .sts-contact-panel ul {
        padding-left: 18px !important;
        line-height: 1.75 !important;
    }

    .sts-about-copy .sts-btn,
    .sts-about-layout .sts-btn,
    .sts-home-cta-large .sts-btn {
        margin-top: 28px !important;
    }
}

@media (max-width: 380px) {
    .sts-contact-method strong {
        font-size: 20px !important;
    }

    .sts-contact-panel h2 {
        font-size: 30px !important;
    }

    .sts-contact-panel,
    .sts-contact-coming-soon,
    .sts-contact-hours {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
}


/* =========================================================
   V18 - PRIVACY POLICY + TERMS OF SERVICE PAGE SPACING
   Adds comfortable page gutters and readable legal content.
   ========================================================= */

/* WordPress Privacy Policy page + Terms page */
body.privacy-policy .entry-content,
body.privacy-policy .wp-block-post-content,
body.page-slug-terms-of-service .entry-content,
body.page-slug-terms-of-service .wp-block-post-content,
body.page-slug-terms .entry-content,
body.page-slug-terms .wp-block-post-content {
    width: min(1180px, calc(100% - 64px));
    margin-left: auto;
    margin-right: auto;
    padding-top: 72px;
    padding-bottom: 88px;
}

/* Fallback for the theme's normal WordPress page wrapper. */
.sts-legal-page {
    background: #f6fafc;
    padding: 72px 0 88px;
}

.sts-legal-page .sts-legal-content {
    width: min(1180px, calc(100% - 64px));
    margin: 0 auto;
}

body.privacy-policy .entry-content > *,
body.privacy-policy .wp-block-post-content > *,
body.page-slug-terms-of-service .entry-content > *,
body.page-slug-terms-of-service .wp-block-post-content > *,
body.page-slug-terms .entry-content > *,
body.page-slug-terms .wp-block-post-content > * {
    max-width: 100%;
}

body.privacy-policy .entry-content h1,
body.privacy-policy .wp-block-post-content h1,
body.page-slug-terms-of-service .entry-content h1,
body.page-slug-terms-of-service .wp-block-post-content h1,
body.page-slug-terms .entry-content h1,
body.page-slug-terms .wp-block-post-content h1 {
    margin: 0 0 26px;
}

body.privacy-policy .entry-content h2,
body.privacy-policy .wp-block-post-content h2,
body.page-slug-terms-of-service .entry-content h2,
body.page-slug-terms-of-service .wp-block-post-content h2,
body.page-slug-terms .entry-content h2,
body.page-slug-terms .wp-block-post-content h2 {
    margin-top: 48px;
    margin-bottom: 16px;
}

body.privacy-policy .entry-content p,
body.privacy-policy .entry-content li,
body.privacy-policy .wp-block-post-content p,
body.privacy-policy .wp-block-post-content li,
body.page-slug-terms-of-service .entry-content p,
body.page-slug-terms-of-service .entry-content li,
body.page-slug-terms-of-service .wp-block-post-content p,
body.page-slug-terms-of-service .wp-block-post-content li,
body.page-slug-terms .entry-content p,
body.page-slug-terms .entry-content li,
body.page-slug-terms .wp-block-post-content p,
body.page-slug-terms .wp-block-post-content li {
    line-height: 1.75;
}

@media (max-width: 900px) {
    body.privacy-policy .entry-content,
    body.privacy-policy .wp-block-post-content,
    body.page-slug-terms-of-service .entry-content,
    body.page-slug-terms-of-service .wp-block-post-content,
    body.page-slug-terms .entry-content,
    body.page-slug-terms .wp-block-post-content,
    .sts-legal-page .sts-legal-content {
        width: min(100% - 40px, 1180px);
    }
}

@media (max-width: 600px) {
    body.privacy-policy .entry-content,
    body.privacy-policy .wp-block-post-content,
    body.page-slug-terms-of-service .entry-content,
    body.page-slug-terms-of-service .wp-block-post-content,
    body.page-slug-terms .entry-content,
    body.page-slug-terms .wp-block-post-content {
        width: calc(100% - 32px);
        padding-top: 48px;
        padding-bottom: 64px;
    }

    .sts-legal-page {
        padding: 48px 0 64px;
    }

    .sts-legal-page .sts-legal-content {
        width: calc(100% - 32px);
    }

    body.privacy-policy .entry-content h2,
    body.privacy-policy .wp-block-post-content h2,
    body.page-slug-terms-of-service .entry-content h2,
    body.page-slug-terms-of-service .wp-block-post-content h2,
    body.page-slug-terms .entry-content h2,
    body.page-slug-terms .wp-block-post-content h2 {
        margin-top: 36px;
    }
}


/* =========================================================
   V19 — LIVE WORDPRESS BLOG
   Posts = Blog Articles
   ========================================================= */

.sts-blog-hero{
    background:
        radial-gradient(circle at 84% 18%,rgba(5,137,214,.20),transparent 30%),
        radial-gradient(circle at 16% 88%,rgba(19,153,60,.12),transparent 32%),
        var(--navy);
}

.sts-blog-page{
    padding:90px 0 110px;
    background:#f4f9fc;
}

.sts-blog-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-bottom:36px;
}

.sts-blog-filter-form{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.sts-blog-search-wrap{
    position:relative;
    flex:1 1 390px;
    max-width:600px;
}

.sts-blog-search-icon{
    position:absolute;
    left:18px;
    top:50%;
    width:21px;
    height:21px;
    transform:translateY(-50%);
    fill:none;
    stroke:var(--blue);
    stroke-width:2;
    stroke-linecap:round;
    pointer-events:none;
}

.sts-blog-search-wrap input,
.sts-blog-filter-form select{
    height:56px;
    border:1px solid #cfe0e8;
    border-radius:13px;
    background:#fff;
    color:var(--ink);
    font:inherit;
    outline:none;
    box-shadow:0 7px 18px rgba(5,38,56,.05);
    transition:border-color .2s ease,box-shadow .2s ease;
}

.sts-blog-search-wrap input{
    width:100%;
    padding:0 18px 0 52px;
}

.sts-blog-filter-form select{
    min-width:210px;
    padding:0 42px 0 17px;
    cursor:pointer;
}

.sts-blog-search-wrap input:focus,
.sts-blog-filter-form select:focus{
    border-color:var(--blue);
    box-shadow:0 0 0 3px rgba(5,137,214,.10);
}

.sts-blog-filter-button{
    min-height:56px;
    border:0;
    padding:0 25px;
    cursor:pointer;
}

.sts-blog-clear{
    color:var(--blue);
    font-weight:800;
    text-decoration:none;
    white-space:nowrap;
}

.sts-blog-clear:hover{
    text-decoration:underline;
}

.sts-blog-result-count{
    flex:0 0 auto;
    color:var(--muted);
    font-size:14px;
    font-weight:800;
    white-space:nowrap;
}

.sts-blog-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:28px;
}

.sts-blog-card{
    min-width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    border:1px solid #dce9ef;
    border-radius:20px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,38,56,.08);
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.sts-blog-card:hover{
    transform:translateY(-6px);
    border-color:#c6e1ed;
    box-shadow:0 20px 42px rgba(5,38,56,.13);
}

.sts-blog-card-image{
    position:relative;
    display:block;
    height:255px;
    overflow:hidden;
    background:#dfeef4;
}

.sts-blog-card-image img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .35s ease;
}

.sts-blog-card:hover .sts-blog-card-image img{
    transform:scale(1.035);
}

.sts-blog-image-placeholder{
    width:100%;
    height:100%;
    display:grid;
    place-items:center;
    color:#fff;
    background:
        radial-gradient(circle at 75% 25%,rgba(34,189,79,.28),transparent 34%),
        linear-gradient(135deg,var(--navy),#0b668e);
}

.sts-blog-image-placeholder svg{
    width:76px;
    height:76px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.4;
    stroke-linecap:round;
    stroke-linejoin:round;
    opacity:.86;
}

.sts-blog-card-category{
    position:absolute;
    left:18px;
    bottom:18px;
    max-width:calc(100% - 36px);
    padding:8px 12px;
    border-radius:999px;
    color:#fff;
    background:var(--green);
    box-shadow:0 7px 16px rgba(3,28,42,.18);
    font-size:12px;
    font-weight:900;
    line-height:1;
}

.sts-blog-card-body{
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    padding:26px 26px 28px;
}

.sts-blog-card-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:13px;
    color:#738590;
    font-size:12px;
    font-weight:700;
}

.sts-blog-card h2{
    margin:0 0 13px;
    font-size:26px;
    line-height:1.15;
    letter-spacing:-.02em;
}

.sts-blog-card h2 a{
    color:var(--ink);
    text-decoration:none;
}

.sts-blog-card h2 a:hover{
    color:var(--blue);
}

.sts-blog-card-body>p{
    margin:0 0 22px;
    color:var(--text);
    font-size:15px;
    line-height:1.7;
}

.sts-blog-read-more{
    margin-top:auto;
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--blue);
    font-size:14px;
    font-weight:900;
    text-decoration:none;
}

.sts-blog-read-more span{
    transition:transform .2s ease;
}

.sts-blog-read-more:hover span{
    transform:translateX(4px);
}

.sts-blog-pagination{
    margin-top:50px;
}

.sts-blog-pagination .page-numbers{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:9px;
    flex-wrap:wrap;
}

.sts-blog-pagination .page-numbers li{
    margin:0;
}

.sts-blog-pagination a.page-numbers,
.sts-blog-pagination span.page-numbers{
    min-width:44px;
    height:44px;
    padding:0 14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid #cfe0e8;
    border-radius:11px;
    color:var(--ink);
    background:#fff;
    font-size:14px;
    font-weight:900;
    text-decoration:none;
}

.sts-blog-pagination a.page-numbers:hover,
.sts-blog-pagination span.page-numbers.current{
    color:#fff;
    border-color:var(--blue);
    background:var(--blue);
}

.sts-blog-empty{
    max-width:760px;
    margin:20px auto 0;
    padding:70px 40px;
    text-align:center;
    border:1px solid #dce9ef;
    border-radius:24px;
    background:#fff;
    box-shadow:var(--shadow);
}

.sts-blog-empty-icon{
    width:68px;
    height:68px;
    margin:0 auto 20px;
    display:grid;
    place-items:center;
    border-radius:18px;
    color:#fff;
    background:linear-gradient(135deg,var(--blue),var(--green));
}

.sts-blog-empty-icon svg{
    width:31px;
    height:31px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
}

.sts-blog-empty h2{
    margin:0 0 10px;
    font-size:34px;
}

.sts-blog-empty p{
    margin:0 0 24px;
    color:var(--text);
}

@media(max-width:1050px){
    .sts-blog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .sts-blog-toolbar{
        align-items:flex-start;
        flex-direction:column;
    }
}

@media(max-width:700px){
    .sts-blog-page{
        padding:62px 0 76px;
    }

    .sts-blog-filter-form{
        width:100%;
        display:grid;
        grid-template-columns:1fr;
    }

    .sts-blog-search-wrap{
        width:100%;
        max-width:none;
        flex:auto;
    }

    .sts-blog-filter-form select,
    .sts-blog-filter-button{
        width:100%;
    }

    .sts-blog-clear{
        justify-self:center;
        padding:7px 0;
    }

    .sts-blog-grid{
        grid-template-columns:1fr;
        gap:22px;
    }

    .sts-blog-card-image{
        height:235px;
    }

    .sts-blog-card:hover{
        transform:none;
    }

    .sts-blog-result-count{
        width:100%;
    }
}

@media(max-width:480px){
    .sts-blog-card-image{
        height:215px;
    }

    .sts-blog-card-body{
        padding:22px 21px 24px;
    }

    .sts-blog-card h2{
        font-size:23px;
    }

    .sts-blog-pagination a.page-numbers,
    .sts-blog-pagination span.page-numbers{
        min-width:40px;
        height:40px;
        padding:0 11px;
    }

    .sts-blog-empty{
        padding:50px 22px;
    }
}


/* =========================================================
   V20 — HERO LOGO CARD HOVER ANIMATION
   ========================================================= */

.sts-hero-logo-card {
    position: relative;
    cursor: default;
    transform-origin: center center;
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        filter .35s ease;
    will-change: transform;
}

.sts-hero-logo-card .sts-card-front {
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        box-shadow .35s ease;
    will-change: transform;
}

.sts-hero-logo-card .sts-card-back-green,
.sts-hero-logo-card .sts-card-back-blue {
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        opacity .3s ease;
    will-change: transform;
}

.sts-hero-logo-card .sts-card-icon,
.sts-hero-logo-card .sts-card-text {
    transition: transform .35s ease;
    will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
    .sts-hero-logo-card:hover {
        transform: translateY(-10px) rotate(-1deg) scale(1.025);
        filter: drop-shadow(0 24px 32px rgba(0,27,43,.24));
    }

    .sts-hero-logo-card:hover .sts-card-front {
        transform: rotate(1.5deg) translateY(-3px);
        box-shadow: 0 22px 45px rgba(0,25,40,.20);
    }

    .sts-hero-logo-card:hover .sts-card-back-green {
        transform: translate(-14px, 9px) rotate(-5deg);
    }

    .sts-hero-logo-card:hover .sts-card-back-blue {
        transform: translate(16px, -8px) rotate(5deg);
    }

    .sts-hero-logo-card:hover .sts-card-icon {
        transform: translateY(-3px) scale(1.04);
    }

    .sts-hero-logo-card:hover .sts-card-text {
        transform: translateY(2px) scale(1.025);
    }
}

@media (prefers-reduced-motion: reduce) {
    .sts-hero-logo-card,
    .sts-hero-logo-card *,
    .sts-hero-logo-card::before,
    .sts-hero-logo-card::after {
        transition: none !important;
        animation: none !important;
    }
}


/* =========================================================
   V21 — INTERIOR PAGE IMAGE HEROES
   About / Services / Blog / Contact
   Matches the blended visual language of the home hero.
   ========================================================= */

.sts-page-hero.sts-page-hero-image {
    position: relative;
    isolation: isolate;
    min-height: 500px;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: 0;
    color: #fff;
    background:
        radial-gradient(circle at 28% 45%, rgba(5,137,214,.12), transparent 34%),
        #032638;
}

.sts-page-hero-image .sts-page-hero-photo {
    position: absolute;
    z-index: -3;
    top: 0;
    right: 0;
    bottom: 0;
    width: 64%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    transform: scale(1.015);
    transition: transform .8s cubic-bezier(.22,.61,.36,1);
}

.sts-page-hero-image .sts-page-hero-photo::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg,
            #032638 0%,
            rgba(3,38,56,.97) 8%,
            rgba(3,38,56,.82) 24%,
            rgba(3,38,56,.40) 46%,
            rgba(3,38,56,.08) 73%,
            rgba(3,38,56,.02) 100%);
}

.sts-page-hero-image .sts-page-hero-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg,
            rgba(0,18,29,.10) 0%,
            transparent 48%,
            rgba(0,22,34,.22) 100%);
}

.sts-page-hero-image .sts-page-hero-overlay {
    position: absolute;
    z-index: -2;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg,
            rgba(3,38,56,1) 0%,
            rgba(3,38,56,.98) 25%,
            rgba(3,38,56,.74) 43%,
            rgba(3,38,56,.20) 67%,
            transparent 100%),
        linear-gradient(180deg,
            transparent 58%,
            rgba(0,31,46,.24) 100%);
}

.sts-page-hero-image .sts-page-hero-inner {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 500px;
    display: flex;
    align-items: center;
    padding-top: 76px;
    padding-bottom: 76px;
}

.sts-page-hero-image .sts-page-hero-copy {
    width: min(690px, 54%);
}

.sts-page-hero-image .sts-page-kicker {
    margin: 0 0 18px;
    color: #22bd4f;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .19em;
    text-transform: uppercase;
}

.sts-page-hero-image h1 {
    max-width: 760px;
    margin: 0 0 22px;
    color: #fff;
    font-size: clamp(48px, 5.2vw, 78px);
    line-height: .99;
    letter-spacing: -.045em;
    text-wrap: balance;
}

.sts-page-hero-image .sts-page-hero-copy > p:last-child {
    max-width: 640px;
    margin: 0;
    color: rgba(255,255,255,.88);
    font-size: 18px;
    line-height: 1.72;
}

/* Individual image framing */
.sts-page-hero-about .sts-page-hero-photo {
    background-position: 62% center;
}

.sts-page-hero-services .sts-page-hero-photo {
    background-position: 58% center;
}

.sts-page-hero-blog .sts-page-hero-photo {
    background-position: 56% center;
}

.sts-page-hero-contact .sts-page-hero-photo {
    background-position: 58% center;
}

/* Small motion — image gently breathes when desktop users hover the hero */
@media (hover:hover) and (pointer:fine) {
    .sts-page-hero-image:hover .sts-page-hero-photo {
        transform: scale(1.04);
    }
}

/* Wide desktop: let the image occupy more of the right side */
@media (min-width: 1500px) {
    .sts-page-hero.sts-page-hero-image {
        min-height: 540px;
    }

    .sts-page-hero-image .sts-page-hero-inner {
        min-height: 540px;
    }

    .sts-page-hero-image .sts-page-hero-photo {
        width: 67%;
    }

    .sts-page-hero-image .sts-page-hero-copy {
        width: min(720px, 52%);
    }
}

/* Tablet */
@media (max-width: 1000px) {
    .sts-page-hero.sts-page-hero-image,
    .sts-page-hero-image .sts-page-hero-inner {
        min-height: 460px;
    }

    .sts-page-hero-image .sts-page-hero-photo {
        width: 72%;
    }

    .sts-page-hero-image .sts-page-hero-copy {
        width: 62%;
    }

    .sts-page-hero-image h1 {
        font-size: clamp(44px, 6.2vw, 64px);
    }

    .sts-page-hero-image .sts-page-hero-photo::before {
        background:
            linear-gradient(90deg,
                #032638 0%,
                rgba(3,38,56,.96) 18%,
                rgba(3,38,56,.70) 45%,
                rgba(3,38,56,.16) 78%,
                transparent 100%);
    }
}

/* Mobile: full-width photo behind text with stronger blue overlay */
@media (max-width: 720px) {
    .sts-page-hero.sts-page-hero-image {
        min-height: 500px;
        align-items: flex-end;
    }

    .sts-page-hero-image .sts-page-hero-photo {
        width: 100%;
        left: 0;
        background-position: center center;
        transform: none;
    }

    .sts-page-hero-image .sts-page-hero-photo::before {
        background:
            linear-gradient(180deg,
                rgba(3,38,56,.42) 0%,
                rgba(3,38,56,.62) 38%,
                rgba(3,38,56,.96) 82%,
                #032638 100%);
    }

    .sts-page-hero-image .sts-page-hero-overlay {
        background:
            linear-gradient(90deg,
                rgba(3,38,56,.70) 0%,
                rgba(3,38,56,.38) 100%),
            linear-gradient(180deg,
                rgba(0,20,30,.08) 0%,
                rgba(3,38,56,.28) 42%,
                rgba(3,38,56,.94) 100%);
    }

    .sts-page-hero-image .sts-page-hero-inner {
        min-height: 500px;
        align-items: flex-end;
        padding-top: 150px;
        padding-bottom: 52px;
    }

    .sts-page-hero-image .sts-page-hero-copy {
        width: 100%;
        max-width: 100%;
    }

    .sts-page-hero-image h1 {
        max-width: 620px;
        margin-bottom: 17px;
        font-size: clamp(40px, 12vw, 57px);
        line-height: 1.02;
    }

    .sts-page-hero-image .sts-page-hero-copy > p:last-child {
        max-width: 570px;
        font-size: 16px;
        line-height: 1.62;
    }

    .sts-page-hero-image .sts-page-kicker {
        font-size: 11px;
        margin-bottom: 14px;
    }

    /* Tune each supplied mobile photo individually */
    .sts-page-hero-about .sts-page-hero-photo {
        background-position: 60% center;
    }

    .sts-page-hero-services .sts-page-hero-photo {
        background-position: 55% center;
    }

    .sts-page-hero-blog .sts-page-hero-photo {
        background-position: 56% center;
    }

    .sts-page-hero-contact .sts-page-hero-photo {
        background-position: 58% center;
    }
}

@media (max-width: 480px) {
    .sts-page-hero.sts-page-hero-image,
    .sts-page-hero-image .sts-page-hero-inner {
        min-height: 470px;
    }

    .sts-page-hero-image .sts-page-hero-inner {
        padding-top: 135px;
        padding-bottom: 42px;
    }

    .sts-page-hero-image h1 {
        font-size: clamp(37px, 11.5vw, 50px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .sts-page-hero-image .sts-page-hero-photo {
        transition: none !important;
        transform: none !important;
    }
}


/* =========================================================
   V22 — RESTORE INTERIOR HERO CONTAINER MARGINS
   The V21 hero-inner width:100% overrode the normal
   .sts-container width and pushed copy against the viewport.
   ========================================================= */

.sts-page-hero-image .sts-page-hero-inner.sts-container {
    width: min(1440px, calc(100% - 64px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* Large desktop — match the site's existing container spacing */
@media (min-width: 1440px) {
    .sts-page-hero-image .sts-page-hero-inner.sts-container {
        width: min(1500px, calc(100% - 100px));
    }
}

/* Tablet */
@media (max-width: 900px) {
    .sts-page-hero-image .sts-page-hero-inner.sts-container {
        width: calc(100% - 40px);
    }
}

/* Mobile */
@media (max-width: 560px) {
    .sts-page-hero-image .sts-page-hero-inner.sts-container {
        width: calc(100% - 28px);
    }
}


/* =========================================================
   V23 — SERVICES 3 x 2 CARD GRID
   Desktop: 3 columns x 2 rows
   Tablet:  2 columns
   Mobile:  1 column
   ========================================================= */

.sts-services-six-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    margin-top: 58px;
}

.sts-service-six-card {
    position: relative;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #dce8ee;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(3, 38, 56, .08);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.sts-service-six-card:nth-child(odd) {
    border-top: 4px solid var(--green);
}

.sts-service-six-card:nth-child(even) {
    border-top: 4px solid var(--blue);
}

.sts-service-six-image {
    position: relative;
    width: 100%;
    height: 255px;
    overflow: hidden;
    background: #dce8ed;
}

.sts-service-six-image::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, transparent 58%, rgba(3, 38, 56, .30) 100%);
}

.sts-service-six-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .4s cubic-bezier(.22,.61,.36,1);
}

.sts-service-six-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 30px;
}

.sts-service-six-content .sts-service-number {
    display: inline-flex;
    width: fit-content;
    margin-bottom: 15px;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.sts-service-six-content h2 {
    margin: 0 0 16px;
    color: var(--ink);
    font-size: clamp(25px, 2vw, 33px);
    line-height: 1.08;
    letter-spacing: -.03em;
}

.sts-service-six-content > p {
    margin: 0 0 22px;
    color: var(--text);
    font-size: 15px;
    line-height: 1.65;
}

.sts-service-six-content ul {
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

.sts-service-six-content li {
    position: relative;
    margin: 9px 0;
    padding-left: 23px;
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
}

.sts-service-six-content li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--green);
    font-weight: 900;
}

.sts-service-six-content .sts-btn {
    margin-top: auto;
    align-self: flex-start;
}

@media (hover: hover) and (pointer: fine) {
    .sts-service-six-card:hover {
        transform: translateY(-8px);
        border-color: rgba(5, 137, 214, .28);
        box-shadow: 0 22px 48px rgba(3, 38, 56, .14);
    }

    .sts-service-six-card:hover .sts-service-six-image img {
        transform: scale(1.045);
    }
}

@media (max-width: 1050px) {
    .sts-services-six-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px;
    }
}

@media (max-width: 680px) {
    .sts-services-six-grid {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-top: 40px;
    }

    .sts-service-six-image {
        height: 240px;
    }

    .sts-service-six-content {
        padding: 25px 22px;
    }

    .sts-service-six-content h2 {
        font-size: 28px;
    }

    .sts-service-six-content .sts-btn {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 420px) {
    .sts-service-six-image {
        height: 215px;
    }

    .sts-service-six-content {
        padding: 23px 19px;
    }
}


/* =========================================================
   V24 — FOOTER LOGO + FACEBOOK
   ========================================================= */

.sts-footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.sts-footer-logo-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 0 0 24px;
    text-decoration: none !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

.sts-footer-logo-link::before,
.sts-footer-logo-link::after {
    display: none !important;
    content: none !important;
}

.sts-footer-logo-link:hover,
.sts-footer-logo-link:focus,
.sts-footer-logo-link:active {
    transform: none !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.sts-footer-full-logo {
    display: block;
    width: min(100%, 350px) !important;
    max-width: 350px !important;
    height: auto !important;
    object-fit: contain;
}

.sts-footer-brand > p {
    max-width: 390px;
    margin: 0 auto 22px;
}

.sts-social-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.sts-social-link {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(0, 149, 229, .46);
    background: rgba(1, 31, 42, .72);
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .10);
    transition:
        transform .22s ease,
        background-color .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.sts-social-link svg {
    width: 20px;
    height: 20px;
    display: block;
    fill: currentColor;
}

@media (hover:hover) and (pointer:fine) {
    .sts-social-facebook:hover {
        transform: translateY(-4px) scale(1.05);
        background: #0b86d1;
        border-color: #0b86d1;
        box-shadow: 0 14px 28px rgba(11, 134, 209, .28);
    }
}

.sts-social-link:focus-visible {
    outline: 3px solid rgba(34, 189, 79, .45);
    outline-offset: 3px;
}

@media (min-width: 1440px) {
    .sts-footer-full-logo {
        width: min(100%, 420px) !important;
        max-width: 420px !important;
    }
}

@media (max-width: 1100px) {
    .sts-footer-full-logo {
        width: min(100%, 330px) !important;
        max-width: 330px !important;
    }
}

@media (max-width: 760px) {
    .sts-footer-full-logo {
        width: min(100%, 300px) !important;
        max-width: 300px !important;
    }
}

@media (max-width: 480px) {
    .sts-footer-full-logo {
        width: min(100%, 270px) !important;
        max-width: 270px !important;
    }

    .sts-social-link {
        width: 46px;
        height: 46px;
    }

    .sts-social-link svg {
        width: 22px;
        height: 22px;
    }
}


/* =========================================================
   V25 — BALANCED FOOTER LOGO + SOCIAL PLACEHOLDERS
   ========================================================= */

/*
 * Override V24's oversized footer logo.
 * Large enough to be clear, but keeps the footer compact.
 */
.sts-footer-brand {
    justify-content: flex-start;
}

.sts-footer-logo-link {
    margin-bottom: 18px !important;
}

.sts-footer-full-logo {
    width: 210px !important;
    max-width: 210px !important;
    height: auto !important;
}

.sts-footer-brand > p {
    max-width: 340px !important;
    margin: 0 auto 18px !important;
    line-height: 1.55;
}

/* Keep the first footer column vertically tidy */
.sts-footer-grid {
    align-items: start;
}

/* Social button row */
.sts-social-row {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 2px;
}

.sts-social-link {
    appearance: none;
    -webkit-appearance: none;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    border: 1px solid rgba(0, 149, 229, .48);
    border-radius: 999px;
    background: rgba(1, 31, 42, .86);
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none !important;
    box-shadow: 0 5px 16px rgba(0, 0, 0, .12);
    transition:
        transform .22s ease,
        background-color .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        color .22s ease;
}

.sts-social-link svg {
    width: 18px;
    height: 18px;
    display: block;
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 1.7;
}

.sts-social-facebook svg {
    stroke: none;
}

/* Placeholder icons are intentionally non-link buttons for now */
.sts-social-placeholder {
    opacity: .82;
}

@media (hover:hover) and (pointer:fine) {
    .sts-social-link:hover {
        transform: translateY(-4px);
        border-color: #0b86d1;
        background: #0b86d1;
        color: #fff !important;
        box-shadow: 0 12px 24px rgba(11, 134, 209, .24);
    }

    .sts-social-placeholder:hover {
        opacity: 1;
        background: #169d48;
        border-color: #169d48;
        box-shadow: 0 12px 24px rgba(22, 157, 72, .22);
    }
}

.sts-social-link:focus-visible {
    outline: 3px solid rgba(34, 189, 79, .42);
    outline-offset: 3px;
}

/* Large desktop: only a small bump, not huge */
@media (min-width: 1440px) {
    .sts-footer-full-logo {
        width: 235px !important;
        max-width: 235px !important;
    }
}

/* Tablet */
@media (max-width: 900px) {
    .sts-footer-full-logo {
        width: 205px !important;
        max-width: 205px !important;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .sts-footer-full-logo {
        width: 190px !important;
        max-width: 190px !important;
    }

    .sts-footer-brand > p {
        max-width: 320px !important;
    }

    .sts-social-link {
        width: 42px;
        height: 42px;
    }
}


/* =========================================================
   V26 — COMMERCIAL FOOTER
   Logo gets its own column.
   Separate Services / Company / Service Area / Contact /
   Socials columns.
   ========================================================= */

.sts-footer-commercial-grid {
    display: grid;
    grid-template-columns:
        minmax(230px, 1.35fr)
        minmax(150px, .9fr)
        minmax(135px, .8fr)
        minmax(180px, 1fr)
        minmax(210px, 1.05fr)
        minmax(180px, .95fr);

    gap: 34px;

    align-items: start;

    padding-top: 58px;
    padding-bottom: 50px;
}


/* -----------------------------
   LOGO COLUMN
   ----------------------------- */

.sts-footer-logo-column {
    min-width: 0;

    padding-right: 30px;

    border-right:
        1px solid rgba(255,255,255,.10);
}


.sts-footer-logo-link {
    display: block;

    width: fit-content;

    margin: 0 0 22px !important;

    border: 0 !important;

    text-decoration: none !important;

    box-shadow: none !important;

    transform: none !important;
}


.sts-footer-logo-link:hover,
.sts-footer-logo-link:focus,
.sts-footer-logo-link:active {
    border: 0 !important;

    text-decoration: none !important;

    box-shadow: none !important;

    transform: none !important;
}


.sts-footer-logo-link::before,
.sts-footer-logo-link::after {
    display: none !important;

    content: none !important;
}


.sts-footer-commercial-logo {
    display: block;

    width: 205px;

    max-width: 100%;

    height: auto;

    object-fit: contain;
}


.sts-footer-brand-copy {
    max-width: 300px;

    margin: 0;

    color: rgba(255,255,255,.80);

    font-size: 14px;

    line-height: 1.65;
}


/* -----------------------------
   STANDARD COLUMNS
   ----------------------------- */

.sts-footer-commercial-grid .sts-footer-column {
    min-width: 0;
}


.sts-footer-commercial-grid .sts-footer-column:not(:last-child) {
    padding-right: 24px;

    border-right:
        1px solid rgba(255,255,255,.10);
}


.sts-footer-commercial-grid .sts-footer-column h3 {
    margin: 0 0 18px;

    font-size: 12px;

    font-weight: 900;

    letter-spacing: .08em;

    text-transform: uppercase;
}


.sts-footer-commercial-grid .sts-footer-column > a {
    display: block;

    width: fit-content;

    margin: 0 0 10px;

    color: rgba(255,255,255,.92);

    font-size: 14px;

    line-height: 1.4;

    text-decoration: none;

    transition:
        color .2s ease,
        transform .2s ease;
}


.sts-footer-commercial-grid .sts-footer-column > a:hover {
    color: #fff;

    transform: translateX(3px);
}


.sts-footer-commercial-grid .sts-footer-column p {
    color: rgba(255,255,255,.78);

    font-size: 14px;

    line-height: 1.55;
}


/* -----------------------------
   SERVICE AREA
   ----------------------------- */

.sts-footer-detail-line {
    display: flex;

    gap: 9px;

    align-items: flex-start;

    margin-top: 0;
}


.sts-footer-detail-icon {
    color: #ef476f;

    font-size: 11px;

    line-height: 1.8;
}


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

.sts-footer-contact-link {
    display: flex !important;

    align-items: center;

    gap: 8px;
}


.sts-footer-contact-icon {
    width: 17px;

    color: #20a9e8;

    text-align: center;
}


.sts-footer-hours {
    margin: 22px 0 4px !important;
}


.sts-footer-hours strong {
    display: inline-block;

    margin-bottom: 5px;

    color: #fff;

    font-size: 12px;

    letter-spacing: .07em;

    text-transform: uppercase;
}


.sts-footer-emergency {
    margin-top: 4px !important;

    color: #37d35c !important;

    font-size: 13px !important;

    font-weight: 800;
}


/* -----------------------------
   SOCIALS COLUMN
   ----------------------------- */

.sts-footer-social-column > p {
    margin: -2px 0 18px;
}


.sts-footer-social-stack {
    display: flex;

    flex-direction: column;

    gap: 10px;
}


.sts-footer-social-button {
    appearance: none;
    -webkit-appearance: none;

    width: 100%;

    min-height: 44px;

    padding: 10px 14px;

    display: flex;

    align-items: center;

    gap: 10px;

    border:
        1px solid rgba(255,255,255,.18);

    border-radius: 10px;

    background:
        rgba(255,255,255,.045);

    color: #fff !important;

    font-family: inherit;

    font-size: 13px;

    font-weight: 800;

    line-height: 1;

    text-decoration: none !important;

    cursor: pointer;

    transition:
        transform .2s ease,
        background-color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}


.sts-footer-social-icon {
    width: 24px;
    height: 24px;

    flex: 0 0 24px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 6px;

    background:
        rgba(0,149,229,.14);

    color: #3ab8f2;
}


.sts-footer-social-icon svg {
    width: 15px;
    height: 15px;

    display: block;

    fill: currentColor;

    stroke: currentColor;

    stroke-width: 1.5;
}


.sts-footer-facebook .sts-footer-social-icon svg {
    stroke: none;
}


.sts-footer-google-icon {
    font-size: 14px;

    font-weight: 900;
}


@media (hover:hover) and (pointer:fine) {

    .sts-footer-social-button:hover {
        transform:
            translateY(-3px);

        border-color:
            rgba(32,169,232,.65);

        background:
            rgba(32,169,232,.12);

        box-shadow:
            0 10px 22px
            rgba(0,0,0,.14);
    }


    .sts-footer-social-placeholder:hover {
        border-color:
            rgba(55,211,92,.55);

        background:
            rgba(55,211,92,.10);
    }

}


/* -----------------------------
   BOTTOM BAR
   ----------------------------- */

.sts-footer-bottom {
    margin-top: 0 !important;

    padding-top: 20px;
    padding-bottom: 22px;

    border-top:
        1px solid rgba(255,255,255,.10);
}


/* =========================================================
   RESPONSIVE FOOTER
   ========================================================= */

@media (max-width: 1320px) {

    .sts-footer-commercial-grid {
        grid-template-columns:
            1.25fr
            .9fr
            .8fr
            1fr
            1fr;

        gap: 28px;
    }


    .sts-footer-social-column {
        grid-column:
            2 / -1;

        padding-top: 8px;

        border-right: 0 !important;
    }


    .sts-footer-social-stack {
        flex-direction: row;

        flex-wrap: wrap;
    }


    .sts-footer-social-button {
        width: auto;

        min-width: 150px;
    }

}


@media (max-width: 980px) {

    .sts-footer-commercial-grid {
        grid-template-columns:
            repeat(2, minmax(0,1fr));

        gap: 36px 30px;
    }


    .sts-footer-logo-column {
        grid-column: 1 / -1;

        display: grid;

        grid-template-columns:
            auto minmax(0,1fr);

        gap: 28px;

        align-items: center;

        padding-right: 0;
        padding-bottom: 30px;

        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,.10);
    }


    .sts-footer-logo-link {
        margin-bottom: 0 !important;
    }


    .sts-footer-commercial-logo {
        width: 185px;
    }


    .sts-footer-brand-copy {
        max-width: 430px;
    }


    .sts-footer-commercial-grid
    .sts-footer-column:not(:last-child) {
        border-right: 0;

        padding-right: 0;
    }


    .sts-footer-social-column {
        grid-column: auto;
    }


    .sts-footer-social-stack {
        flex-direction: column;
    }


    .sts-footer-social-button {
        width: 100%;

        min-width: 0;
    }

}


@media (max-width: 620px) {

    .sts-footer-commercial-grid {
        grid-template-columns: 1fr;

        gap: 30px;

        padding-top: 42px;
        padding-bottom: 34px;
    }


    .sts-footer-logo-column {
        grid-column: auto;

        display: flex;

        flex-direction: column;

        align-items: flex-start;

        gap: 0;

        padding-bottom: 26px;
    }


    .sts-footer-commercial-logo {
        width: 175px;
    }


    .sts-footer-brand-copy {
        max-width: 100%;

        margin-top: 18px;
    }


    .sts-footer-social-column {
        grid-column: auto;
    }


    .sts-footer-bottom {
        flex-direction: column;

        gap: 12px;

        align-items: flex-start;
    }

}


/* =========================================================
   V27 — FOOTER POLISH
   - Center brand description under logo
   - Facebook + Google only
   - Branded social hovers
   - Footer navigation hover underline / slide
   ========================================================= */

/* Brand column: keep logo left-column, but center copy beneath it */
.sts-footer-logo-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.sts-footer-logo-link {
    margin-left: auto !important;
    margin-right: auto !important;
}

.sts-footer-brand-copy {
    max-width: 300px;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center;
}

/* Standard footer links: subtle line grow + slight slide */
.sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-button) {
    position: relative;
    padding-bottom: 3px;
    transform: translateX(0);
    transition:
        color .2s ease,
        transform .2s ease;
}

.sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-button)::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #19b34a, #0b86d1);
    transition: width .22s ease;
}

@media (hover:hover) and (pointer:fine) {
    .sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-button):hover {
        color: #fff;
        transform: translateX(4px);
    }

    .sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-button):hover::after {
        width: 100%;
    }
}

/* Social buttons */
.sts-footer-social-stack {
    gap: 12px;
}

.sts-footer-social-button {
    position: relative;
    overflow: hidden;
    min-height: 48px;
    padding: 11px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.045);
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.10);
}

.sts-footer-social-button::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .22s ease;
    pointer-events: none;
}

.sts-footer-social-button > * {
    position: relative;
    z-index: 1;
}

.sts-footer-social-arrow {
    margin-left: auto;
    font-size: 17px;
    line-height: 1;
    transform: translateX(0);
    transition: transform .22s ease;
}

.sts-footer-social-icon {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
    border-radius: 7px;
    transition:
        background-color .22s ease,
        color .22s ease,
        transform .22s ease;
}

/* Facebook */
.sts-footer-facebook {
    border-color: rgba(24,119,242,.36);
}

.sts-footer-facebook .sts-footer-social-icon {
    background: rgba(24,119,242,.15);
    color: #5aa5ff;
}

.sts-footer-facebook::before {
    background: linear-gradient(135deg, #1877F2, #0f5fc7);
}

/* Google */
.sts-footer-google {
    border-color: rgba(66,133,244,.34);
}

.sts-footer-google .sts-footer-social-icon {
    background: rgba(66,133,244,.13);
    color: #8ab4f8;
    font-weight: 900;
}

.sts-footer-google::before {
    background:
        linear-gradient(
            135deg,
            #4285F4 0%,
            #4285F4 32%,
            #34A853 32%,
            #34A853 56%,
            #FBBC05 56%,
            #FBBC05 78%,
            #EA4335 78%,
            #EA4335 100%
        );
}

@media (hover:hover) and (pointer:fine) {
    .sts-footer-facebook:hover,
    .sts-footer-google:hover {
        transform: translateY(-4px);
        color: #fff !important;
        border-color: rgba(255,255,255,.28);
        box-shadow: 0 16px 30px rgba(0,0,0,.20);
    }

    .sts-footer-facebook:hover::before,
    .sts-footer-google:hover::before {
        opacity: 1;
    }

    .sts-footer-facebook:hover .sts-footer-social-icon,
    .sts-footer-google:hover .sts-footer-social-icon {
        background: rgba(255,255,255,.18);
        color: #fff;
        transform: scale(1.06);
    }

    .sts-footer-facebook:hover .sts-footer-social-arrow,
    .sts-footer-google:hover .sts-footer-social-arrow {
        transform: translateX(4px);
    }
}

.sts-footer-social-button:focus-visible {
    outline: 3px solid rgba(255,255,255,.32);
    outline-offset: 3px;
}

/* Do not let legacy placeholder styles affect these real links */
.sts-footer-social-placeholder {
    display: none !important;
}

@media (max-width: 620px) {
    .sts-footer-logo-column {
        align-items: center !important;
        text-align: center !important;
    }

    .sts-footer-brand-copy {
        text-align: center !important;
    }
}


/* =========================================================
   V28 — CIRCULAR SOCIAL ICONS + RED EMERGENCY TEXT
   ========================================================= */

/* Hide the old full-width social button styling */
.sts-footer-social-stack.sts-footer-social-circles {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.sts-footer-social-circle {
    width: 44px;
    height: 44px;

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

    flex: 0 0 44px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.18);

    background: rgba(255,255,255,.045);

    color: #fff !important;

    text-decoration: none !important;

    box-shadow: 0 8px 20px rgba(0,0,0,.12);

    transition:
        transform .22s ease,
        background .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.sts-footer-social-circle svg {
    width: 19px;
    height: 19px;
    display: block;
    fill: currentColor;
}

.sts-footer-social-circle span {
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
}

/* Facebook default */
.sts-footer-social-circle.sts-footer-facebook {
    color: #5aa5ff !important;
    border-color: rgba(24,119,242,.42);
    background: rgba(24,119,242,.10);
}

/* Google default */
.sts-footer-social-circle.sts-footer-google {
    color: #8ab4f8 !important;
    border-color: rgba(66,133,244,.38);
    background: rgba(66,133,244,.09);
}

@media (hover:hover) and (pointer:fine) {

    .sts-footer-social-circle:hover {
        transform: translateY(-4px) scale(1.05);
    }

    .sts-footer-social-circle.sts-footer-facebook:hover {
        color: #fff !important;
        background: #1877F2;
        border-color: #1877F2;
        box-shadow: 0 14px 28px rgba(24,119,242,.30);
    }

    .sts-footer-social-circle.sts-footer-google:hover {
        color: #fff !important;
        border-color: rgba(255,255,255,.25);

        background:
            linear-gradient(
                135deg,
                #4285F4 0%,
                #4285F4 30%,
                #34A853 30%,
                #34A853 55%,
                #FBBC05 55%,
                #FBBC05 76%,
                #EA4335 76%,
                #EA4335 100%
            );

        box-shadow: 0 14px 28px rgba(66,133,244,.24);
    }
}

.sts-footer-social-circle:focus-visible {
    outline: 3px solid rgba(255,255,255,.30);
    outline-offset: 3px;
}

/* Emergency service should read as important / urgent */
.sts-footer-emergency {
    color: #ff5a5f !important;
    font-weight: 900 !important;
}

/* Prevent older social button rules from stretching the circles */
.sts-footer-social-circles .sts-footer-social-button,
.sts-footer-social-circles .sts-footer-social-placeholder {
    display: none !important;
}

@media (max-width: 620px) {
    .sts-footer-social-stack.sts-footer-social-circles {
        justify-content: flex-start;
    }

    .sts-footer-social-circle {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }
}


/* =========================================================
   V29 — OWNER SERVICE CONTENT + FOOTER REFINEMENT
   ========================================================= */

/* ---------------------------------------------------------
   SERVICES — 3 x 3 DESKTOP CARD GRID
   --------------------------------------------------------- */

.sts-owner-services-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.sts-owner-service-card {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    background: #fff;
    border: 1px solid #dfeaf0;
    box-shadow: 0 12px 30px rgba(5,38,56,.10);
    transition:
        transform .24s ease,
        box-shadow .24s ease,
        border-color .24s ease;
}

.sts-owner-service-card:nth-child(odd) {
    border-top: 5px solid var(--green);
}

.sts-owner-service-card:nth-child(even) {
    border-top: 5px solid var(--blue);
}

.sts-owner-service-image {
    height: 250px;
    overflow: hidden;
    background: #eaf2f5;
}

.sts-owner-service-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 35%;
    transition: transform .35s ease;
}

.sts-owner-service-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 30px;
}

.sts-owner-service-content .sts-service-number {
    margin-bottom: 12px;
}

.sts-owner-service-content h2 {
    margin: 0 0 16px;
    color: var(--ink);
    font-size: clamp(27px, 2vw, 34px);
    line-height: 1.06;
    letter-spacing: -.025em;
}

.sts-owner-service-content > p {
    margin: 0 0 20px;
    color: var(--text);
    font-size: 16px;
    line-height: 1.65;
}

.sts-owner-service-content ul {
    margin: 0 0 28px;
    padding-left: 20px;
    color: var(--text);
    font-size: 15px;
    line-height: 1.7;
}

.sts-owner-service-content li + li {
    margin-top: 5px;
}

.sts-owner-service-content .sts-btn {
    margin-top: auto;
    align-self: flex-start;
}

@media (hover:hover) and (pointer:fine) {
    .sts-owner-service-card:hover {
        transform: translateY(-8px);
        border-color: rgba(5,137,214,.28);
        box-shadow: 0 22px 48px rgba(5,38,56,.16);
    }

    .sts-owner-service-card:hover .sts-owner-service-image img {
        transform: scale(1.045);
    }
}

@media (max-width: 1100px) {
    .sts-owner-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .sts-owner-services-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .sts-owner-service-image {
        height: 230px;
    }

    .sts-owner-service-content {
        padding: 25px 22px;
    }

    .sts-owner-service-content h2 {
        font-size: 29px;
    }

    .sts-owner-service-content .sts-btn {
        width: 100%;
    }
}


/* ---------------------------------------------------------
   FOOTER — TIGHTER BRAND LOCKUP
   --------------------------------------------------------- */

.sts-footer-logo-column {
    gap: 0 !important;
    justify-content: flex-start;
}

.sts-footer-logo-link {
    margin: 0 auto 6px !important;
}

.sts-footer-commercial-logo {
    margin: 0 auto !important;
}

.sts-footer-brand-copy {
    max-width: 300px;
    margin: 4px auto 0 !important;
    text-align: center;
}


/* ---------------------------------------------------------
   FOOTER — SERVICE LINKS
   --------------------------------------------------------- */

.sts-footer-services-column > a {
    margin-bottom: 7px !important;
}


/* ---------------------------------------------------------
   FOOTER — EMERGENCY
   --------------------------------------------------------- */

.sts-footer-emergency {
    color: #ff5a5f !important;
    font-weight: 900 !important;
}


/* ---------------------------------------------------------
   FOOTER — CIRCULAR FACEBOOK + GOOGLE
   --------------------------------------------------------- */

.sts-footer-social-stack.sts-footer-social-circles {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.sts-footer-social-circle {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.12);
    transition:
        transform .22s ease,
        background-color .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.sts-footer-social-circle svg {
    width: 19px;
    height: 19px;
    display: block;
    fill: currentColor;
}

/* Facebook */
.sts-footer-social-circle.sts-footer-facebook {
    color: #5aa5ff !important;
    border: 1px solid rgba(24,119,242,.42);
    background: rgba(24,119,242,.10);
}

/* Google: dark circle + recognizable multi-colour G only */
.sts-footer-social-circle.sts-footer-google {
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.045);
}

.sts-google-g {
    display: inline-block;
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
    background:
        linear-gradient(
            90deg,
            #4285F4 0%,
            #4285F4 25%,
            #EA4335 25%,
            #EA4335 50%,
            #FBBC05 50%,
            #FBBC05 75%,
            #34A853 75%,
            #34A853 100%
        );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

@media (hover:hover) and (pointer:fine) {
    .sts-footer-social-circle:hover {
        transform: translateY(-4px) scale(1.05);
    }

    .sts-footer-social-circle.sts-footer-facebook:hover {
        color: #fff !important;
        background: #1877F2;
        border-color: #1877F2;
        box-shadow: 0 14px 28px rgba(24,119,242,.30);
    }

    .sts-footer-social-circle.sts-footer-google:hover {
        background: rgba(66,133,244,.12);
        border-color: #4285F4;
        box-shadow: 0 14px 28px rgba(66,133,244,.28);
    }
}

.sts-footer-social-circle:focus-visible {
    outline: 3px solid rgba(255,255,255,.30);
    outline-offset: 3px;
}


/* ---------------------------------------------------------
   FOOTER — LINK HOVERS
   --------------------------------------------------------- */

.sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-circle) {
    position: relative;
    padding-bottom: 3px;
    transition:
        color .2s ease,
        transform .2s ease;
}

.sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-circle)::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--green-2), var(--blue-2));
    transition: width .22s ease;
}

@media (hover:hover) and (pointer:fine) {
    .sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-circle):hover {
        color: #fff;
        transform: translateX(4px);
    }

    .sts-footer-commercial-grid .sts-footer-column > a:not(.sts-footer-social-circle):hover::after {
        width: 100%;
    }
}


/* ---------------------------------------------------------
   FOOTER — RESPONSIVE SAFETY
   --------------------------------------------------------- */

@media (max-width: 980px) {
    .sts-footer-logo-column {
        align-items: center !important;
        text-align: center !important;
    }

    .sts-footer-brand-copy {
        text-align: center !important;
    }
}

@media (max-width: 620px) {
    .sts-footer-social-stack.sts-footer-social-circles {
        justify-content: flex-start;
    }

    .sts-footer-social-circle {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }
}


/* =========================================================
   V30 — FLIP SERVICE CARDS + SOLID BLUE GOOGLE BUTTON
   ========================================================= */


/* ---------------------------------------------------------
   GOOGLE — RESTORED TO SOLID GOOGLE BLUE
   --------------------------------------------------------- */

.sts-footer-social-circle.sts-footer-google {
    color: #4285F4 !important;
    border-color: rgba(66,133,244,.45) !important;
    background: rgba(66,133,244,.10) !important;
}

.sts-footer-social-circle.sts-footer-google .sts-google-g {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: currentColor !important;
    color: #4285F4 !important;
}

@media (hover:hover) and (pointer:fine) {
    .sts-footer-social-circle.sts-footer-google:hover {
        color: #fff !important;
        background: #4285F4 !important;
        border-color: #4285F4 !important;
        box-shadow: 0 14px 28px rgba(66,133,244,.30) !important;
        transform: translateY(-4px) scale(1.05);
    }

    .sts-footer-social-circle.sts-footer-google:hover .sts-google-g {
        color: #fff !important;
        -webkit-text-fill-color: #fff !important;
    }
}


/* ---------------------------------------------------------
   FLIP SERVICE GRID
   --------------------------------------------------------- */

.sts-flip-services-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    align-items: stretch;
}


/* Card shell */
.sts-flip-service-card {
    position: relative;
    min-width: 0;
    min-height: 650px;
    perspective: 1500px;
    cursor: pointer;
    outline: none;
}

.sts-flip-service-inner {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 650px;
    transform-style: preserve-3d;
    transition: transform .68s cubic-bezier(.2,.75,.25,1);
}

.sts-flip-service-card.is-flipped .sts-flip-service-inner {
    transform: rotateY(180deg);
}


/* Both faces */
.sts-flip-service-face {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 650px;
    overflow: hidden;

    border-radius: 22px;
    border: 1px solid #dce9ef;
    background: #fff;
    box-shadow: 0 14px 34px rgba(5,38,56,.11);

    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;

    transition:
        box-shadow .25s ease,
        border-color .25s ease;
}


/* Alternate blue / green accent */
.sts-flip-service-card:nth-child(odd) .sts-flip-service-face {
    border-top: 5px solid var(--green);
}

.sts-flip-service-card:nth-child(even) .sts-flip-service-face {
    border-top: 5px solid var(--blue);
}


/* FRONT */
.sts-flip-service-front {
    display: flex;
    flex-direction: column;
}

.sts-flip-service-image {
    height: 315px;
    overflow: hidden;
    background: #eaf2f5;
}

.sts-flip-service-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transition: transform .4s ease;
}

.sts-flip-service-front-copy {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 30px;
}

.sts-flip-service-front-copy .sts-service-number {
    margin-bottom: 12px;
}

.sts-flip-service-front-copy h2,
.sts-flip-service-back h2 {
    margin: 0 0 15px;
    color: var(--ink);
    font-size: clamp(27px, 2vw, 34px);
    line-height: 1.06;
    letter-spacing: -.025em;
}

.sts-flip-service-front-copy > p {
    margin: 0;
    color: var(--text);
    font-size: 16px;
    line-height: 1.65;
}

.sts-flip-hint {
    margin-top: auto;
    padding-top: 24px;

    display: inline-flex;
    align-items: center;
    gap: 8px;

    color: var(--blue);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sts-flip-service-card:nth-child(odd) .sts-flip-hint {
    color: var(--green);
}

.sts-flip-hint span {
    display: inline-block;
    font-size: 18px;
    transition: transform .25s ease;
}


/* BACK */
.sts-flip-service-back {
    padding: 30px;
    display: flex;
    flex-direction: column;

    transform: rotateY(180deg);

    background:
        radial-gradient(circle at 100% 0%, rgba(5,137,214,.10), transparent 32%),
        radial-gradient(circle at 0% 100%, rgba(22,157,72,.08), transparent 30%),
        #fff;
}

.sts-flip-service-back-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-bottom: 15px;
}

.sts-flip-back-label {
    padding: 7px 10px;
    border-radius: 999px;
    background: #eef7fb;
    color: var(--blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.sts-flip-service-back > p {
    margin: 0 0 22px;
    color: var(--text);
    font-size: 15px;
    line-height: 1.6;
}

.sts-flip-service-back h3 {
    margin: 0 0 11px;
    color: var(--ink);
    font-size: 16px;
    line-height: 1.2;
}

.sts-flip-service-back ul {
    margin: 0;
    padding-left: 20px;
    color: var(--text);
    font-size: 14px;
    line-height: 1.5;
}

.sts-flip-service-back li + li {
    margin-top: 5px;
}

.sts-flip-service-back-actions {
    margin-top: auto;
    padding-top: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.sts-flip-service-back-actions .sts-btn {
    flex: 0 0 auto;
}

.sts-flip-hint-back {
    margin-top: 0;
    padding-top: 0;
    white-space: nowrap;
}


/* Hover + keyboard */
@media (hover:hover) and (pointer:fine) {
    .sts-flip-service-card:not(.is-flipped):hover .sts-flip-service-face {
        border-color: rgba(5,137,214,.35);
        box-shadow: 0 24px 48px rgba(5,38,56,.17);
    }

    .sts-flip-service-card:not(.is-flipped):hover .sts-flip-service-image img {
        transform: scale(1.05);
    }

    .sts-flip-service-card:hover .sts-flip-hint span {
        transform: rotate(90deg);
    }
}

.sts-flip-service-card:focus-visible .sts-flip-service-face {
    outline: 4px solid rgba(5,137,214,.28);
    outline-offset: 4px;
}


/* ---------------------------------------------------------
   FLIP CARD RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1180px) {
    .sts-flip-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .sts-flip-services-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 630px;
    }

    .sts-flip-service-image {
        height: 280px;
    }
}

@media (max-width: 520px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 670px;
    }

    .sts-flip-service-image {
        height: 245px;
    }

    .sts-flip-service-front-copy,
    .sts-flip-service-back {
        padding: 24px 21px;
    }

    .sts-flip-service-front-copy h2,
    .sts-flip-service-back h2 {
        font-size: 28px;
    }

    .sts-flip-service-back-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .sts-flip-service-back-actions .sts-btn {
        width: 100%;
    }

    .sts-flip-hint-back {
        justify-content: center;
    }
}


/* Respect users who request less motion */
@media (prefers-reduced-motion: reduce) {
    .sts-flip-service-inner {
        transition: none;
    }

    .sts-flip-service-image img,
    .sts-flip-hint span {
        transition: none;
    }
}


/* =========================================================
   V31 — SERVICE CPT + SINGLE SERVICE PAGE
   ========================================================= */


/* Back-of-card links */
.sts-service-card-estimate {
    color: var(--blue);
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
}

.sts-service-card-estimate:hover {
    color: var(--green);
}


/* =========================================================
   SINGLE SERVICE HERO
   ========================================================= */

.sts-single-service-hero {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    background: var(--navy);
}

.sts-single-service-photo {
    position: absolute;
    inset: 0;
    background-position: center;
    background-size: cover;
    transform: scale(1.01);
}

.sts-single-service-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(1,37,53,.98) 0%,
            rgba(1,37,53,.92) 36%,
            rgba(1,37,53,.60) 62%,
            rgba(1,37,53,.18) 100%
        );
}

.sts-single-service-hero-inner {
    position: relative;
    z-index: 2;
    min-height: 560px;
    display: flex;
    align-items: center;
}

.sts-single-service-hero-copy {
    max-width: 760px;
    padding: 80px 0;
    color: #fff;
}

.sts-service-back-link {
    display: inline-block;
    margin-bottom: 28px;
    color: rgba(255,255,255,.76);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.sts-service-back-link:hover {
    color: #fff;
}

.sts-single-service-hero h1 {
    max-width: 820px;
    margin: 10px 0 22px;
    color: #fff;
    font-size: clamp(48px, 6vw, 82px);
    line-height: .98;
    letter-spacing: -.04em;
}

.sts-single-service-hero-copy > p:not(.sts-page-kicker) {
    max-width: 680px;
    margin: 0;
    color: rgba(255,255,255,.86);
    font-size: 19px;
    line-height: 1.65;
}

.sts-single-service-hero-actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 32px;
}


/* =========================================================
   SINGLE SERVICE BODY
   ========================================================= */

.sts-single-service-grid {
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(320px,.65fr);
    gap: 70px;
    align-items: start;
}

.sts-single-service-main h2,
.sts-single-service-benefits h2 {
    margin-top: 0;
    color: var(--ink);
}

.sts-single-service-editor {
    color: var(--text);
    font-size: 18px;
    line-height: 1.8;
}

.sts-single-service-editor p:first-child {
    margin-top: 0;
}

.sts-single-service-benefits {
    position: sticky;
    top: 130px;
    padding: 34px;
    border-radius: 22px;
    border: 1px solid #dce9ef;
    background:
        linear-gradient(145deg, rgba(5,137,214,.05), rgba(22,157,72,.05)),
        #fff;
    box-shadow: 0 14px 34px rgba(5,38,56,.10);
}

.sts-single-service-benefits ul {
    display: grid;
    gap: 13px;
    margin: 26px 0 30px;
    padding: 0;
    list-style: none;
}

.sts-single-service-benefits li {
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 10px;
    align-items: start;
    color: var(--text);
    line-height: 1.55;
}

.sts-single-service-benefits li span {
    color: var(--green);
    font-weight: 900;
}


/* =========================================================
   RELATED SERVICES
   ========================================================= */

.sts-single-related-services {
    padding: 90px 0;
    background: #f3f8fb;
}

.sts-related-service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 26px;
    margin-top: 36px;
}

.sts-related-service-card {
    overflow: hidden;
    border-radius: 18px;
    background: #fff;
    border: 1px solid #dce9ef;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(5,38,56,.08);
    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.sts-related-service-image {
    height: 220px;
    overflow: hidden;
}

.sts-related-service-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .35s ease;
}

.sts-related-service-copy {
    padding: 25px;
}

.sts-related-service-copy h3 {
    margin: 0 0 10px;
    color: var(--ink);
    font-size: 25px;
}

.sts-related-service-copy p {
    color: var(--text);
    line-height: 1.6;
}

.sts-related-service-copy span {
    color: var(--blue);
    font-weight: 900;
}

@media (hover:hover) and (pointer:fine) {
    .sts-related-service-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 20px 40px rgba(5,38,56,.14);
    }

    .sts-related-service-card:hover img {
        transform: scale(1.05);
    }
}


/* =========================================================
   SINGLE SERVICE RESPONSIVE
   ========================================================= */

@media (max-width: 980px) {
    .sts-single-service-grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .sts-single-service-benefits {
        position: static;
    }

    .sts-related-service-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 680px) {
    .sts-single-service-hero,
    .sts-single-service-hero-inner {
        min-height: 520px;
    }

    .sts-single-service-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(1,37,53,.97),
                rgba(1,37,53,.84)
            );
    }

    .sts-single-service-hero-copy {
        padding: 65px 0;
    }

    .sts-single-service-hero h1 {
        font-size: clamp(42px, 13vw, 62px);
    }

    .sts-single-service-hero-copy > p:not(.sts-page-kicker) {
        font-size: 17px;
    }

    .sts-single-service-hero-actions .sts-btn {
        width: 100%;
    }

    .sts-single-service-benefits {
        padding: 27px 22px;
    }

    .sts-related-service-grid {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   V33 — SERVICE FLIP CARD FIT + CLEAN ACTIONS
   ========================================================= */

/*
 * The back of the service cards contains substantially more copy than
 * the front. Give every card enough room so the content and controls
 * stay inside the rounded card instead of running through the bottom.
 */
.sts-flip-service-card,
.sts-flip-service-inner,
.sts-flip-service-face {
    min-height: 760px !important;
}

.sts-flip-service-back {
    padding: 28px !important;
}

.sts-flip-service-back > p {
    margin-bottom: 18px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.sts-flip-service-back h2 {
    margin-bottom: 14px !important;
    font-size: clamp(25px, 1.8vw, 32px) !important;
}

.sts-flip-service-back h3 {
    margin: 0 0 9px !important;
}

.sts-flip-service-back ul {
    font-size: 13.5px !important;
    line-height: 1.45 !important;
}

.sts-flip-service-back li + li {
    margin-top: 4px !important;
}

/*
 * Only two actions now:
 * 1. Full Service Page
 * 2. Flip Back
 *
 * Request Estimate has intentionally been removed from the service cards.
 */
.sts-flip-service-back-actions-single {
    margin-top: auto !important;
    padding-top: 20px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;

    border-top: 1px solid rgba(1, 37, 53, .08);
}

.sts-full-service-button {
    flex: 0 1 auto;
    min-width: 0;
    white-space: nowrap;
}

.sts-flip-back-button {
    appearance: none;
    border: 0;
    padding: 10px 4px;
    margin: 0;
    background: transparent;
    color: var(--blue);
    cursor: pointer;

    font: inherit;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .06em;
    text-transform: uppercase;

    transition:
        color .2s ease,
        transform .2s ease;
}

@media (hover:hover) and (pointer:fine) {
    .sts-flip-back-button:hover {
        color: var(--green);
        transform: translateX(-2px);
    }
}

.sts-flip-back-button:focus-visible {
    outline: 3px solid rgba(5,137,214,.28);
    outline-offset: 4px;
    border-radius: 6px;
}

/* Old Request Estimate link is no longer rendered. */
.sts-service-card-estimate {
    display: none !important;
}


/* -----------------------------
   Responsive card sizing
   ----------------------------- */

@media (max-width: 1180px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 735px !important;
    }
}

@media (max-width: 760px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 710px !important;
    }

    .sts-flip-service-back-actions-single {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .sts-full-service-button {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .sts-flip-back-button {
        width: 100%;
        text-align: center;
        padding: 12px;
    }
}

@media (max-width: 520px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 740px !important;
    }

    .sts-flip-service-back {
        padding: 22px 20px !important;
    }

    .sts-flip-service-back > p {
        font-size: 13.5px !important;
    }

    .sts-flip-service-back ul {
        font-size: 13px !important;
    }
}


/* =========================================================
   V34 — TIGHT FLIP CARD HEIGHTS
   Removes the large blank white area at the bottom.
   Height is calculated from the real front/back content by JS.
   ========================================================= */

.sts-flip-services-grid {
    align-items: start !important;
}

.sts-flip-service-card {
    min-height: 0 !important;
    height: auto;
}

.sts-flip-service-inner {
    min-height: 0 !important;
    height: auto;
}

.sts-flip-service-face {
    min-height: 0 !important;
    height: 100% !important;
}

/*
 * Let the back use the available card height naturally.
 * No fixed 710px / 735px / 760px / 740px minimums.
 */
.sts-flip-service-back {
    min-height: 0 !important;
}

/*
 * Keep the actions attached directly after the content instead of
 * forcing them to the very bottom of an oversized card.
 */
.sts-flip-service-back-actions,
.sts-flip-service-back-actions-single {
    margin-top: 20px !important;
    padding-top: 18px !important;
}

/*
 * The front does not need to stretch extra space either.
 */
.sts-flip-service-front-copy {
    flex: 0 0 auto !important;
}

.sts-flip-service-front .sts-flip-hint {
    margin-top: 22px !important;
    padding-top: 0 !important;
}

/*
 * Make front and back feel compact while preserving the spacing
 * you liked between headings, descriptions and benefits.
 */
.sts-flip-service-front-copy {
    padding-bottom: 26px !important;
}

.sts-flip-service-back {
    padding-bottom: 24px !important;
}

/*
 * Mobile still uses dynamic content height — no forced tall cards.
 */
@media (max-width: 1180px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 0 !important;
    }
}

@media (max-width: 760px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 0 !important;
    }
}

@media (max-width: 520px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 0 !important;
    }
}


/* =========================================================
   V35 — ALL SERVICE FLIP CARDS SAME HEIGHT
   Tallest real card determines the height for the entire grid.
   ========================================================= */

.sts-flip-services-grid {
    align-items: start !important;
}

.sts-flip-service-card,
.sts-flip-service-inner {
    min-height: 0 !important;
}

/*
 * JS assigns one shared height to every card based on whichever
 * front/back face requires the most room.
 */
.sts-flip-service-card {
    height: auto;
}

.sts-flip-service-inner {
    height: auto;
}

.sts-flip-service-face {
    min-height: 0 !important;
    height: 100% !important;
}

/*
 * Keep the front content visually balanced even when another card
 * determines the overall shared height.
 */
.sts-flip-service-front {
    display: flex !important;
    flex-direction: column !important;
}

.sts-flip-service-front-copy {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
}

.sts-flip-service-front-copy .sts-flip-hint {
    margin-top: auto !important;
    padding-top: 22px !important;
}

/*
 * Back face fills the same shared height and keeps its controls
 * aligned at the bottom.
 */
.sts-flip-service-back {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}

.sts-flip-service-back-actions-single {
    margin-top: auto !important;
    padding-top: 18px !important;
}

/*
 * Remove older fixed minimums at every breakpoint.
 */
@media (max-width: 1180px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 0 !important;
    }
}

@media (max-width: 760px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 0 !important;
    }
}

@media (max-width: 520px) {
    .sts-flip-service-card,
    .sts-flip-service-inner,
    .sts-flip-service-face {
        min-height: 0 !important;
    }
}


/* =========================================================
   V36 — SINGLE SERVICE "VIEW ALL SERVICES" BUTTON
   ========================================================= */

.sts-single-related-services .sts-section-title-row {
    align-items: end;
    gap: 28px;
}

/*
 * Proper styled button instead of the browser's default purple link.
 * No arrow icon/text.
 */
.sts-view-all-services-button {
    flex: 0 0 auto;

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

    min-height: 48px;
    padding: 12px 22px;

    border: 2px solid var(--blue);
    border-radius: 999px;

    background: transparent;
    color: var(--blue) !important;

    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none !important;
    white-space: nowrap;

    box-shadow: none;

    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.sts-view-all-services-button:visited {
    color: var(--blue) !important;
}

@media (hover:hover) and (pointer:fine) {
    .sts-view-all-services-button:hover {
        background: var(--blue);
        border-color: var(--blue);
        color: #fff !important;

        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(5,137,214,.22);
    }
}

.sts-view-all-services-button:focus-visible {
    outline: 3px solid rgba(5,137,214,.28);
    outline-offset: 4px;
}

/*
 * Stack cleanly on smaller screens.
 */
@media (max-width: 760px) {
    .sts-single-related-services .sts-section-title-row {
        align-items: flex-start;
    }

    .sts-view-all-services-button {
        width: 100%;
        max-width: 230px;
    }
}


/* =========================================================
   V37 — SINGLE SERVICE HERO "ALL SERVICES" BUTTON
   ========================================================= */

.sts-service-back-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    min-height: 44px;
    margin-bottom: 26px !important;
    padding: 10px 18px;

    border: 1.5px solid rgba(255,255,255,.55);
    border-radius: 999px;

    background: rgba(255,255,255,.08);
    color: #fff !important;

    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .02em;
    text-decoration: none !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    transition:
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.sts-service-back-button:visited {
    color: #fff !important;
}

@media (hover:hover) and (pointer:fine) {
    .sts-service-back-button:hover {
        background: #fff;
        border-color: #fff;
        color: var(--navy) !important;

        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(0,0,0,.18);
    }
}

.sts-service-back-button:focus-visible {
    outline: 3px solid rgba(255,255,255,.36);
    outline-offset: 4px;
}

/* Remove old text-link behavior from the hero back link. */
.sts-single-service-hero .sts-service-back-link::before,
.sts-single-service-hero .sts-service-back-link::after {
    content: none !important;
}

@media (max-width: 680px) {
    .sts-service-back-button {
        min-height: 42px;
        padding: 10px 16px;
        font-size: 12px;
    }
}


/* =========================================================
   V38 — CONTACT CALL / EMAIL CARD ICONS
   ========================================================= */

.sts-contact-method {
    position: relative;
    overflow: hidden;

    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 28px;

    min-height: 180px;
    padding: 34px 38px !important;

    text-decoration: none !important;
}

.sts-contact-method-copy {
    position: relative;
    z-index: 2;

    min-width: 0;
    max-width: calc(100% - 145px);

    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.sts-contact-method-copy > span {
    margin-bottom: 12px;
}

.sts-contact-method-copy strong {
    overflow-wrap: anywhere;
    word-break: normal;
}

.sts-contact-method-icon {
    position: relative;
    z-index: 1;

    flex: 0 0 112px;
    width: 112px;
    height: 112px;

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

    border-radius: 50%;

    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.22);

    color: rgba(255,255,255,.94);

    transition:
        transform .25s ease,
        background-color .25s ease,
        border-color .25s ease;
}

.sts-contact-method-icon svg {
    width: 48px;
    height: 48px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/*
 * The phone icon's first path is a filled phone silhouette.
 */
.sts-contact-method-green .sts-contact-method-icon svg path:first-child {
    fill: currentColor;
    stroke: none;
}

@media (hover:hover) and (pointer:fine) {
    .sts-contact-method:hover .sts-contact-method-icon {
        transform: translateY(-3px) scale(1.06);
        background: rgba(255,255,255,.20);
        border-color: rgba(255,255,255,.44);
    }
}

/* Subtle oversized background shape to fill the right side even more. */
.sts-contact-method::after {
    content: "";
    position: absolute;
    right: -46px;
    top: 50%;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,.055);
    pointer-events: none;
}

@media (max-width: 900px) {
    .sts-contact-method {
        min-height: 160px;
        padding: 28px 30px !important;
    }

    .sts-contact-method-copy {
        max-width: calc(100% - 112px);
    }

    .sts-contact-method-icon {
        flex-basis: 86px;
        width: 86px;
        height: 86px;
    }

    .sts-contact-method-icon svg {
        width: 38px;
        height: 38px;
    }
}

@media (max-width: 600px) {
    .sts-contact-method {
        min-height: 145px;
        padding: 24px 22px !important;
        gap: 16px;
    }

    .sts-contact-method-copy {
        max-width: calc(100% - 78px);
    }

    .sts-contact-method-icon {
        flex: 0 0 66px;
        width: 66px;
        height: 66px;
    }

    .sts-contact-method-icon svg {
        width: 29px;
        height: 29px;
    }

    .sts-contact-method::after {
        right: -55px;
        width: 145px;
        height: 145px;
    }
}

@media (max-width: 420px) {
    .sts-contact-method {
        align-items: flex-start;
    }

    .sts-contact-method-copy {
        max-width: calc(100% - 62px);
    }

    .sts-contact-method-icon {
        flex-basis: 52px;
        width: 52px;
        height: 52px;
    }

    .sts-contact-method-icon svg {
        width: 24px;
        height: 24px;
    }
}


/* =========================================================
   V39 — COMPACT CONTACT CARDS + ICON BESIDE TEXT
   ========================================================= */

/*
 * Return the Call / Email cards to the shorter size they had before.
 * Keep the icon on the RIGHT side of the text, not underneath it.
 */
.sts-contact-method {
    min-height: 0 !important;
    padding: 26px 32px !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
}

.sts-contact-method-copy {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.sts-contact-method-copy > span {
    margin-bottom: 8px !important;
}

.sts-contact-method-copy strong {
    margin: 0 0 7px !important;
    line-height: 1.1 !important;
}

.sts-contact-method-copy small {
    line-height: 1.45 !important;
}

/*
 * Smaller icon circle, positioned beside the content.
 */
.sts-contact-method-icon {
    flex: 0 0 64px !important;
    width: 64px !important;
    height: 64px !important;

    margin-left: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;
}

.sts-contact-method-icon svg {
    width: 29px !important;
    height: 29px !important;
}

/*
 * Remove the large decorative circle that made the cards feel oversized.
 */
.sts-contact-method::after {
    display: none !important;
}

/*
 * Keep hover subtle and clean.
 */
@media (hover:hover) and (pointer:fine) {
    .sts-contact-method:hover .sts-contact-method-icon {
        transform: translateX(3px) scale(1.05) !important;
    }
}

@media (max-width: 900px) {
    .sts-contact-method {
        padding: 24px 26px !important;
        gap: 20px !important;
    }

    .sts-contact-method-icon {
        flex-basis: 58px !important;
        width: 58px !important;
        height: 58px !important;
    }

    .sts-contact-method-icon svg {
        width: 26px !important;
        height: 26px !important;
    }
}

@media (max-width: 600px) {
    .sts-contact-method {
        padding: 22px 20px !important;
        gap: 16px !important;

        /*
         * Still side-by-side on mobile unless the screen gets extremely narrow.
         */
        flex-direction: row !important;
        align-items: center !important;
    }

    .sts-contact-method-copy {
        max-width: calc(100% - 70px) !important;
    }

    .sts-contact-method-icon {
        flex: 0 0 52px !important;
        width: 52px !important;
        height: 52px !important;
    }

    .sts-contact-method-icon svg {
        width: 23px !important;
        height: 23px !important;
    }
}

@media (max-width: 390px) {
    .sts-contact-method {
        padding: 20px 18px !important;
        gap: 12px !important;
    }

    .sts-contact-method-copy {
        max-width: calc(100% - 58px) !important;
    }

    .sts-contact-method-icon {
        flex-basis: 46px !important;
        width: 46px !important;
        height: 46px !important;
    }

    .sts-contact-method-icon svg {
        width: 21px !important;
        height: 21px !important;
    }
}

/* =========================================================
   V34 — HOMEPAGE GOOGLE MAP / SERVICE AREA SECTION
   ========================================================= */

.sts-home-service-area {
    padding: 100px 0;
    background:
        radial-gradient(circle at 82% 18%, rgba(5,137,214,.10), transparent 30%),
        linear-gradient(180deg, #f8fbfd 0%, #eef6fa 100%);
}

.sts-service-area-heading {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(320px,.72fr);
    gap: 70px;
    align-items: end;
    margin-bottom: 42px;
}

.sts-service-area-heading h2 {
    max-width: 820px;
    margin: 8px 0 0;
    color: var(--ink);
    font-size: clamp(42px,3.4vw,60px);
    line-height: 1.03;
    letter-spacing: -.035em;
}

.sts-service-area-heading > p {
    margin: 0;
    color: var(--text);
    font-size: 18px;
    line-height: 1.75;
}

.sts-service-area-card {
    display: grid;
    grid-template-columns: minmax(0,1.45fr) minmax(330px,.55fr);
    min-height: 560px;
    overflow: hidden;
    border: 1px solid #d6e6ee;
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 22px 55px rgba(3,28,42,.13);
}

.sts-service-area-map {
    position: relative;
    min-height: 560px;
    background: #dbeaf1;
}

.sts-service-area-map::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    box-shadow: inset -18px 0 28px -26px rgba(3,28,42,.42);
}

.sts-service-area-map iframe {
    width: 100%;
    height: 100%;
    min-height: 560px;
    display: block;
    border: 0;
}

.sts-service-area-panel {
    position: relative;
    overflow: hidden;
    padding: 48px 42px;
    color: #fff;
    background:
        radial-gradient(circle at 100% 0%, rgba(5,137,214,.22), transparent 34%),
        radial-gradient(circle at 0% 100%, rgba(19,153,60,.15), transparent 34%),
        var(--navy);
}

.sts-service-area-panel::after {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    right: -105px;
    bottom: -105px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 0 0 32px rgba(255,255,255,.025);
}

.sts-service-area-icon {
    width: 58px;
    height: 58px;
    margin-bottom: 26px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg, var(--green), var(--blue));
    box-shadow: 0 13px 28px rgba(0,0,0,.18);
}

.sts-service-area-icon svg {
    width: 29px;
    height: 29px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sts-service-area-panel .sts-section-kicker {
    color: var(--green-2);
}

.sts-service-area-panel h3 {
    position: relative;
    z-index: 1;
    margin: 8px 0 18px;
    color: #fff;
    font-size: clamp(32px,2.7vw,45px);
    line-height: 1.04;
    letter-spacing: -.03em;
}

.sts-service-area-copy {
    position: relative;
    z-index: 1;
    margin: 0;
    color: rgba(255,255,255,.78);
    font-size: 16px;
    line-height: 1.72;
}

.sts-service-area-points {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 28px 0 32px;
}

.sts-service-area-points span {
    min-height: 46px;
    display: flex;
    align-items: center;
    padding: 11px 13px 11px 35px;
    position: relative;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 11px;
    background: rgba(255,255,255,.045);
    color: rgba(255,255,255,.90);
    font-size: 13px;
    font-weight: 800;
}

.sts-service-area-points span::before {
    content: "✓";
    position: absolute;
    left: 13px;
    color: var(--green-2);
    font-weight: 900;
}

.sts-service-area-actions {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

.sts-service-area-actions .sts-btn {
    min-height: 56px;
    padding: 0 22px;
    color: #fff !important;
}

.sts-service-area-contact,
.sts-service-area-contact:visited {
    color: rgba(255,255,255,.74);
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,.20);
    transition: color .2s ease, border-color .2s ease;
}

@media (hover:hover) and (pointer:fine) {
    .sts-service-area-card {
        transition: transform .25s ease, box-shadow .25s ease;
    }

    .sts-service-area-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 28px 62px rgba(3,28,42,.16);
    }

    .sts-service-area-contact:hover {
        color: #fff;
        border-color: var(--green-2);
    }
}

@media (max-width: 1000px) {
    .sts-service-area-heading,
    .sts-service-area-card {
        grid-template-columns: 1fr;
    }

    .sts-service-area-heading {
        gap: 22px;
    }

    .sts-service-area-map,
    .sts-service-area-map iframe {
        min-height: 500px;
    }

    .sts-service-area-map::after {
        display: none;
    }
}

@media (max-width: 700px) {
    .sts-home-service-area {
        padding: 68px 0;
    }

    .sts-service-area-heading {
        margin-bottom: 28px;
    }

    .sts-service-area-heading h2 {
        font-size: clamp(36px,10vw,48px);
    }

    .sts-service-area-heading > p {
        font-size: 16px;
    }

    .sts-service-area-card {
        border-radius: 20px;
    }

    .sts-service-area-map,
    .sts-service-area-map iframe {
        min-height: 380px;
    }

    .sts-service-area-panel {
        padding: 34px 26px;
    }

    .sts-service-area-points {
        grid-template-columns: 1fr;
    }

    .sts-service-area-actions .sts-btn {
        width: 100%;
    }
}

@media (max-width: 460px) {
    .sts-service-area-map,
    .sts-service-area-map iframe {
        min-height: 330px;
    }

    .sts-service-area-panel {
        padding: 30px 21px;
    }
}


/* =========================================================
   V34 — SINGLE BLOG POST
   ========================================================= */

.sts-single-blog {
    background: #fff;
}


/* HERO */

.sts-single-blog-hero {
    position: relative;
    overflow: hidden;
    min-height: 480px;
    color: #fff;
    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(5,137,214,.18),
            transparent 32%
        ),
        var(--navy);
}

.sts-single-blog-hero-photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.02);
}

.sts-single-blog-hero-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(3,28,42,.98) 0%,
            rgba(3,28,42,.92) 38%,
            rgba(3,28,42,.62) 64%,
            rgba(3,28,42,.24) 100%
        ),
        linear-gradient(
            180deg,
            rgba(3,28,42,.08),
            rgba(3,28,42,.24)
        );
}

.sts-single-blog-hero:not(.has-image)
.sts-single-blog-hero-overlay {
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(19,153,60,.16),
            transparent 30%
        ),
        linear-gradient(
            120deg,
            #031c2a,
            #073247
        );
}

.sts-single-blog-hero-inner {
    position: relative;
    z-index: 2;
    min-height: 480px;
    display: flex;
    align-items: center;
}

.sts-single-blog-hero-copy {
    max-width: 900px;
    padding: 78px 0;
}

.sts-blog-back-link {
    display: inline-flex;
    margin-bottom: 28px;
    color: rgba(255,255,255,.76);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition:
        color .2s ease,
        transform .2s ease;
}

.sts-blog-back-link:hover {
    color: #fff;
    transform: translateX(-3px);
}

.sts-single-blog-category {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    padding: 0 13px;
    border-radius: 999px;
    color: #fff;
    background: var(--green);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.sts-single-blog-hero h1 {
    max-width: 900px;
    margin: 0;
    color: #fff;
    font-size: clamp(48px, 5.5vw, 78px);
    line-height: 1.01;
    letter-spacing: -.04em;
    text-wrap: balance;
}

.sts-single-blog-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
    color: rgba(255,255,255,.70);
    font-size: 14px;
    font-weight: 700;
}


/* CONTENT */

.sts-single-blog-content-section {
    padding: 90px 0 105px;
    background: #f6fafc;
}

.sts-single-blog-layout {
    display: grid;
    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(300px, .65fr);
    gap: 70px;
    align-items: start;
}

.sts-single-blog-article {
    min-width: 0;
    padding: 48px 52px;
    border: 1px solid #dce9ef;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(5,38,56,.08);
}

.sts-single-blog-article > *:first-child {
    margin-top: 0;
}

.sts-single-blog-article h2 {
    margin: 46px 0 18px;
    color: var(--ink);
    font-size: clamp(30px, 2.5vw, 42px);
    line-height: 1.1;
    letter-spacing: -.025em;
}

.sts-single-blog-article h3 {
    margin: 36px 0 14px;
    color: var(--ink);
    font-size: 25px;
    line-height: 1.15;
}

.sts-single-blog-article h4 {
    margin: 28px 0 12px;
    color: var(--ink);
    font-size: 20px;
}

.sts-single-blog-article p,
.sts-single-blog-article li {
    color: var(--text);
    font-size: 17px;
    line-height: 1.8;
}

.sts-single-blog-article p {
    margin: 0 0 22px;
}

.sts-single-blog-article ul,
.sts-single-blog-article ol {
    margin: 18px 0 28px;
    padding-left: 26px;
}

.sts-single-blog-article li + li {
    margin-top: 8px;
}

.sts-single-blog-article strong {
    color: var(--ink);
}

.sts-single-blog-article a {
    color: var(--blue);
    font-weight: 700;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.sts-single-blog-article blockquote {
    margin: 34px 0;
    padding: 24px 28px;
    border-left: 5px solid var(--green);
    border-radius: 0 14px 14px 0;
    background: #eef8f1;
    color: var(--ink);
}

.sts-single-blog-article img {
    width: 100%;
    height: auto;
    margin: 28px 0;
    border-radius: 18px;
    box-shadow: 0 12px 28px rgba(5,38,56,.10);
}

.sts-single-blog-article figure {
    margin: 32px 0;
}

.sts-single-blog-article figcaption {
    margin-top: 8px;
    color: var(--muted);
    font-size: 13px;
    text-align: center;
}


/* SIDEBAR */

.sts-single-blog-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sts-blog-sidebar-card {
    padding: 32px;
    border: 1px solid #dce9ef;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(5,38,56,.08);
}

.sts-blog-sidebar-card h2 {
    margin: 8px 0 15px;
    color: var(--ink);
    font-size: 32px;
    line-height: 1.08;
}

.sts-blog-sidebar-card > p:not(.sts-section-kicker) {
    margin: 0 0 24px;
    color: var(--text);
    line-height: 1.65;
}

.sts-blog-sidebar-card .sts-btn {
    width: 100%;
}

.sts-single-blog-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 14px;
}

.sts-single-blog-categories a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 999px;
    color: var(--blue);
    background: #eef7fb;
    border: 1px solid #d5eaf4;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition:
        transform .2s ease,
        color .2s ease,
        background-color .2s ease;
}

.sts-single-blog-categories a:hover {
    transform: translateY(-2px);
    color: #fff;
    background: var(--blue);
}


/* BOTTOM CTA */

.sts-single-blog-cta {
    padding: 72px 0;
    color: #fff;
    background:
        radial-gradient(
            circle at 75% 40%,
            rgba(34,189,79,.18),
            transparent 34%
        ),
        #087ebd;
}

.sts-single-blog-cta-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
}

.sts-single-blog-cta .sts-section-kicker {
    color: #b8f2c4;
}

.sts-single-blog-cta h2 {
    max-width: 850px;
    margin: 8px 0 0;
    color: #fff;
    font-size: clamp(36px, 3vw, 52px);
    line-height: 1.06;
}


/* RESPONSIVE */

@media (max-width: 1000px) {

    .sts-single-blog-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .sts-single-blog-sidebar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 720px) {

    .sts-single-blog-hero,
    .sts-single-blog-hero-inner {
        min-height: 440px;
    }

    .sts-single-blog-hero-copy {
        padding: 60px 0;
    }

    .sts-single-blog-hero h1 {
        font-size: clamp(40px, 11vw, 58px);
    }

    .sts-single-blog-content-section {
        padding: 60px 0 72px;
    }

    .sts-single-blog-article {
        padding: 32px 26px;
    }

    .sts-single-blog-article p,
    .sts-single-blog-article li {
        font-size: 16px;
    }

    .sts-single-blog-sidebar {
        grid-template-columns: 1fr;
    }

    .sts-single-blog-cta-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .sts-single-blog-cta .sts-btn {
        width: 100%;
    }
}

@media (max-width: 480px) {

    .sts-single-blog-content-section .sts-container {
        width: calc(100% - 24px);
    }

    .sts-single-blog-article {
        padding: 27px 20px;
        border-radius: 17px;
    }

    .sts-single-blog-article h2 {
        font-size: 31px;
    }

    .sts-single-blog-article h3 {
        font-size: 23px;
    }

    .sts-blog-sidebar-card {
        padding: 26px 21px;
    }
}
/* =========================================================
   SPEEDLINE BLOG SINGLE POST FIX
   Append/replace blog single styling with this file section.
   NOTE: This package contains the complete blog-specific CSS needed
   for single.php. If your existing main.css contains all other site
   styling, merge this section at the bottom rather than replacing
   unrelated theme CSS.
   ========================================================= */

.sts-single-blog {
    background: #fff;
}

.sts-single-blog-hero {
    position: relative;
    overflow: hidden;
    min-height: 480px;
    color: #fff;
    background:
        radial-gradient(circle at 75% 30%, rgba(5,137,214,.18), transparent 32%),
        #062638;
}

.sts-single-blog-hero-photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.02);
}

.sts-single-blog-hero-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(3,28,42,.98) 0%, rgba(3,28,42,.92) 38%, rgba(3,28,42,.62) 64%, rgba(3,28,42,.24) 100%),
        linear-gradient(180deg, rgba(3,28,42,.08), rgba(3,28,42,.24));
}

.sts-single-blog-hero:not(.has-image) .sts-single-blog-hero-overlay {
    background:
        radial-gradient(circle at 80% 20%, rgba(19,153,60,.16), transparent 30%),
        linear-gradient(120deg, #031c2a, #073247);
}

.sts-single-blog-hero-inner {
    position: relative;
    z-index: 2;
    min-height: 480px;
    display: flex;
    align-items: center;
}

.sts-single-blog-hero-copy {
    max-width: 900px;
    padding: 78px 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.sts-blog-back-link {
    display: inline-flex !important;
    align-items: center;
    width: fit-content;
    margin: 0 0 18px !important;
    color: rgba(255,255,255,.88) !important;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none !important;
    transition: color .2s ease, transform .2s ease;
}

.sts-single-blog-category {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 34px;
    margin: 0 0 24px !important;
    padding: 0 13px;
    border-radius: 999px;
    color: #fff;
    background: #13993c;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.sts-single-blog-hero h1 {
    max-width: 900px;
    margin: 0;
    color: #fff;
    font-size: clamp(48px, 5.5vw, 78px);
    line-height: 1.01;
    letter-spacing: -.04em;
    text-wrap: balance;
}

.sts-single-blog-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
    color: rgba(255,255,255,.70);
    font-size: 14px;
    font-weight: 700;
}

.sts-single-blog-content-section {
    padding: 90px 0 105px;
    background: #f6fafc;
}

.sts-single-blog-layout {
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr);
    gap: 70px;
    align-items: start;
}

.sts-single-blog-article {
    min-width: 0;
    padding: 48px 52px;
    border: 1px solid #dce9ef;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(5,38,56,.08);
}

.sts-single-blog-article > *:first-child { margin-top: 0; }

.sts-single-blog-article h2 {
    margin: 46px 0 18px;
    color: #062337;
    font-size: clamp(30px, 2.5vw, 42px);
    line-height: 1.1;
    letter-spacing: -.025em;
}

.sts-single-blog-article h3 {
    margin: 36px 0 14px;
    color: #062337;
    font-size: 25px;
    line-height: 1.15;
}

.sts-single-blog-article h4 {
    margin: 28px 0 12px;
    color: #062337;
    font-size: 20px;
}

.sts-single-blog-article p,
.sts-single-blog-article li {
    color: #2c4452;
    font-size: 17px;
    line-height: 1.8;
}

.sts-single-blog-article p { margin: 0 0 22px; }

.sts-single-blog-article ul,
.sts-single-blog-article ol {
    margin: 18px 0 28px;
    padding-left: 26px;
}

.sts-single-blog-article li + li { margin-top: 8px; }
.sts-single-blog-article strong { color: #062337; }

.sts-single-blog-article a {
    color: #0589d6;
    font-weight: 700;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.sts-single-blog-article blockquote {
    margin: 34px 0;
    padding: 24px 28px;
    border-left: 5px solid #13993c;
    border-radius: 0 14px 14px 0;
    background: #eef8f1;
    color: #062337;
}

.sts-single-blog-article img {
    width: 100%;
    height: auto;
    margin: 28px 0;
    border-radius: 18px;
    box-shadow: 0 12px 28px rgba(5,38,56,.10);
}

.sts-single-blog-article figure { margin: 32px 0; }

.sts-single-blog-article figcaption {
    margin-top: 8px;
    color: #6d7d87;
    font-size: 13px;
    text-align: center;
}

.sts-single-blog-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sts-blog-sidebar-card {
    padding: 32px;
    border: 1px solid #dce9ef;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(5,38,56,.08);
}

.sts-blog-sidebar-card h2 {
    margin: 8px 0 15px;
    color: #062337;
    font-size: 32px;
    line-height: 1.08;
}

.sts-blog-sidebar-card > p:not(.sts-section-kicker) {
    margin: 0 0 24px;
    color: #2c4452;
    line-height: 1.65;
}

.sts-blog-sidebar-card .sts-btn { width: 100%; }

.sts-single-blog-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 14px;
}

.sts-single-blog-categories a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 999px;
    color: #0589d6;
    background: #eef7fb;
    border: 1px solid #d5eaf4;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, color .2s ease, background-color .2s ease;
}

.sts-single-blog-categories a:hover {
    transform: translateY(-2px);
    color: #fff;
    background: #0589d6;
}

.sts-single-blog-cta {
    padding: 72px 0;
    color: #fff;
    background:
        radial-gradient(circle at 75% 40%, rgba(34,189,79,.18), transparent 34%),
        #087ebd;
}

.sts-single-blog-cta-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
}

.sts-single-blog-cta .sts-section-kicker { color: #b8f2c4; }

.sts-single-blog-cta h2 {
    max-width: 850px;
    margin: 8px 0 0;
    color: #fff;
    font-size: clamp(36px, 3vw, 52px);
    line-height: 1.06;
}

@media (hover:hover) and (pointer:fine) {
    .sts-blog-back-link:hover {
        color: #fff !important;
        transform: translateX(-4px);
    }
}

@media (max-width: 1000px) {
    .sts-single-blog-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .sts-single-blog-sidebar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 720px) {
    .sts-single-blog-hero,
    .sts-single-blog-hero-inner { min-height: 440px; }

    .sts-single-blog-hero-copy { padding: 60px 0; }

    .sts-single-blog-hero h1 {
        font-size: clamp(40px, 11vw, 58px);
    }

    .sts-single-blog-content-section { padding: 60px 0 72px; }
    .sts-single-blog-article { padding: 32px 26px; }

    .sts-single-blog-article p,
    .sts-single-blog-article li { font-size: 16px; }

    .sts-single-blog-sidebar { grid-template-columns: 1fr; }

    .sts-single-blog-cta-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .sts-single-blog-cta .sts-btn { width: 100%; }
}

@media (max-width: 480px) {
    .sts-single-blog-content-section .sts-container {
        width: calc(100% - 24px);
    }

    .sts-single-blog-article {
        padding: 27px 20px;
        border-radius: 17px;
    }

    .sts-single-blog-article h2 { font-size: 31px; }
    .sts-single-blog-article h3 { font-size: 23px; }
    .sts-blog-sidebar-card { padding: 26px 21px; }
}

/* =========================================================
   V36 — OWNER CONTENT REFRESH + SERVICES NAV DROPDOWN
   ========================================================= */

/* -------------------------
   SERVICES DESKTOP DROPDOWN
   ------------------------- */
.sts-nav-services{
    position:relative;
    height:132px;
    display:flex;
    align-items:center;
}

.sts-nav-services-topline{
    height:100%;
    display:flex;
    align-items:center;
}

.sts-main-nav .sts-nav-parent-link{
    height:132px;
    min-height:132px;
    display:flex;
    align-items:center;
    padding:0 8px 0 18px;
    color:var(--ink) !important;
    font-size:19px;
    font-weight:900;
    text-decoration:none;
    position:relative;
}

.sts-main-nav .sts-nav-parent-link::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    bottom:calc(50% - 27px) !important;
    width:0 !important;
    height:3px !important;
    border-radius:999px !important;
    background:linear-gradient(90deg,var(--blue),var(--green)) !important;
    transform:translateX(-50%) !important;
    transition:width .22s ease !important;
}

.sts-nav-services:hover .sts-nav-parent-link,
.sts-nav-services:focus-within .sts-nav-parent-link,
.sts-nav-services.is-active .sts-nav-parent-link{
    color:var(--blue) !important;
}

.sts-nav-services:hover .sts-nav-parent-link::before,
.sts-nav-services:focus-within .sts-nav-parent-link::before,
.sts-nav-services.is-active .sts-nav-parent-link::before{
    width:calc(100% - 24px) !important;
}

.sts-services-submenu-toggle{
    width:32px;
    height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:9px;
    background:transparent;
    color:var(--ink);
    cursor:pointer;
}

.sts-services-submenu-toggle svg{
    width:17px;
    height:17px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.25;
    stroke-linecap:round;
    stroke-linejoin:round;
    transition:transform .2s ease;
}

.sts-nav-services:hover .sts-services-submenu-toggle,
.sts-nav-services:focus-within .sts-services-submenu-toggle{
    color:var(--blue);
    background:#eef8fc;
}

.sts-nav-services:hover .sts-services-submenu-toggle svg,
.sts-nav-services:focus-within .sts-services-submenu-toggle svg{
    transform:rotate(180deg);
}

.sts-services-dropdown{
    position:absolute;
    left:50%;
    top:calc(100% - 8px);
    width:min(760px,76vw);
    padding:18px;
    border:1px solid #d9e8ef;
    border-radius:18px;
    background:rgba(255,255,255,.99);
    box-shadow:0 24px 55px rgba(3,28,42,.18);
    opacity:0;
    visibility:hidden;
    transform:translate(-50%,10px);
    transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
    z-index:300;
}

.sts-nav-services:hover .sts-services-dropdown,
.sts-nav-services:focus-within .sts-services-dropdown,
.sts-nav-services.submenu-open .sts-services-dropdown{
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0);
}

.sts-services-dropdown-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:2px 4px 13px;
    margin-bottom:8px;
    border-bottom:1px solid #e2edf2;
}

.sts-services-dropdown-head span{
    color:var(--green);
    font-size:12px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.sts-services-dropdown-head a{
    min-height:0 !important;
    height:auto !important;
    padding:6px 9px !important;
    color:var(--blue) !important;
    font-size:12px !important;
    font-weight:900;
}

.sts-services-dropdown-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px 8px;
}

.sts-services-dropdown-grid a{
    min-height:48px !important;
    height:auto !important;
    padding:10px 12px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:15px;
    border-radius:10px;
    color:var(--ink) !important;
    font-size:14px !important;
    line-height:1.25 !important;
    font-weight:800 !important;
    text-decoration:none !important;
    transition:background-color .18s ease,color .18s ease,transform .18s ease !important;
}

.sts-services-dropdown-grid a::before,
.sts-services-dropdown-grid a::after,
.sts-services-dropdown-head a::before,
.sts-services-dropdown-head a::after{
    content:none !important;
    display:none !important;
}

.sts-services-dropdown-grid a:hover{
    color:var(--blue) !important;
    background:#eef8fc !important;
    transform:translateX(3px) !important;
}

/* -------------------------
   OWNER HOMEPAGE SERVICES
   ------------------------- */
.sts-owner-home-services-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:20px;
}

.sts-owner-home-service-card{
    min-height:235px;
    display:flex;
    flex-direction:column;
    padding:27px 25px;
    border:1px solid #dce9ef;
    border-top:4px solid var(--green);
    border-radius:17px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    box-shadow:0 10px 28px rgba(5,38,56,.08);
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.sts-owner-home-service-card:nth-child(even){border-top-color:var(--blue)}
.sts-owner-home-service-card>span{color:var(--blue);font-size:12px;font-weight:900;letter-spacing:.13em}
.sts-owner-home-service-card h3{margin:24px 0 11px;color:var(--ink);font-size:22px;line-height:1.1}
.sts-owner-home-service-card p{margin:0;color:var(--text);font-size:14.5px;line-height:1.58}
.sts-owner-home-service-card strong{margin-top:auto;padding-top:20px;color:var(--blue);font-size:13px}
.sts-home-services-all{display:flex;justify-content:center;margin-top:32px}

@media(hover:hover) and (pointer:fine){
    .sts-owner-home-service-card:hover{transform:translateY(-6px);box-shadow:0 20px 42px rgba(5,38,56,.13);border-color:rgba(5,137,214,.32)}
}

/* -------------------------
   OWNER CONTENT SECTIONS
   ------------------------- */
.sts-owner-trust-section,
.sts-owner-story-section,
.sts-owner-property-section,
.sts-owner-qualification-section,
.sts-owner-contact-faq,
.sts-owner-service-inclusions{
    padding:95px 0;
    background:#fff;
}

.sts-owner-story-section,
.sts-owner-contact-faq,
.sts-owner-service-inclusions{background:#f2f8fb}

.sts-owner-trust-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
}

.sts-owner-trust-grid article{
    padding:28px;
    border:1px solid #dce9ef;
    border-radius:17px;
    background:#fff;
    box-shadow:0 10px 26px rgba(5,38,56,.06);
}
.sts-owner-trust-grid article:nth-child(odd){border-top:4px solid var(--green)}
.sts-owner-trust-grid article:nth-child(even){border-top:4px solid var(--blue)}
.sts-owner-trust-grid h3{margin:0 0 10px;font-size:22px;color:var(--ink)}
.sts-owner-trust-grid p{margin:0;color:var(--text);line-height:1.65}

.sts-owner-story-grid,
.sts-owner-qualification-grid{
    display:grid;
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    gap:80px;
    align-items:start;
}
.sts-owner-story-grid h2,
.sts-owner-qualification-grid h2{margin:8px 0 0;font-size:clamp(42px,3vw,58px);line-height:1.05}
.sts-owner-story-copy p{color:var(--text);font-size:17px;line-height:1.8}
.sts-owner-story-copy blockquote{margin:28px 0 0;padding:24px 28px;border-left:5px solid var(--green);border-radius:0 14px 14px 0;background:#fff;color:var(--ink);font-size:20px;font-weight:800;line-height:1.5}

.sts-owner-planning-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.sts-owner-planning-grid span{padding:15px 17px;border:1px solid #dce9ef;border-radius:11px;background:#fff;color:var(--ink);font-weight:800}

.sts-owner-property-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.sts-owner-property-card{padding:42px;border:1px solid #dce9ef;border-radius:22px;box-shadow:var(--shadow)}
.sts-owner-property-card h2{font-size:clamp(35px,2.8vw,50px);line-height:1.06;margin:8px 0 18px}
.sts-owner-property-card p{color:var(--text);font-size:17px;line-height:1.75}
.sts-owner-property-card-dark{color:#fff;background:var(--navy);border-color:transparent}
.sts-owner-property-card-dark h2{color:#fff}
.sts-owner-property-card-dark p{color:rgba(255,255,255,.78)}
.sts-owner-property-card-dark strong{display:block;margin-top:25px;color:#7ce594;font-size:20px;line-height:1.45}

.sts-owner-qualification-card{padding:34px;border-radius:22px;color:#fff;background:var(--navy);border-left:7px solid var(--green);box-shadow:0 18px 42px rgba(3,28,42,.15)}
.sts-owner-qualification-card strong{display:block;font-size:46px;line-height:1;color:#fff}
.sts-owner-qualification-card span{display:block;margin-top:7px;color:#7ce594;font-weight:900;text-transform:uppercase;letter-spacing:.1em}
.sts-owner-qualification-card p{margin:20px 0 0;color:rgba(255,255,255,.76);line-height:1.7}

/* Emergency callout */
.sts-owner-emergency-callout{padding:70px 0;background:#b4232f;color:#fff}
.sts-owner-emergency-inner{display:flex;align-items:center;justify-content:space-between;gap:50px}
.sts-owner-emergency-callout .sts-section-kicker{color:#ffd6d9}
.sts-owner-emergency-callout h2{max-width:850px;margin:8px 0 10px;color:#fff;font-size:clamp(37px,3vw,52px);line-height:1.05}
.sts-owner-emergency-callout p:not(.sts-section-kicker){max-width:900px;margin:0;color:rgba(255,255,255,.86);line-height:1.7}

/* Service-area chips */
.sts-area-chip-grid{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 20px}
.sts-area-chip-grid span{padding:8px 11px;border-radius:999px;background:#eef7fb;border:1px solid #d8e8ef;color:var(--ink);font-size:12px;font-weight:800}

/* FAQ */
.sts-owner-faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sts-owner-faq-grid details{padding:0;border:1px solid #dce9ef;border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 7px 20px rgba(5,38,56,.05)}
.sts-owner-faq-grid summary{position:relative;padding:20px 48px 20px 20px;cursor:pointer;color:var(--ink);font-size:16px;font-weight:900;list-style:none}
.sts-owner-faq-grid summary::-webkit-details-marker{display:none}
.sts-owner-faq-grid summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);color:var(--blue);font-size:22px}
.sts-owner-faq-grid details[open] summary::after{content:"–"}
.sts-owner-faq-grid details p{margin:0;padding:0 20px 20px;color:var(--text);line-height:1.7}

/* Contact method layout icon correction */
.sts-contact-method{display:flex;align-items:center;justify-content:space-between;gap:20px}
.sts-contact-method-copy{min-width:0;display:flex;flex-direction:column}
.sts-contact-method-icon{width:56px;height:56px;flex:0 0 56px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.15)}
.sts-contact-method-icon svg{width:27px;height:27px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Services flip cards: fit content without forced blank bottoms.
   JS measures the tallest face and sets the exact equal row height. */
.sts-flip-service-card,
.sts-flip-service-inner,
.sts-flip-service-face{
    min-height:0 !important;
}
.sts-flip-service-card{height:auto}
.sts-flip-service-inner{height:auto}
.sts-flip-service-back-actions-single{margin-top:18px !important}

/* -------------------------
   RESPONSIVE OWNER REFRESH
   ------------------------- */
@media(max-width:1180px){
    .sts-owner-home-services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .sts-owner-trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:820px){
    .sts-nav-services{width:min(100%,430px);height:auto;display:block}
    .sts-nav-services-topline{height:auto;width:100%;display:grid;grid-template-columns:1fr 48px;align-items:center}
    .sts-main-nav .sts-nav-parent-link{width:100%;height:54px;min-height:54px;padding:0 12px;justify-content:center;font-size:17px}
    .sts-main-nav .sts-nav-parent-link::before{bottom:7px !important}
    .sts-services-submenu-toggle{width:44px;height:44px;justify-self:end}
    .sts-services-dropdown{position:static;width:100%;margin:4px 0 10px;padding:10px;display:none;opacity:1;visibility:visible;transform:none;box-shadow:none;border-radius:12px;background:#f5fafc}
    .sts-nav-services.submenu-open .sts-services-dropdown{display:block}
    .sts-nav-services:hover .sts-services-dropdown:not(:focus-within){transform:none}
    .sts-services-dropdown-grid{grid-template-columns:1fr}
    .sts-services-dropdown-grid a{width:100% !important;justify-content:space-between !important;text-align:left !important;background:#fff !important;border:1px solid #e1edf2}
    .sts-services-dropdown-head{padding:4px 4px 10px}
    .sts-owner-story-grid,.sts-owner-qualification-grid,.sts-owner-property-grid{grid-template-columns:1fr;gap:30px}
    .sts-owner-emergency-inner{flex-direction:column;align-items:flex-start}
    .sts-owner-emergency-inner .sts-btn{width:100%}
    .sts-owner-faq-grid{grid-template-columns:1fr}
}

@media(max-width:620px){
    .sts-owner-home-services-grid,.sts-owner-trust-grid,.sts-owner-planning-grid{grid-template-columns:1fr}
    .sts-owner-trust-section,.sts-owner-story-section,.sts-owner-property-section,.sts-owner-qualification-section,.sts-owner-contact-faq,.sts-owner-service-inclusions{padding:65px 0}
    .sts-owner-property-card{padding:28px 22px}
    .sts-owner-emergency-callout{padding:54px 0}
}

/* =========================================================
   V34 — DYNAMIC HOME SERVICE IMAGES / OWNERS / FAQ / EMERGENCY
   Removes arrow-icon styling and gives new sections their own look.
   ========================================================= */

/* No arrow icons anywhere in the refreshed theme. */
.sts-arrow-icon{
    display:none !important;
}

/* Services dropdown: text-only links, no directional arrows. */
.sts-services-dropdown-grid a{
    justify-content:flex-start !important;
}
.sts-services-dropdown-grid a:hover{
    transform:none !important;
}
.sts-services-submenu-toggle{
    font-size:22px !important;
    font-weight:900 !important;
    line-height:1 !important;
}
.sts-services-submenu-toggle span{
    display:block;
    transform:translateY(-1px);
}
.sts-services-dropdown-emergency{
    color:#a51f2a !important;
    background:#fff7f7 !important;
    border:1px solid #f1d6d9 !important;
}

/* ---------------------------------------------------------
   HOME SERVICES — SAME IMAGES AS SERVICE CPT POSTS
   --------------------------------------------------------- */
.sts-home-service-images{
    background:#f5fafc;
}
.sts-home-service-image-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:26px;
}
.sts-home-service-image-card{
    min-width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    border:1px solid #d9e8ef;
    border-radius:20px;
    background:#fff;
    color:inherit;
    text-decoration:none !important;
    box-shadow:0 12px 32px rgba(5,38,56,.09);
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.sts-home-service-image-wrap{
    height:245px;
    overflow:hidden;
    background:#dfecef;
}
.sts-home-service-image-wrap img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .35s ease;
}
.sts-home-service-image-placeholder{
    width:100%;height:100%;
    background:linear-gradient(135deg,#dfecef,#edf6f9);
}
.sts-home-service-image-copy{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:25px 25px 27px;
}
.sts-home-service-image-copy h3{
    margin:0 0 10px;
    color:var(--ink);
    font-size:24px;
    line-height:1.12;
}
.sts-home-service-image-copy p{
    margin:0;
    color:var(--text);
    font-size:14.5px;
    line-height:1.65;
}
.sts-home-service-image-copy strong{
    margin-top:auto;
    padding-top:18px;
    color:var(--blue);
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.06em;
}
@media(hover:hover) and (pointer:fine){
    .sts-home-service-image-card:hover{
        transform:translateY(-7px);
        border-color:rgba(5,137,214,.28);
        box-shadow:0 22px 46px rgba(5,38,56,.15);
    }
    .sts-home-service-image-card:hover img{transform:scale(1.045)}
}

/* ---------------------------------------------------------
   WHY CHOOSE — intentionally different from standard white cards
   --------------------------------------------------------- */
.sts-home-why-panel{
    position:relative;
    overflow:hidden;
    padding:105px 0;
    color:#fff;
    background:
        radial-gradient(circle at 88% 12%,rgba(5,137,214,.20),transparent 28%),
        radial-gradient(circle at 12% 90%,rgba(34,189,79,.13),transparent 30%),
        #052638;
}
.sts-home-why-panel::after{
    content:"";
    position:absolute;
    right:-130px;
    top:-130px;
    width:390px;
    height:390px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.07);
    box-shadow:0 0 0 48px rgba(255,255,255,.018),0 0 0 94px rgba(255,255,255,.012);
    pointer-events:none;
}
.sts-home-why-heading{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(320px,.65fr);
    gap:70px;
    align-items:end;
    margin-bottom:44px;
}
.sts-home-why-heading .sts-section-kicker{color:#6ddd83}
.sts-home-why-heading h2{
    max-width:780px;
    margin:8px 0 0;
    color:#fff;
    font-size:clamp(44px,3.6vw,64px);
    line-height:1.02;
}
.sts-home-why-heading > p{
    margin:0;
    color:rgba(255,255,255,.75);
    font-size:18px;
    line-height:1.7;
}
.sts-home-why-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
.sts-home-why-grid article{
    min-height:180px;
    display:grid;
    grid-template-columns:54px 1fr;
    gap:20px;
    align-items:start;
    padding:27px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:18px;
    background:rgba(255,255,255,.055);
    backdrop-filter:blur(5px);
    transition:transform .22s ease,background-color .22s ease,border-color .22s ease;
}
.sts-home-why-number{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:14px;
    color:#fff;
    background:linear-gradient(135deg,var(--green),var(--blue));
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
}
.sts-home-why-grid h3{margin:2px 0 10px;color:#fff;font-size:21px}
.sts-home-why-grid p{margin:0;color:rgba(255,255,255,.72);font-size:14.5px;line-height:1.65}
@media(hover:hover) and (pointer:fine){
    .sts-home-why-grid article:hover{transform:translateY(-5px);background:rgba(255,255,255,.085);border-color:rgba(34,189,79,.32)}
}

/* ---------------------------------------------------------
   MEET THE OWNERS CPT
   --------------------------------------------------------- */
.sts-meet-owners-section{
    padding:100px 0;
    background:#f3f8fb;
}
.sts-owner-profile-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px;
}
.sts-owner-profile-card{
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(190px,.75fr) minmax(0,1.25fr);
    min-height:360px;
    border:1px solid #dbe8ee;
    border-radius:22px;
    background:#fff;
    box-shadow:0 14px 34px rgba(5,38,56,.09);
}
.sts-owner-profile-photo{min-height:360px;background:#dcecf1}
.sts-owner-profile-photo img{width:100%;height:100%;display:block;object-fit:cover}
.sts-owner-profile-placeholder{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(145deg,#0b85c8,#158c42);color:#fff}
.sts-owner-profile-placeholder span{font-size:80px;font-weight:900;opacity:.88}
.sts-owner-profile-copy{padding:34px;display:flex;flex-direction:column;justify-content:center}
.sts-owner-profile-copy h3{margin:6px 0 14px;font-size:34px;color:var(--ink)}
.sts-owner-profile-copy p:not(.sts-section-kicker){color:var(--text);line-height:1.72}

/* ---------------------------------------------------------
   QUALIFICATIONS / INSURANCE
   --------------------------------------------------------- */
.sts-owner-qualification-intro{
    color:var(--text);
    font-size:17px;
    line-height:1.75;
}
.sts-owner-qualification-card small{
    display:block;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.12);
    color:rgba(255,255,255,.62);
    line-height:1.55;
}

/* ---------------------------------------------------------
   FAQ PAGE
   --------------------------------------------------------- */
.sts-faq-page{background:#f4f9fc}
.sts-owner-faq-grid-full{grid-template-columns:1fr}
.sts-owner-faq-grid-full details{border-radius:16px}
.sts-owner-faq-grid-full summary{font-size:18px;padding:23px 56px 23px 24px}
.sts-faq-answer{padding:0 24px 24px;color:var(--text);line-height:1.75}
.sts-faq-answer p:first-child{margin-top:0}
.sts-faq-answer p:last-child{margin-bottom:0}
.sts-faq-view-all{display:flex;justify-content:center;margin-top:30px}

/* ---------------------------------------------------------
   EMERGENCY PAGE — distinct red/navy treatment
   --------------------------------------------------------- */
.sts-emergency-page-hero{
    position:relative;
    min-height:590px;
    overflow:hidden;
    display:flex;
    align-items:center;
    color:#fff;
    background:#071f2b;
    border-bottom:6px solid #d6323f;
}
.sts-emergency-page-photo{position:absolute;inset:0 0 0 42%;background-size:cover;background-position:center;opacity:.72}
.sts-emergency-page-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#071f2b 0%,rgba(7,31,43,.98) 38%,rgba(7,31,43,.72) 58%,rgba(7,31,43,.25) 100%)}
.sts-emergency-page-inner{position:relative;z-index:2}
.sts-emergency-page-copy{max-width:760px;padding:90px 0}
.sts-emergency-page-copy .sts-page-kicker{color:#ff8e96}
.sts-emergency-page-copy h1{margin:9px 0 22px;color:#fff;font-size:clamp(52px,5.5vw,82px);line-height:.98;letter-spacing:-.04em}
.sts-emergency-page-copy>p{max-width:690px;color:rgba(255,255,255,.82);font-size:18px;line-height:1.72}
.sts-emergency-page-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}

.sts-emergency-definition-section{padding:100px 0;background:#fff7f7}
.sts-emergency-definition-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.65fr);gap:65px;align-items:end;margin-bottom:40px}
.sts-emergency-definition-heading h2{margin:8px 0 0;font-size:clamp(42px,3.3vw,60px);line-height:1.04;color:var(--ink)}
.sts-emergency-definition-heading>p{margin:0;color:var(--text);font-size:17px;line-height:1.75}
.sts-emergency-situation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sts-emergency-situation-grid article{padding:27px;border:1px solid #f0cfd3;border-left:5px solid #d6323f;border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(75,20,25,.07)}
.sts-emergency-situation-grid article>span{display:block;margin-bottom:26px;color:#d6323f;font-size:12px;font-weight:900;letter-spacing:.12em}
.sts-emergency-situation-grid h3{margin:0 0 10px;color:var(--ink);font-size:21px}
.sts-emergency-situation-grid p{margin:0;color:var(--text);font-size:14px;line-height:1.62}

.sts-emergency-safety-section{padding:90px 0;background:#061f2c;color:#fff}
.sts-emergency-safety-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.65fr);gap:60px;align-items:center}
.sts-emergency-safety-grid h2{margin:8px 0 16px;color:#fff;font-size:clamp(40px,3vw,56px)}
.sts-emergency-safety-grid>div:first-child>p:not(.sts-section-kicker){color:rgba(255,255,255,.76);font-size:17px;line-height:1.75}
.sts-emergency-contact-card{padding:34px;border:1px solid rgba(255,255,255,.12);border-top:5px solid #d6323f;border-radius:18px;background:rgba(255,255,255,.055)}
.sts-emergency-contact-card strong{display:block;font-size:27px}
.sts-emergency-contact-card p{color:rgba(255,255,255,.72);line-height:1.7}

.sts-owner-emergency-buttons{display:flex;gap:12px;flex-wrap:wrap}

/* ---------------------------------------------------------
   STANDARD PAGE FALLBACK
   --------------------------------------------------------- */
.sts-standard-page-inner{max-width:980px}
.sts-standard-page-inner>h1{font-size:clamp(42px,4vw,66px);margin-top:0}
.sts-standard-page-content{color:var(--text);font-size:17px;line-height:1.75}

@media(max-width:1050px){
    .sts-home-service-image-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .sts-home-why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .sts-home-why-heading,.sts-emergency-definition-heading,.sts-emergency-safety-grid{grid-template-columns:1fr;gap:28px}
    .sts-emergency-situation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .sts-owner-profile-card{grid-template-columns:1fr;min-height:0}
    .sts-owner-profile-photo{height:340px;min-height:0}
}

@media(max-width:760px){
    .sts-home-why-panel{padding:72px 0}
    .sts-home-why-grid,.sts-home-service-image-grid,.sts-owner-profile-grid,.sts-emergency-situation-grid{grid-template-columns:1fr}
    .sts-home-why-grid article{min-height:0}
    .sts-home-service-image-wrap{height:230px}
    .sts-emergency-page-hero{min-height:560px}
    .sts-emergency-page-photo{inset:0;opacity:.45}
    .sts-emergency-page-overlay{background:linear-gradient(180deg,rgba(7,31,43,.58),rgba(7,31,43,.96) 66%,#071f2b)}
    .sts-emergency-page-copy{padding:110px 0 60px}
    .sts-emergency-page-actions .sts-btn,.sts-owner-emergency-buttons .sts-btn{width:100%}
}


/* =========================================================
   V34 — ABOUT STORY + OWNER PROFILES
   ========================================================= */

/* WHY WE STARTED — visually distinct from the card-heavy sections */
.sts-owner-story-section{
    position:relative;
    overflow:hidden;
    padding:105px 0 110px;
    background:
        radial-gradient(circle at 8% 12%,rgba(5,137,214,.09),transparent 27%),
        radial-gradient(circle at 92% 88%,rgba(19,153,60,.08),transparent 28%),
        linear-gradient(180deg,#f4f9fc 0%,#edf6fa 100%);
    border-top:1px solid #dcebf2;
    border-bottom:1px solid #dcebf2;
}

.sts-owner-story-section::before{
    content:"";
    position:absolute;
    width:430px;
    height:430px;
    right:-220px;
    top:-220px;
    border-radius:50%;
    border:1px solid rgba(5,137,214,.10);
    box-shadow:
        0 0 0 60px rgba(5,137,214,.025),
        0 0 0 120px rgba(19,153,60,.018);
    pointer-events:none;
}

.sts-owner-story-heading{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(340px,.65fr);
    gap:90px;
    align-items:end;
    margin-bottom:48px;
}

.sts-owner-story-heading-copy h2{
    max-width:760px;
    margin:9px 0 0;
    color:var(--ink);
    font-size:clamp(46px,4vw,66px);
    line-height:1.01;
    letter-spacing:-.045em;
}

.sts-owner-story-heading-note{
    padding:26px 28px;
    border-left:4px solid var(--blue);
    border-radius:0 18px 18px 0;
    background:rgba(255,255,255,.72);
    box-shadow:0 10px 28px rgba(5,38,56,.06);
}

.sts-owner-story-eyebrow{
    display:block;
    margin-bottom:9px;
    color:var(--green);
    font-size:12px;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.sts-owner-story-heading-note p{
    margin:0;
    color:var(--text);
    font-size:16px;
    line-height:1.72;
}

.sts-owner-story-panels{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:26px;
}

.sts-owner-story-panel{
    position:relative;
    min-height:330px;
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    gap:22px;
    padding:36px;
    overflow:hidden;
    border:1px solid #d8e7ee;
    border-radius:24px;
    background:#fff;
    box-shadow:0 15px 38px rgba(5,38,56,.09);
    transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}

.sts-owner-story-panel::after{
    content:"";
    position:absolute;
    right:-50px;
    bottom:-65px;
    width:180px;
    height:180px;
    border-radius:50%;
    opacity:.07;
}

.sts-owner-story-panel-blue{
    border-top:5px solid var(--blue);
}

.sts-owner-story-panel-blue::after{
    background:var(--blue);
}

.sts-owner-story-panel-green{
    border-top:5px solid var(--green);
}

.sts-owner-story-panel-green::after{
    background:var(--green);
}

.sts-owner-story-number{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    border-radius:18px;
    color:#fff;
    font-size:14px;
    font-weight:900;
    letter-spacing:.08em;
}

.sts-owner-story-panel-blue .sts-owner-story-number{
    background:var(--blue);
    box-shadow:0 10px 24px rgba(5,137,214,.20);
}

.sts-owner-story-panel-green .sts-owner-story-number{
    background:var(--green);
    box-shadow:0 10px 24px rgba(19,153,60,.20);
}

.sts-owner-story-panel h3{
    margin:2px 0 16px;
    color:var(--ink);
    font-size:27px;
    line-height:1.12;
    letter-spacing:-.025em;
}

.sts-owner-story-panel p{
    margin:0 0 14px;
    color:var(--text);
    font-size:16px;
    line-height:1.72;
}

.sts-owner-story-panel p:last-child{
    margin-bottom:0;
}

@media (hover:hover) and (pointer:fine){
    .sts-owner-story-panel:hover{
        transform:translateY(-7px);
        border-color:rgba(5,137,214,.24);
        box-shadow:0 24px 50px rgba(5,38,56,.14);
    }
}

.sts-owner-story-statement{
    position:relative;
    z-index:2;
    margin-top:26px;
    padding:34px 42px 32px 96px;
    overflow:hidden;
    border-radius:24px;
    color:#fff;
    background:
        radial-gradient(circle at 86% 50%,rgba(34,189,79,.20),transparent 28%),
        linear-gradient(120deg,#052838 0%,#073247 70%,#0b4352 100%);
    box-shadow:0 18px 42px rgba(3,28,42,.16);
}

.sts-owner-story-statement::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:7px;
    background:linear-gradient(180deg,var(--green-2),var(--blue-2));
}

.sts-owner-story-statement-mark{
    position:absolute;
    left:33px;
    top:18px;
    color:var(--green-2);
    font-family:Georgia,serif;
    font-size:76px;
    line-height:1;
    opacity:.90;
}

.sts-owner-story-statement blockquote{
    margin:0;
    max-width:1100px;
    color:#fff;
    font-size:clamp(23px,2vw,31px);
    font-weight:900;
    line-height:1.28;
    letter-spacing:-.02em;
}

.sts-owner-story-statement > span{
    display:block;
    margin-top:15px;
    color:rgba(255,255,255,.66);
    font-size:13px;
    font-weight:800;
    letter-spacing:.05em;
}

/* MEET THE OWNERS */
.sts-meet-owners-section{
    padding:105px 0;
    background:#fff;
}

.sts-owner-profile-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:30px;
}

.sts-owner-profile-card{
    min-width:0;
    overflow:hidden;
    display:grid;
    grid-template-columns:42% minmax(0,1fr);
    min-height:440px;
    border:1px solid #dce9ef;
    border-radius:24px;
    background:#fff;
    box-shadow:0 14px 36px rgba(5,38,56,.09);
    transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}

.sts-owner-profile-card:nth-child(odd){
    border-top:5px solid var(--green);
}

.sts-owner-profile-card:nth-child(even){
    border-top:5px solid var(--blue);
}

.sts-owner-profile-photo{
    min-height:100%;
    overflow:hidden;
    background:#e8f2f6;
}

.sts-owner-profile-photo img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:center top;
    transition:transform .4s ease;
}

.sts-owner-profile-placeholder{
    width:100%;
    height:100%;
    min-height:440px;
    display:grid;
    place-items:center;
    background:
        radial-gradient(circle at 50% 30%,rgba(34,189,79,.15),transparent 26%),
        linear-gradient(145deg,#062638,#0b5875);
}

.sts-owner-profile-placeholder span{
    width:110px;
    height:110px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:rgba(255,255,255,.10);
    border:2px solid rgba(255,255,255,.20);
    font-size:50px;
    font-weight:900;
}

.sts-owner-profile-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:38px 34px;
}

.sts-owner-profile-copy h3{
    margin:0;
    color:var(--ink);
    font-size:38px;
    line-height:1.05;
    letter-spacing:-.035em;
}

.sts-owner-profile-role{
    width:fit-content;
    margin:13px 0 21px !important;
    padding:8px 12px;
    border-radius:999px;
    color:var(--blue) !important;
    background:#eaf6fc;
    border:1px solid #cae8f7;
    font-size:12px !important;
    font-weight:900;
    line-height:1.2 !important;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.sts-owner-profile-card:nth-child(odd) .sts-owner-profile-role{
    color:#0f8a36 !important;
    background:#edf9f0;
    border-color:#cfead7;
}

.sts-owner-profile-bio{
    color:var(--text);
    font-size:15px;
    line-height:1.72;
}

.sts-owner-profile-bio p{
    margin-top:0;
}

.sts-owner-profile-bio p:last-child{
    margin-bottom:0;
}

@media (hover:hover) and (pointer:fine){
    .sts-owner-profile-card:hover{
        transform:translateY(-7px);
        border-color:rgba(5,137,214,.25);
        box-shadow:0 24px 52px rgba(5,38,56,.14);
    }

    .sts-owner-profile-card:hover .sts-owner-profile-photo img{
        transform:scale(1.035);
    }
}

@media(max-width:1050px){
    .sts-owner-story-heading{
        grid-template-columns:1fr;
        gap:28px;
    }

    .sts-owner-story-heading-note{
        max-width:760px;
    }

    .sts-owner-profile-grid{
        grid-template-columns:1fr;
    }

    .sts-owner-profile-card{
        grid-template-columns:320px minmax(0,1fr);
    }
}

@media(max-width:760px){
    .sts-owner-story-section,
    .sts-meet-owners-section{
        padding:72px 0;
    }

    .sts-owner-story-panels{
        grid-template-columns:1fr;
    }

    .sts-owner-story-panel{
        min-height:0;
    }

    .sts-owner-story-statement{
        padding:30px 26px 28px 66px;
    }

    .sts-owner-story-statement-mark{
        left:22px;
        top:18px;
        font-size:56px;
    }

    .sts-owner-profile-card{
        grid-template-columns:1fr;
        min-height:0;
    }

    .sts-owner-profile-photo,
    .sts-owner-profile-placeholder{
        height:380px;
        min-height:380px;
    }
}

@media(max-width:520px){
    .sts-owner-story-panel{
        grid-template-columns:1fr;
        padding:27px 23px;
    }

    .sts-owner-story-number{
        width:50px;
        height:50px;
        border-radius:15px;
    }

    .sts-owner-story-panel h3{
        font-size:24px;
    }

    .sts-owner-story-statement{
        padding:28px 21px 26px;
    }

    .sts-owner-story-statement-mark{
        position:static;
        height:42px;
        margin-bottom:4px;
        font-size:52px;
    }

    .sts-owner-profile-photo,
    .sts-owner-profile-placeholder{
        height:320px;
        min-height:320px;
    }

    .sts-owner-profile-copy{
        padding:28px 23px;
    }

    .sts-owner-profile-copy h3{
        font-size:33px;
    }
}


/* =========================================================
   V35 — ABOUT PAGE POLISH
   - No + icon beside Services
   - Owner photos drive the About intro
   - Each image hovers independently
   - Cleaner owner-role treatment
   - Numbered planning tiles instead of checkmarks
   ========================================================= */

/* SERVICES HEADER — no visible + / arrow control. */
.sts-services-submenu-toggle{
    display:none !important;
}

.sts-nav-services-topline{
    display:flex !important;
    align-items:center !important;
}

.sts-main-nav .sts-nav-parent-link{
    padding-left:18px !important;
    padding-right:18px !important;
}

/* ABOUT INTRO PHOTOS — two independent image surfaces. */
.sts-about-image-stack{
    position:relative;
    min-height:650px;
    border-radius:0 !important;
    box-shadow:none !important;
    transform:none !important;
    overflow:visible !important;
}

.sts-about-image-frame{
    position:absolute;
    overflow:hidden;
    border-radius:22px;
    background:#eaf2f5;
    box-shadow:0 18px 42px rgba(5,38,56,.14);
    transition:transform .28s ease,box-shadow .28s ease;
}

.sts-about-image-frame-main{
    left:0;
    top:0;
    width:84%;
    height:590px;
}

.sts-about-image-frame-small{
    right:0;
    bottom:0;
    width:46%;
    height:300px;
    border:9px solid #fff;
}

.sts-about-image-frame .sts-about-main-img,
.sts-about-image-frame .sts-about-small-img{
    position:static !important;
    width:100% !important;
    height:100% !important;
    display:block;
    object-fit:cover;
    object-position:center 22%;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    transform:none !important;
    transition:transform .38s cubic-bezier(.22,.61,.36,1) !important;
}

.sts-about-image-frame-small .sts-about-small-img{
    object-position:center 18%;
}

/* Neutralize the old parent hover that animated BOTH photos together. */
.sts-about-image-stack:hover,
.sts-about-image-stack:hover .sts-about-main-img,
.sts-about-image-stack:hover .sts-about-small-img{
    transform:none !important;
    box-shadow:none;
}

@media (hover:hover) and (pointer:fine){
    .sts-about-image-frame:hover{
        transform:translateY(-7px);
        box-shadow:0 26px 54px rgba(5,38,56,.19);
        z-index:4;
    }

    .sts-about-image-frame:hover img{
        transform:scale(1.035) !important;
    }
}

/* OWNER CARDS — calmer hover and a cleaner professional role line. */
.sts-owner-profile-card{
    transition:border-color .22s ease,box-shadow .22s ease !important;
}

@media (hover:hover) and (pointer:fine){
    .sts-owner-profile-card:hover{
        transform:none !important;
        border-color:#c8e0eb !important;
        box-shadow:0 18px 42px rgba(5,38,56,.12) !important;
    }

    .sts-owner-profile-card:hover .sts-owner-profile-photo img{
        transform:none !important;
    }

    .sts-owner-profile-photo:hover img{
        transform:scale(1.035) !important;
    }
}

.sts-owner-profile-role,
.sts-owner-profile-card:nth-child(odd) .sts-owner-profile-role{
    display:none !important;
}

.sts-owner-profile-roleline{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin:12px 0 22px;
    color:var(--text);
}

.sts-owner-profile-role-main{
    color:var(--green);
    font-size:13px;
    line-height:1.3;
    font-weight:900;
    letter-spacing:.04em;
}

.sts-owner-profile-role-separator{
    width:22px;
    height:2px;
    border-radius:99px;
    background:#c9dce5;
}

.sts-owner-profile-specialty{
    color:var(--blue);
    font-size:13px;
    line-height:1.3;
    font-weight:800;
}

.sts-owner-profile-card:nth-child(even) .sts-owner-profile-role-main{
    color:var(--blue);
}

.sts-owner-profile-card:nth-child(even) .sts-owner-profile-specialty{
    color:var(--green);
}

/* OUR APPROACH — no checkmarks. Each item is its own tile. */
.sts-about-planning{
    background:
        radial-gradient(circle at 90% 12%,rgba(5,137,214,.07),transparent 25%),
        #edf6fa !important;
}

.sts-owner-planning-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px !important;
}

.sts-owner-planning-grid > span{
    display:none !important;
}

.sts-owner-planning-item{
    min-width:0;
    min-height:88px;
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:17px;
    padding:18px 20px;
    border:1px solid #d5e5ed;
    border-radius:15px;
    background:#fff;
    box-shadow:0 7px 19px rgba(5,38,56,.045);
    transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}

.sts-owner-planning-item:nth-child(4n+1),
.sts-owner-planning-item:nth-child(4n+4){
    border-left:4px solid var(--green);
}

.sts-owner-planning-item:nth-child(4n+2),
.sts-owner-planning-item:nth-child(4n+3){
    border-left:4px solid var(--blue);
}

.sts-owner-planning-number{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#edf8fd;
    color:var(--blue);
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
}

.sts-owner-planning-item:nth-child(odd) .sts-owner-planning-number{
    background:#eef9f1;
    color:var(--green);
}

.sts-owner-planning-item h3{
    margin:0;
    color:var(--ink);
    font-size:17px;
    line-height:1.35;
    letter-spacing:-.01em;
}

@media (hover:hover) and (pointer:fine){
    .sts-owner-planning-item:hover{
        transform:translateY(-4px);
        border-color:#bddbe8;
        box-shadow:0 14px 28px rgba(5,38,56,.09);
    }
}

@media(max-width:820px){
    /* Dropdown remains hover/focus driven on desktop. On mobile the main
       Services link goes directly to the Services page, with no extra + button. */
    .sts-nav-services-topline{
        display:block !important;
        width:100%;
    }

    .sts-main-nav .sts-nav-parent-link{
        width:100%;
        padding:0 20px !important;
    }

    .sts-services-dropdown{
        display:none !important;
    }

    .sts-about-image-stack{
        min-height:520px;
    }

    .sts-about-image-frame-main{
        width:86%;
        height:470px;
    }

    .sts-about-image-frame-small{
        width:48%;
        height:250px;
    }
}

@media(max-width:620px){
    .sts-owner-planning-grid{
        grid-template-columns:1fr !important;
    }

    .sts-owner-planning-item{
        min-height:78px;
        grid-template-columns:42px minmax(0,1fr);
        padding:16px;
    }

    .sts-owner-planning-number{
        width:38px;
        height:38px;
    }

    .sts-owner-profile-roleline{
        gap:8px;
    }

    .sts-owner-profile-role-separator{
        width:16px;
    }
}

@media(max-width:520px){
    .sts-about-image-stack{
        min-height:420px;
    }

    .sts-about-image-frame-main{
        width:90%;
        height:380px;
    }

    .sts-about-image-frame-small{
        width:54%;
        height:210px;
        border-width:6px;
    }
}


/* =========================================================
   V36 — SERVICES DROPDOWN VISIBILITY + HOME EMERGENCY FEATURE
   ========================================================= */

/*
 * V34 accidentally hid the only <span> inside every service dropdown
 * link while trying to remove old arrow spans. Keep service titles visible.
 */
.sts-services-dropdown-grid a > span,
.sts-services-dropdown-grid a > span:last-child,
.sts-services-dropdown-grid a > span:last-child:only-child{
    display:inline !important;
    visibility:visible !important;
    opacity:1 !important;
    color:inherit !important;
}

.sts-services-dropdown{
    overflow:visible !important;
}

.sts-services-dropdown-grid a{
    color:var(--ink) !important;
    background:transparent !important;
    border:1px solid transparent;
    min-height:48px !important;
    padding:11px 13px !important;
    border-radius:11px !important;
    justify-content:flex-start !important;
}

.sts-services-dropdown-grid a:nth-child(odd):hover{
    color:var(--green) !important;
    background:#eef9f1 !important;
    border-color:#d1ead8 !important;
}

.sts-services-dropdown-grid a:nth-child(even):hover{
    color:var(--blue) !important;
    background:#edf8fd !important;
    border-color:#cfe8f4 !important;
}

.sts-services-dropdown-grid .sts-services-dropdown-emergency,
.sts-services-dropdown-grid .sts-services-dropdown-emergency > span{
    color:#b4232f !important;
}

.sts-services-dropdown-grid .sts-services-dropdown-emergency{
    background:#fff6f6 !important;
    border-color:#f0d1d5 !important;
}

.sts-services-dropdown-grid .sts-services-dropdown-emergency:hover{
    color:#fff !important;
    background:#c52c38 !important;
    border-color:#c52c38 !important;
}

.sts-services-dropdown-grid .sts-services-dropdown-emergency:hover > span{
    color:#fff !important;
}

/* ---------------------------------------------------------
   HOME — EMERGENCY / STORM FEATURE
   This section intentionally looks different from normal white content.
   --------------------------------------------------------- */
.sts-home-emergency-feature{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:92px 0;
    color:#fff;
    background:
        radial-gradient(circle at 84% 20%,rgba(255,90,95,.19),transparent 29%),
        radial-gradient(circle at 12% 90%,rgba(5,137,214,.20),transparent 31%),
        linear-gradient(120deg,#031d2a 0%,#062f42 58%,#083a4d 100%);
    border-top:5px solid #d43b45;
}

.sts-home-emergency-feature::before{
    content:"";
    position:absolute;
    z-index:-1;
    width:420px;
    height:420px;
    right:-170px;
    top:-190px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.08);
    box-shadow:
        0 0 0 55px rgba(255,255,255,.025),
        0 0 0 105px rgba(212,59,69,.035);
}

.sts-home-emergency-grid{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);
    gap:64px;
    align-items:center;
}

.sts-home-emergency-copy .sts-section-kicker{
    color:#ff777d !important;
}

.sts-home-emergency-copy h2{
    max-width:880px;
    margin:9px 0 20px;
    color:#fff;
    font-size:clamp(42px,3.6vw,62px);
    line-height:1.03;
    letter-spacing:-.04em;
}

.sts-home-emergency-copy > p{
    max-width:760px;
    margin:0;
    color:rgba(255,255,255,.78);
    font-size:17px;
    line-height:1.72;
}

.sts-home-emergency-actions{
    display:flex;
    flex-wrap:wrap;
    gap:13px;
    margin-top:30px;
}

.sts-home-emergency-actions .sts-btn-white{
    color:#9e202a !important;
    background:#fff !important;
}

.sts-home-emergency-actions .sts-btn-white:hover{
    color:#fff !important;
    background:#c52c38 !important;
    box-shadow:0 14px 30px rgba(197,44,56,.28);
}

.sts-home-emergency-actions .sts-btn-outline{
    color:#fff !important;
    border:1px solid rgba(255,255,255,.52) !important;
    background:rgba(255,255,255,.04);
}

.sts-home-emergency-actions .sts-btn-outline:hover{
    color:#fff !important;
    border-color:#fff !important;
    background:rgba(255,255,255,.11);
}

.sts-home-emergency-list{
    position:relative;
    padding:34px 34px 32px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:22px;
    background:rgba(255,255,255,.075);
    box-shadow:0 20px 44px rgba(0,0,0,.16);
    backdrop-filter:blur(8px);
}

.sts-home-emergency-list::before{
    content:"URGENT";
    position:absolute;
    right:24px;
    top:22px;
    color:#ff777d;
    font-size:10px;
    font-weight:900;
    letter-spacing:.16em;
}

.sts-home-emergency-list > strong{
    display:block;
    margin-bottom:20px;
    padding-right:75px;
    color:#fff;
    font-size:22px;
    line-height:1.2;
}

.sts-home-emergency-list ul{
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:11px;
}

.sts-home-emergency-list li{
    position:relative;
    margin:0;
    padding:13px 14px 13px 42px;
    border-radius:11px;
    color:rgba(255,255,255,.90);
    background:rgba(0,0,0,.13);
    font-size:15px;
    font-weight:800;
    line-height:1.4;
}

.sts-home-emergency-list li::before{
    content:"!";
    position:absolute;
    left:13px;
    top:50%;
    width:20px;
    height:20px;
    display:grid;
    place-items:center;
    transform:translateY(-50%);
    border-radius:50%;
    color:#fff;
    background:#d43b45;
    font-size:12px;
    font-weight:900;
}

@media (hover:hover) and (pointer:fine){
    .sts-home-emergency-list li{
        transition:transform .2s ease,background-color .2s ease;
    }

    .sts-home-emergency-list li:hover{
        transform:translateX(4px);
        background:rgba(255,255,255,.11);
    }
}

@media(max-width:900px){
    .sts-home-emergency-grid{
        grid-template-columns:1fr;
        gap:34px;
    }

    .sts-home-emergency-list{
        max-width:720px;
    }
}

@media(max-width:620px){
    .sts-home-emergency-feature{
        padding:68px 0;
    }

    .sts-home-emergency-copy h2{
        font-size:clamp(36px,10vw,48px);
    }

    .sts-home-emergency-actions{
        flex-direction:column;
    }

    .sts-home-emergency-actions .sts-btn{
        width:100%;
    }

    .sts-home-emergency-list{
        padding:27px 21px 22px;
    }
}


/* =========================================================
   V37 — PRECISE SERVICES DROPDOWN + SERVICE AREA SPACING
   ========================================================= */

/*
 * Do not let the entire Services wrapper act as one giant hover target.
 * JavaScript adds .is-dropdown-open only when the pointer/focus is on the
 * actual Services link or inside the visible dropdown.
 */
@media (min-width:821px){
    .sts-nav-services:hover .sts-services-dropdown,
    .sts-nav-services:focus-within .sts-services-dropdown,
    .sts-nav-services.submenu-open .sts-services-dropdown{
        opacity:0 !important;
        visibility:hidden !important;
        pointer-events:none !important;
        transform:translate(-50%,10px) !important;
    }

    .sts-nav-services.is-dropdown-open .sts-services-dropdown{
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        transform:translate(-50%,0) !important;
    }

    /* Only highlight Services when its link is actually hovered/focused,
       the dropdown is open, or this is the current section. */
    .sts-nav-services:hover .sts-nav-parent-link,
    .sts-nav-services:focus-within .sts-nav-parent-link{
        color:var(--ink) !important;
    }

    .sts-nav-services:hover .sts-nav-parent-link::before,
    .sts-nav-services:focus-within .sts-nav-parent-link::before{
        width:0 !important;
    }

    .sts-nav-parent-link:hover,
    .sts-nav-parent-link:focus,
    .sts-nav-services.is-dropdown-open .sts-nav-parent-link,
    .sts-nav-services.is-active .sts-nav-parent-link{
        color:var(--blue) !important;
    }

    .sts-nav-parent-link:hover::before,
    .sts-nav-parent-link:focus::before,
    .sts-nav-services.is-dropdown-open .sts-nav-parent-link::before,
    .sts-nav-services.is-active .sts-nav-parent-link::before{
        width:calc(100% - 24px) !important;
    }
}

/* Service-area right panel hierarchy and breathing room. */
.sts-service-area-panel .sts-section-kicker{
    margin-bottom:10px !important;
}

.sts-service-area-panel h3{
    margin-top:0 !important;
    margin-bottom:22px !important;
}

.sts-area-chip-grid{
    margin-bottom:26px !important;
}

.sts-service-area-copy{
    margin:0 0 26px !important;
}

.sts-service-area-panel > .sts-btn{
    margin-top:0 !important;
    min-height:52px;
    padding-left:20px;
    padding-right:20px;
}

@media(max-width:620px){
    .sts-service-area-copy{
        margin-bottom:22px !important;
    }
}

/* =========================================================
   V38 — CONTACT FAQ ROW INDEPENDENCE
   Keep each FAQ card only as tall as its own content.
   CSS Grid otherwise stretches the neighbouring card in the row.
   ========================================================= */
.sts-owner-faq-grid{
    align-items:start !important;
}
.sts-owner-faq-grid > details{
    align-self:start !important;
    height:auto !important;
    min-height:0 !important;
}

/* =========================================================
   V39 — FAQ OPEN / CLOSE TRANSITIONS
   Smooth accordion motion on the FAQ page and Contact page.
   ========================================================= */
.sts-owner-faq-grid > details{
    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        background-color .22s ease;
}

.sts-owner-faq-grid > details > summary{
    transition:
        color .2s ease,
        background-color .2s ease;
}

.sts-owner-faq-grid > details > summary::after{
    transition:
        transform .28s cubic-bezier(.22,.61,.36,1),
        color .2s ease;
}

.sts-owner-faq-grid > details[open] > summary::after{
    content:"+" !important;
    transform:translateY(-50%) rotate(45deg) !important;
}

.sts-owner-faq-grid .sts-faq-answer{
    opacity:0;
    transform:translateY(-10px);
    transition:
        opacity .22s ease,
        transform .28s cubic-bezier(.22,.61,.36,1);
    will-change:opacity,transform;
}

.sts-owner-faq-grid > details[open]:not(.is-opening):not(.is-closing) .sts-faq-answer,
.sts-owner-faq-grid > details.is-opening .sts-faq-answer{
    opacity:1;
    transform:translateY(0);
}

.sts-owner-faq-grid > details.is-closing .sts-faq-answer{
    opacity:0;
    transform:translateY(-8px);
}

.sts-owner-faq-grid > details[open]{
    border-color:rgba(5,137,214,.24);
    box-shadow:0 14px 30px rgba(5,38,56,.08);
}

.sts-owner-faq-grid > details[open] > summary{
    color:var(--blue);
    background:linear-gradient(90deg,rgba(5,137,214,.045),rgba(19,153,60,.025));
}

@media (hover:hover) and (pointer:fine){
    .sts-owner-faq-grid > details:not([open]) > summary:hover{
        color:var(--blue);
        background:#f8fcfe;
    }
}

@media (prefers-reduced-motion:reduce){
    .sts-owner-faq-grid > details,
    .sts-owner-faq-grid > details > summary,
    .sts-owner-faq-grid > details > summary::after,
    .sts-owner-faq-grid .sts-faq-answer{
        transition:none !important;
        animation:none !important;
    }
}

/* =========================================================
   V40 — FAQ SMOOTH ACCORDION + CLEAN OPEN STATE
   - Removes the abrupt blue/green summary strip.
   - Gives the entire open card one consistent treatment.
   - Answer fade is synchronized with the height animation.
   ========================================================= */
.sts-owner-faq-grid > details,
.sts-owner-faq-grid > details[open] {
    background:#fff !important;
    border:1px solid #d6e6ee !important;
    box-shadow:0 7px 20px rgba(5,38,56,.05) !important;
    overflow:hidden !important;
    transform:translateZ(0);
}

.sts-owner-faq-grid > details[open] {
    border-color:rgba(5,137,214,.32) !important;
    box-shadow:0 16px 34px rgba(5,38,56,.09) !important;
}

/* Keep the question area clean — no half-width coloured band. */
.sts-owner-faq-grid > details > summary,
.sts-owner-faq-grid > details[open] > summary {
    background:#fff !important;
    color:var(--ink) !important;
    border:0 !important;
    transition:color .22s ease, background-color .22s ease !important;
}

.sts-owner-faq-grid > details[open] > summary {
    color:var(--blue) !important;
}

/* A subtle full-width divider is cleaner than the cut-off background. */
.sts-owner-faq-grid > details[open] > summary {
    box-shadow:inset 0 -1px 0 rgba(5,137,214,.10);
}

/* Plus rotates smoothly into an X. */
.sts-owner-faq-grid > details > summary::after {
    content:"+" !important;
    transform:translateY(-50%) rotate(0deg) !important;
    transform-origin:center;
    transition:transform .38s cubic-bezier(.22,.61,.36,1), color .22s ease !important;
}

.sts-owner-faq-grid > details[open] > summary::after,
.sts-owner-faq-grid > details.is-opening > summary::after {
    transform:translateY(-50%) rotate(45deg) !important;
}

.sts-owner-faq-grid .sts-faq-answer {
    opacity:0;
    transform:translateY(-6px);
    transition:none !important;
    will-change:opacity,transform;
}

.sts-owner-faq-grid > details.is-opened .sts-faq-answer,
.sts-owner-faq-grid > details.is-opening .sts-faq-answer {
    opacity:1;
    transform:translateY(0);
}

@media (hover:hover) and (pointer:fine) {
    .sts-owner-faq-grid > details:not([open]) > summary:hover {
        background:#fbfdfe !important;
        color:var(--blue) !important;
    }
}

@media (prefers-reduced-motion:reduce) {
    .sts-owner-faq-grid > details,
    .sts-owner-faq-grid > details > summary::after,
    .sts-owner-faq-grid .sts-faq-answer {
        transition:none !important;
        animation:none !important;
    }
}
/* =========================================================
   HOME HERO GOOGLE RATING — BELOW ENTIRE TRUST ROW
   More space ABOVE badge, less empty space BELOW
   ========================================================= */

/* Keep all three trust statements on one clean row */
.sts-hero-trust{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:0 !important;
    margin-top:36px !important;
    margin-bottom:0 !important;
    width:100%;
}

.sts-hero-trust-item{
    min-height:34px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding:0 23px 0 0;
    margin:0 23px 0 0;
    border-right:1px solid rgba(255,255,255,.18);
    font-size:13px;
}

.sts-hero-trust-item:last-child{
    margin-right:0;
    padding-right:0;
    border-right:0;
}

.sts-hero-trust-line{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    white-space:nowrap;
}

/* Google badge gets its OWN row below all three checkmarks */
.sts-hero-google-rating-row{
    width:100%;
    display:flex;
    justify-content:flex-start;
    align-items:flex-start;

    /* More breathing room ABOVE the badge */
    margin-top:26px !important;

    /* Remove unnecessary space underneath */
    margin-bottom:0 !important;

    padding:0 !important;
}

/* Actual Google widget */
.sts-hero-google-rating{
    width:auto;
    max-width:320px;
    margin:0 !important;
    padding:0 !important;
    line-height:1;
}

/* Prevent plugin wrapper from centering itself */
.sts-hero-google-rating > *{
    margin-left:0 !important;
    margin-right:auto !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    max-width:100% !important;
}

.sts-hero-google-rating iframe,
.sts-hero-google-rating [class*="grwi"],
.sts-hero-google-rating [id*="grwi"]{
    margin-left:0 !important;
    margin-right:auto !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    max-width:100% !important;
}

/*
 * Reduce empty navy space underneath the Google badge.
 * This overrides the older V9/V12 hero-copy bottom padding.
 */
.sts-home-hero .sts-hero-copy{
    padding-bottom:46px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    .sts-hero-trust{
        flex-wrap:wrap !important;
        row-gap:12px !important;
    }

    .sts-hero-google-rating-row{
        margin-top:24px !important;
        margin-bottom:0 !important;
    }

    .sts-home-hero .sts-hero-copy{
        padding-bottom:42px !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    .sts-hero-trust{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:12px !important;
        max-width:430px;
        margin-bottom:0 !important;
    }

    .sts-hero-trust-item{
        width:100%;
        margin:0;
        padding:0;
        border-right:0;
    }

    .sts-hero-trust-line{
        white-space:normal;
    }

    .sts-hero-google-rating-row{
        width:100%;
        max-width:430px;

        margin-top:22px !important;
        margin-bottom:0 !important;

        justify-content:flex-start;
    }

    .sts-hero-google-rating{
        max-width:100%;
    }

    .sts-home-hero .sts-hero-copy{
        padding-bottom:36px !important;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media(max-width:520px){

    .sts-hero-google-rating-row{
        margin-top:20px !important;
    }

    .sts-home-hero .sts-hero-copy{
        padding-bottom:30px !important;
    }
}

/* Speedline contact form + homepage Google rating additions */
.sts-contact-form-panel{padding:38px;border-radius:18px;background:#fff;box-shadow:0 18px 50px rgba(0,35,52,.08)}
.sts-contact-form-panel h2{margin:6px 0 10px}.sts-contact-form-intro{margin-bottom:28px}.sts-contact-form-wrap{margin-top:20px}.sts-contact-form-note{margin:18px 0 0;font-size:14px;opacity:.72}
.sts-contact-form-wrap .ff-el-form-control{border-radius:8px!important;min-height:48px}.sts-contact-form-wrap textarea.ff-el-form-control{min-height:140px}.sts-contact-form-wrap .ff-btn-submit{background:#12a847!important;border:0!important;border-radius:999px!important;padding:15px 28px!important;font-weight:800!important;text-transform:uppercase}
.sts-home-google-rating-section{padding:44px 0;background:#fff}.sts-home-google-rating-inner{display:flex;align-items:center;justify-content:space-between;gap:50px}.sts-home-google-rating-copy{max-width:620px}.sts-home-google-rating-copy h2{margin:5px 0 8px}.sts-home-google-rating-copy p:last-child{margin-bottom:0}.sts-home-google-rating-widget{flex:0 0 auto;min-width:280px}.sts-home-google-rating-widget>*{margin:0!important}
@media(max-width:850px){.sts-home-google-rating-inner{display:block}.sts-home-google-rating-widget{margin-top:24px;min-width:0}.sts-contact-form-panel{padding:24px}}


/* =========================================================
   SINGLE SERVICE — VIEW ALL SERVICES BUTTON
   ========================================================= */

.sts-single-related-services .sts-section-title-row{
    align-items:flex-end;
}

.sts-related-services-all{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:48px;
    padding:13px 22px !important;

    background:#078dd2 !important;
    color:#fff !important;

    border:0 !important;
    border-radius:999px !important;

    font-size:14px;
    font-weight:800;
    line-height:1;

    text-decoration:none !important;
    white-space:nowrap;

    box-shadow:0 10px 22px rgba(7,141,210,.18);

    transition:
        transform .2s ease,
        background-color .2s ease,
        box-shadow .2s ease;
}

.sts-related-services-all:hover{
    background:#0678b3 !important;
    color:#fff !important;

    transform:translateY(-2px);

    box-shadow:0 14px 28px rgba(7,141,210,.26);
}

.sts-related-services-all:focus{
    color:#fff !important;
    outline:3px solid rgba(7,141,210,.22);
    outline-offset:3px;
}

/* Mobile */
@media(max-width:760px){

    .sts-single-related-services .sts-section-title-row{
        align-items:flex-start;
    }

    .sts-related-services-all{
        margin-top:16px;
    }
}



/* =========================================================
   SPEEDLINE PHOTO UPLOADER
   ========================================================= */

.sts-custom-photo-upload{
    margin:0 0 24px !important;
}

.sts-photo-upload-block{
    width:100%;
    padding:22px;

    background:#f8fbfd;

    border:1px solid #d8e6ed;
    border-radius:14px;
}


/* =========================================================
   HEADING
   ========================================================= */

.sts-photo-upload-heading{
    display:flex;
    align-items:center;
    gap:10px;

    margin-bottom:8px;
}

.sts-photo-upload-heading strong{
    color:#06283a;

    font-size:15px;
    font-weight:800;
}

.sts-photo-upload-heading span{
    display:inline-flex;
    align-items:center;

    padding:4px 9px;

    color:#50646f;
    background:#edf3f6;

    border-radius:999px;

    font-size:11px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.05em;
}


/* =========================================================
   HELP TEXT
   ========================================================= */

.sts-photo-upload-help{
    max-width:760px;

    margin:0 0 16px;

    color:#50646f;

    font-size:14px;
    line-height:1.6;
}


/* =========================================================
   UPLOAD BUTTON / DROPZONE
   ========================================================= */

.sts-photo-upload-dropzone{
    appearance:none;
    -webkit-appearance:none;

    width:100%;
    min-height:135px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    padding:22px;

    background:#fff;

    border:2px dashed #b9d5e2;
    border-radius:12px;

    color:inherit;

    font-family:inherit;

    cursor:pointer;

    transition:
        border-color .2s ease,
        background-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}

.sts-photo-upload-dropzone:hover{
    border-color:#078dd2;

    background:#f3faff;

    box-shadow:0 8px 22px rgba(7,141,210,.08);
}

.sts-photo-upload-dropzone:focus-visible{
    outline:none;

    border-color:#078dd2;

    box-shadow:
        0 0 0 3px rgba(7,141,210,.14),
        0 8px 22px rgba(7,141,210,.08);
}


/* =========================================================
   PLUS ICON
   ========================================================= */

.sts-photo-upload-icon{
    width:40px;
    height:40px;

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

    margin-bottom:9px;

    color:#fff;

    background:#078dd2;

    border-radius:50%;

    font-size:25px;
    font-weight:700;
    line-height:1;
}


/* =========================================================
   TEXT
   ========================================================= */

.sts-photo-upload-title{
    color:#06283a;

    font-size:15px;
    font-weight:800;
}

.sts-photo-upload-subtitle{
    margin-top:4px;

    color:#6c7f89;

    font-size:13px;
}


/* =========================================================
   LIMITS
   ========================================================= */

.sts-photo-upload-limits{
    margin:13px 0 0;

    color:#75858d;

    font-size:12px;
    line-height:1.5;
}


/* =========================================================
   PHOTO PREVIEWS
   ========================================================= */

.sts-photo-upload-preview{
    display:grid;
    grid-template-columns:repeat(5, minmax(0,1fr));

    gap:12px;

    margin-top:16px;
}

.sts-photo-preview-item{
    min-width:0;
}

.sts-photo-preview-item img{
    width:100%;
    aspect-ratio:1 / 1;

    display:block;

    object-fit:cover;

    background:#fff;

    border:1px solid #d8e6ed;
    border-radius:10px;
}

.sts-photo-preview-item span{
    display:block;

    margin-top:5px;

    overflow:hidden;

    color:#60727c;

    font-size:11px;

    text-overflow:ellipsis;
    white-space:nowrap;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    .sts-photo-upload-block{
        padding:18px;
    }

    .sts-photo-upload-dropzone{
        min-height:120px;

        padding:18px;
    }

    .sts-photo-upload-preview{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }
}
/* =========================================================
   CONTACT FORM — RADIO GROUPS + SERVICE DROPDOWN
   ========================================================= */

/* ---------------------------------------------------------
   RADIO GROUP TITLES
   Preferred Contact Method / Preferred Contact Time
   --------------------------------------------------------- */

.sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
.ff-el-input--label {
    margin-bottom: 10px !important;
}

.sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
.ff-el-input--label > label {
    display: block;
    margin: 0 !important;

    color: #06283a !important;

    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}


/* ---------------------------------------------------------
   RADIO OPTIONS
   --------------------------------------------------------- */

.sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
.ff-el-input--content {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
.ff-el-form-check {
    margin: 0 !important;
}


/* clickable option */

.sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
.ff-el-form-check-label {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;

    min-height: 42px;
    padding: 9px 15px !important;
    margin: 0 !important;

    background: #f7fafb;
    border: 1px solid #d7e2e7;
    border-radius: 10px;

    color: #415965 !important;

    font-size: 14px !important;
    font-weight: 600 !important;

    cursor: pointer;

    transition:
        border-color .18s ease,
        background-color .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

.sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
.ff-el-form-check-label:hover {
    border-color: #078dd2;
    background: #f1f9fd;
    color: #06283a !important;
}


/* ---------------------------------------------------------
   CUSTOM RADIO CIRCLE
   --------------------------------------------------------- */

.sts-contact-form-wrap input[type="radio"].ff-el-form-check-input {
    appearance: none !important;
    -webkit-appearance: none !important;

    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;

    margin: 0 !important;

    background: #fff !important;
    border: 2px solid #9eb0ba !important;
    border-radius: 50% !important;

    box-shadow: none !important;

    cursor: pointer;
    position: relative;
}

.sts-contact-form-wrap input[type="radio"].ff-el-form-check-input:checked {
    border-color: #078dd2 !important;
    background:
        radial-gradient(
            circle,
            #078dd2 0 4px,
            #fff 4.5px
        ) !important;
}


/* selected option card */

.sts-contact-form-wrap .ff-el-form-check-label:has(
    input[type="radio"]:checked
) {
    background: #eef9ff !important;
    border-color: #078dd2 !important;

    color: #06283a !important;

    box-shadow: 0 0 0 1px rgba(7,141,210,.08);

    font-weight: 700 !important;
}


/* keyboard accessibility */

.sts-contact-form-wrap .ff-el-form-check-label:has(
    input[type="radio"]:focus-visible
) {
    outline: 3px solid rgba(7,141,210,.18);
    outline-offset: 2px;
}


/* =========================================================
   SERVICE REQUESTED DROPDOWN
   ========================================================= */

.sts-contact-form-wrap #ff_1_dropdown {
    width: 100% !important;
    height: 50px !important;

    padding: 0 46px 0 16px !important;

    color: #193747 !important;
    background-color: #fff !important;

    border: 1px solid #d5e0e5 !important;
    border-radius: 10px !important;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 500 !important;

    cursor: pointer;

    appearance: none !important;
    -webkit-appearance: none !important;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2306283a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;

    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    background-size: 14px !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background-color .18s ease;
}


/* hover */

.sts-contact-form-wrap #ff_1_dropdown:hover {
    border-color: #9fc6d9 !important;
}


/* focus */

.sts-contact-form-wrap #ff_1_dropdown:focus {
    outline: none !important;

    border-color: #078dd2 !important;

    box-shadow:
        0 0 0 3px rgba(7,141,210,.12) !important;
}


/* Placeholder */

.sts-contact-form-wrap #ff_1_dropdown:invalid {
    color: #71828b !important;
}


/* Dropdown options */

.sts-contact-form-wrap #ff_1_dropdown option {
    color: #193747;
    background: #fff;

    font-size: 14px;
    font-weight: 500;
}


/* =========================================================
   SPACING
   ========================================================= */

.sts-contact-form-wrap
.ff-t-container:has(input[type="radio"]) {
    margin-top: 4px !important;
    margin-bottom: 22px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
    .ff-el-input--content {
        gap: 7px;
    }

    .sts-contact-form-wrap .ff-el-group:has(input[type="radio"])
    .ff-el-form-check-label {
        min-height: 40px;
        padding: 8px 12px !important;
    }

    .sts-contact-form-wrap #ff_1_dropdown {
        height: 48px !important;
    }
}


/* =========================================================
   V41 — SERVICES DROPDOWN / MOBILE SUBMENU FINAL FIX
   ---------------------------------------------------------
   This block intentionally DOES NOT change .sts-mobile-toggle
   or its three bars. The existing hamburger stays exactly as-is.
   ========================================================= */

/* ---------- DESKTOP ---------- */
@media (min-width:821px){

    .sts-nav-services{
        position:relative !important;
        height:132px !important;
        display:flex !important;
        align-items:center !important;
    }

    .sts-nav-services-topline{
        height:132px !important;
        display:flex !important;
        align-items:center !important;
    }

    .sts-main-nav .sts-nav-parent-link{
        height:132px !important;
        min-height:132px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        padding:0 18px !important;
    }

    /* Desktop doesn't need a separate icon/button. */
    .sts-services-submenu-toggle{
        display:none !important;
    }

    .sts-services-dropdown{
        position:absolute !important;
        left:50% !important;
        top:calc(100% - 13px) !important;

        width:700px !important;
        max-width:calc(100vw - 40px) !important;

        padding:0 !important;
        overflow:hidden !important;

        border:1px solid #d6e6ed !important;
        border-radius:16px !important;
        background:#fff !important;
        box-shadow:0 22px 52px rgba(3,28,42,.16) !important;

        opacity:0 !important;
        visibility:hidden !important;
        pointer-events:none !important;
        transform:translate(-50%,8px) !important;

        transition:
            opacity .16s ease,
            visibility .16s ease,
            transform .2s ease !important;

        z-index:500 !important;
    }

    /* JS controls the desktop menu so the large wrapper is not a hover target. */
    .sts-nav-services:hover .sts-services-dropdown,
    .sts-nav-services:focus-within .sts-services-dropdown,
    .sts-nav-services.submenu-open .sts-services-dropdown{
        opacity:0 !important;
        visibility:hidden !important;
        pointer-events:none !important;
        transform:translate(-50%,8px) !important;
    }

    .sts-nav-services.is-dropdown-open .sts-services-dropdown{
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        transform:translate(-50%,0) !important;
    }

    .sts-services-dropdown-head{
        min-height:58px !important;
        margin:0 !important;
        padding:0 20px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:20px !important;

        background:#f8fbfd !important;
        border:0 !important;
        border-bottom:1px solid #e1ecf1 !important;
    }

    .sts-services-dropdown-head span{
        color:var(--green) !important;
        font-size:11px !important;
        font-weight:900 !important;
        letter-spacing:.14em !important;
        text-transform:uppercase !important;
    }

    .sts-services-dropdown-head a{
        min-height:0 !important;
        height:auto !important;
        padding:8px 11px !important;

        color:var(--blue) !important;
        background:transparent !important;
        border:0 !important;
        border-radius:999px !important;

        font-size:12px !important;
        font-weight:900 !important;
        line-height:1 !important;
        text-decoration:none !important;
    }

    .sts-services-dropdown-head a:hover{
        background:#edf8fd !important;
    }

    .sts-services-dropdown-grid{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:0 !important;
        padding:10px 16px 14px !important;
    }

    .sts-services-dropdown-grid > a{
        min-height:48px !important;
        height:auto !important;

        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;

        padding:0 12px !important;

        color:var(--ink) !important;
        background:transparent !important;

        border:0 !important;
        border-bottom:1px solid #edf3f6 !important;
        border-radius:0 !important;

        font-size:14px !important;
        font-weight:800 !important;
        line-height:1.3 !important;
        text-decoration:none !important;

        transform:none !important;
        transition:
            color .16s ease,
            background-color .16s ease !important;
    }

    .sts-services-dropdown-grid > a::before,
    .sts-services-dropdown-grid > a::after{
        content:none !important;
        display:none !important;
    }

    .sts-services-dropdown-grid > a:hover{
        color:var(--blue) !important;
        background:#f3f9fc !important;
        transform:none !important;
    }

    .sts-services-dropdown-grid > a:nth-last-child(2):not(.sts-services-dropdown-emergency){
        border-bottom-color:transparent !important;
    }

    .sts-services-dropdown-grid > .sts-services-dropdown-emergency{
        grid-column:1 / -1 !important;

        min-height:50px !important;
        margin-top:10px !important;
        padding:0 14px !important;

        color:#b4232f !important;
        background:#fff7f7 !important;

        border:1px solid #f0d1d5 !important;
        border-radius:10px !important;
    }

    .sts-services-dropdown-grid > .sts-services-dropdown-emergency:hover{
        color:#9d1f2a !important;
        background:#fff0f1 !important;
    }
}


/* ---------- MOBILE ---------- */
@media (max-width:820px){

    /*
     * IMPORTANT:
     * Nothing below targets .sts-mobile-toggle.
     * Your reverted hamburger styling remains untouched.
     */

    .sts-nav-services{
        width:100% !important;
        height:auto !important;
        display:block !important;
        margin:0 !important;
    }

    /*
     * Services gets the exact same visual row as About/Blog/FAQ/Contact.
     * The small chevron is placed to the right without creating that
     * ugly long grey rectangle from the previous version.
     */
    .sts-nav-services-topline{
        position:relative !important;
        width:100% !important;
        height:auto !important;

        display:block !important;

        margin:0 !important;
        padding:0 !important;

        border:0 !important;
        background:transparent !important;
    }

    .sts-main-nav .sts-nav-parent-link{
        width:100% !important;
        height:auto !important;
        min-height:0 !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        padding:15px 52px 15px 20px !important;

        color:var(--ink) !important;
        background:transparent !important;

        font-size:17px !important;
        font-weight:900 !important;
        line-height:1.2 !important;
        text-align:center !important;
    }

    .sts-main-nav .sts-nav-parent-link::before,
    .sts-main-nav .sts-nav-parent-link::after{
        display:none !important;
        content:none !important;
    }

    .sts-nav-services.is-active .sts-nav-parent-link{
        color:var(--blue) !important;
    }

    /*
     * Small CHEVRON only.
     * No plus, no circle, no box, no visible button background.
     */
    .sts-services-submenu-toggle{
        position:absolute !important;
        top:50% !important;
        right:12px !important;

        width:38px !important;
        height:38px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        padding:0 !important;
        margin:0 !important;

        border:0 !important;
        border-radius:0 !important;
        outline:0 !important;

        background:transparent !important;
        box-shadow:none !important;

        color:#78909d !important;
        cursor:pointer !important;

        transform:translateY(-50%) !important;
        appearance:none !important;
        -webkit-appearance:none !important;

        font-size:0 !important;
        line-height:1 !important;
    }

    .sts-services-submenu-toggle:hover,
    .sts-services-submenu-toggle:focus,
    .sts-services-submenu-toggle:active{
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        color:var(--blue) !important;
    }

    .sts-services-submenu-toggle svg,
    .sts-services-submenu-toggle span{
        display:none !important;
    }

    .sts-services-submenu-toggle::before{
        content:"" !important;
        display:block !important;

        width:8px !important;
        height:8px !important;

        border-right:2px solid currentColor !important;
        border-bottom:2px solid currentColor !important;

        transform:translateY(-2px) rotate(45deg) !important;
        transition:transform .2s ease !important;
    }

    .sts-nav-services.submenu-open .sts-services-submenu-toggle{
        color:var(--blue) !important;
    }

    .sts-nav-services.submenu-open .sts-services-submenu-toggle::before{
        transform:translateY(2px) rotate(225deg) !important;
    }

    /*
     * Mobile submenu is collapsed by default and expands INSIDE
     * the existing white mobile nav.
     */
    .sts-services-dropdown{
        position:static !important;

        width:100% !important;
        max-width:none !important;

        display:none !important;

        margin:0 !important;
        padding:5px 12px 12px !important;

        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        transform:none !important;

        overflow:hidden !important;

        border:0 !important;
        border-radius:0 !important;

        background:#f7fbfd !important;
        box-shadow:none !important;
    }

    .sts-nav-services.submenu-open .sts-services-dropdown{
        display:block !important;
    }

    .sts-services-dropdown-head{
        min-height:40px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:14px !important;

        margin:0 !important;
        padding:0 8px !important;

        border:0 !important;
        border-bottom:1px solid #e2edf2 !important;

        background:transparent !important;
    }

    .sts-services-dropdown-head span{
        color:var(--green) !important;
        font-size:10px !important;
        font-weight:900 !important;
        letter-spacing:.12em !important;
        text-transform:uppercase !important;
    }

    .sts-services-dropdown-head a{
        width:auto !important;
        min-height:0 !important;
        height:auto !important;

        display:inline-flex !important;
        align-items:center !important;

        padding:7px 0 !important;

        color:var(--blue) !important;
        background:transparent !important;
        border:0 !important;

        font-size:11px !important;
        font-weight:900 !important;
        line-height:1 !important;
        text-align:right !important;
    }

    .sts-services-dropdown-grid{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:0 !important;

        padding:4px 0 0 !important;
    }

    .sts-services-dropdown-grid > a{
        width:100% !important;
        min-height:40px !important;
        height:auto !important;

        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;

        padding:9px 8px !important;

        color:var(--ink) !important;
        background:transparent !important;

        border:0 !important;
        border-bottom:1px solid #e6eff3 !important;
        border-radius:0 !important;

        font-size:13px !important;
        font-weight:800 !important;
        line-height:1.25 !important;
        text-align:left !important;

        transform:none !important;
    }

    .sts-services-dropdown-grid > a::before,
    .sts-services-dropdown-grid > a::after{
        display:none !important;
        content:none !important;
    }

    .sts-services-dropdown-grid > a:last-child{
        border-bottom:0 !important;
    }

    .sts-services-dropdown-grid > .sts-services-dropdown-emergency{
        margin-top:6px !important;
        padding:10px !important;

        color:#b4232f !important;
        background:#fff5f6 !important;

        border:1px solid #f0d1d5 !important;
        border-radius:8px !important;
    }
}


/* =========================================================
   V42 — ACTUAL CURRENT FILE FIX
   MOBILE SERVICES TRUE CENTER + SMOOTH EXPAND
   ---------------------------------------------------------
   IMPORTANT:
   - This is appended to the CURRENT stylesheet.
   - It overrides the V41 mobile rules above.
   - It does NOT change the main hamburger icon.
   ========================================================= */

@media (max-width:820px){

    /* -----------------------------------------------------
       TOP-LEVEL MOBILE NAV ROWS
       ----------------------------------------------------- */

    .sts-main-nav{
        align-items:stretch !important;
    }

    .sts-main-nav > a,
    .sts-nav-services{
        width:100% !important;
        max-width:none !important;
        box-sizing:border-box !important;
        margin:0 !important;
    }

    /* Keep About / Blog / FAQ / Contact on one identical center line */
    .sts-main-nav > a{
        min-height:58px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        padding:15px 20px !important;

        text-align:center !important;

        border-bottom:1px solid #e4edf1 !important;
    }


    /* -----------------------------------------------------
       SERVICES ROW — TRUE CENTER
       ----------------------------------------------------- */

    .sts-nav-services-topline{
        position:relative !important;

        width:100% !important;
        min-height:58px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        margin:0 !important;
        padding:0 !important;

        border-bottom:1px solid #e4edf1 !important;
        background:transparent !important;
    }

    /*
     * THIS is the centering fix.
     *
     * V41 had:
     * padding: 15px 52px 15px 20px
     *
     * which physically shifted "Services" to the left.
     *
     * The link now occupies the full row with equal padding.
     */
    .sts-main-nav .sts-nav-services .sts-nav-parent-link{
        position:relative !important;

        width:100% !important;
        min-width:0 !important;
        max-width:none !important;

        min-height:58px !important;
        height:58px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        margin:0 !important;
        padding:15px 20px !important;

        box-sizing:border-box !important;

        color:var(--blue) !important;

        font-size:17px !important;
        font-weight:900 !important;
        line-height:1 !important;

        text-align:center !important;
        text-indent:0 !important;

        transform:none !important;
    }

    .sts-main-nav .sts-nav-services .sts-nav-parent-link::before,
    .sts-main-nav .sts-nav-services .sts-nav-parent-link::after{
        content:none !important;
        display:none !important;
    }


    /*
     * Arrow floats independently on the right.
     * It therefore takes ZERO width away from the centered text.
     */
    .sts-main-nav .sts-nav-services .sts-services-submenu-toggle{
        position:absolute !important;

        top:50% !important;
        right:8px !important;
        left:auto !important;

        width:42px !important;
        height:42px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        margin:0 !important;
        padding:0 !important;

        border:0 !important;
        border-radius:0 !important;
        outline:0 !important;

        background:transparent !important;
        box-shadow:none !important;

        color:var(--blue) !important;

        transform:translateY(-50%) !important;

        appearance:none !important;
        -webkit-appearance:none !important;

        cursor:pointer !important;
        z-index:3 !important;
    }

    .sts-services-submenu-toggle::before{
        content:"" !important;

        display:block !important;

        width:8px !important;
        height:8px !important;

        border-right:2px solid currentColor !important;
        border-bottom:2px solid currentColor !important;

        transform:translateY(-2px) rotate(45deg) !important;

        transition:
            transform .28s cubic-bezier(.22,.61,.36,1),
            color .2s ease !important;
    }

    .sts-nav-services.submenu-open .sts-services-submenu-toggle::before{
        transform:translateY(2px) rotate(225deg) !important;
    }


    /* -----------------------------------------------------
       SMOOTH SERVICES EXPAND / COLLAPSE
       ----------------------------------------------------- */

    /*
     * V41 uses display:none / display:block.
     * That CANNOT animate.
     *
     * We force display:block permanently and animate max-height,
     * opacity and padding instead. Because the submenu remains in
     * normal document flow, About / Blog / FAQ / Contact smoothly
     * move down when this opens.
     */
    .sts-main-nav .sts-nav-services .sts-services-dropdown{
        position:static !important;

        display:block !important;

        width:100% !important;
        max-width:none !important;

        max-height:0 !important;

        margin:0 !important;
        padding:0 12px !important;

        overflow:hidden !important;

        opacity:0 !important;
        visibility:hidden !important;
        pointer-events:none !important;

        border:0 !important;
        border-radius:0 !important;

        background:#f7fbfd !important;
        box-shadow:none !important;

        transform:translateY(-8px) !important;

        transition:
            max-height .42s cubic-bezier(.22,.61,.36,1),
            opacity .20s ease,
            transform .30s ease,
            padding-top .30s ease,
            padding-bottom .30s ease,
            visibility 0s linear .42s !important;
    }

    .sts-main-nav .sts-nav-services.submenu-open .sts-services-dropdown{
        display:block !important;

        max-height:700px !important;

        padding-top:6px !important;
        padding-bottom:12px !important;

        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;

        transform:translateY(0) !important;

        transition:
            max-height .46s cubic-bezier(.22,.61,.36,1),
            opacity .20s ease .05s,
            transform .30s ease,
            padding-top .30s ease,
            padding-bottom .30s ease,
            visibility 0s linear 0s !important;
    }


    /* -----------------------------------------------------
       SUBMENU CONTENT
       ----------------------------------------------------- */

    .sts-services-dropdown-head{
        width:100% !important;
        box-sizing:border-box !important;
    }

    .sts-services-dropdown-grid{
        width:100% !important;
        box-sizing:border-box !important;
    }
}
/* =========================================================
   MOBILE SERVICES DROPDOWN — SOFTER ROUNDED PANEL
   ========================================================= */
@media (max-width:820px){

    .sts-main-nav .sts-nav-services .sts-services-dropdown{
        margin:0 10px !important;
        width:calc(100% - 20px) !important;

        border:1px solid #dbe8ee !important;
        border-radius:14px !important;

        background:#f8fbfd !important;

        overflow:hidden !important;

        box-shadow:
            0 8px 22px rgba(3,28,42,.06) !important;
    }

    .sts-nav-services.submenu-open .sts-services-dropdown{
        margin-top:4px !important;
        margin-bottom:8px !important;
    }

    .sts-services-dropdown-head{
        padding-left:14px !important;
        padding-right:14px !important;

        background:#f8fbfd !important;
    }

    .sts-services-dropdown-grid{
        padding-left:10px !important;
        padding-right:10px !important;
        padding-bottom:10px !important;
    }

    .sts-services-dropdown-grid > a{
        padding-left:8px !important;
        padding-right:8px !important;
    }

    .sts-services-dropdown-grid > .sts-services-dropdown-emergency{
        margin:8px 0 0 !important;

        border-radius:9px !important;
    }
}
/* =========================================================
   MOBILE NAV — FULL SCREEN WHITE PANEL
   ========================================================= */
@media (max-width:820px){

    body.sts-menu-open{
        overflow:hidden !important;
    }

    .sts-main-nav.is-open{
        position:fixed !important;

        top:90px !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;

        width:100vw !important;
        height:calc(100dvh - 90px) !important;
        max-height:none !important;

        display:flex !important;
        flex-direction:column !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;

        padding:22px 22px 34px !important;

        background:#fff !important;

        border:0 !important;
        border-radius:0 !important;
        box-shadow:none !important;

        overscroll-behavior:contain !important;
        -webkit-overflow-scrolling:touch !important;

        z-index:9999 !important;
    }

    /* Keep the whole opened area pure white */
    .sts-main-nav.is-open::before{
        content:"";
        position:fixed;
        inset:90px 0 0 0;
        background:#fff;
        z-index:-1;
        pointer-events:none;
    }

    /* Expanded Services stays inside the white full-screen nav */
    .sts-main-nav.is-open .sts-services-dropdown{
        background:#f8fbfd !important;
    }
}


/* WordPress admin bar */
@media (max-width:782px){

    body.admin-bar .sts-main-nav.is-open{
        top:136px !important;
        height:calc(100dvh - 136px) !important;
    }

    body.admin-bar .sts-main-nav.is-open::before{
        inset:136px 0 0 0;
    }
}
/* =========================================================
   CONTACT PAGE — MOBILE EMAIL ADDRESS FIX
   ========================================================= */

@media (max-width: 760px){

    .sts-contact-method-blue .sts-contact-method-copy strong{
        font-size:18px !important;
        line-height:1.2 !important;
        white-space:nowrap !important;
        letter-spacing:-0.02em !important;
    }
}

@media (max-width: 420px){

    .sts-contact-method-blue .sts-contact-method-copy strong{
        font-size:16px !important;
    }

}
/* =========================================================
   FLUENT FORMS — SUCCESS / THANK YOU MESSAGE
   ========================================================= */

.sts-contact-form-wrap .ff-message-success{
    position:relative;

    margin:24px 0 0 !important;
    padding:22px 24px 22px 68px !important;

    color:#06283a !important;
    background:#f2fbf5 !important;

    border:1px solid #cfe9d7 !important;
    border-left:5px solid #11a344 !important;
    border-radius:14px !important;

    box-shadow:0 10px 28px rgba(3,28,42,.07) !important;

    font-size:16px !important;
    font-weight:700 !important;
    line-height:1.5 !important;

    text-align:left !important;
}

/* Green check circle */
.sts-contact-form-wrap .ff-message-success::before{
    content:"✓";

    position:absolute;
    left:22px;
    top:50%;

    width:30px;
    height:30px;

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

    color:#fff;
    background:#11a344;

    border-radius:50%;

    font-size:18px;
    font-weight:900;
    line-height:1;

    transform:translateY(-50%);
}

/* Mobile */
@media(max-width:760px){

    .sts-contact-form-wrap .ff-message-success{
        margin-top:20px !important;
        padding:18px 18px 18px 58px !important;

        border-radius:12px !important;

        font-size:15px !important;
    }

    .sts-contact-form-wrap .ff-message-success::before{
        left:17px;

        width:28px;
        height:28px;

        font-size:16px;
    }
}

/* =========================================================
   FLUENT FORMS — SERVICE MULTI SELECT / CHOICES.JS
   Polished selected pills + dropdown
   ========================================================= */

/* Main control */
.sts-contact-form-wrap .choices{
    position:relative !important;
    width:100% !important;
    margin:0 !important;
    overflow:visible !important;
}

.sts-contact-form-wrap .choices__inner{
    width:100% !important;
    min-height:56px !important;
    padding:7px 48px 7px 10px !important;

    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:7px !important;

    background:#fff !important;
    border:1px solid #d7e0e5 !important;
    border-radius:10px !important;
    box-shadow:none !important;

    transition:border-color .18s ease, box-shadow .18s ease !important;
}

.sts-contact-form-wrap .choices.is-focused .choices__inner,
.sts-contact-form-wrap .choices.is-open .choices__inner{
    border-color:#0589d6 !important;
    box-shadow:0 0 0 3px rgba(5,137,214,.10) !important;
}

/* Search / placeholder text inside the field */
.sts-contact-form-wrap .choices__input--cloned{
    min-width:145px !important;
    width:auto !important;
    margin:0 !important;
    padding:6px 2px !important;
    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    color:#50646f !important;
    font-family:inherit !important;
    font-size:14px !important;
    line-height:1.25 !important;
}

.sts-contact-form-wrap .choices__input--cloned::placeholder{
    color:#91a0a8 !important;
    opacity:1 !important;
}

/* =========================================================
   SELECTED SERVICES — CLEAN PILLS
   ========================================================= */

.sts-contact-form-wrap .choices__list--multiple{
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:7px !important;
    margin:0 !important;
    padding:0 !important;
}

.sts-contact-form-wrap .choices__list--multiple .choices__item{
    position:relative !important;
    min-height:36px !important;
    margin:0 !important;
    padding:8px 34px 8px 13px !important;

    display:inline-flex !important;
    align-items:center !important;

    color:#062337 !important;
    background:#eef8fd !important;
    border:1px solid #b9ddec !important;
    border-radius:999px !important;

    box-shadow:none !important;
    font-family:inherit !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1.15 !important;

    opacity:1 !important;
}

/* Kill Choices.js's default remove-button image / grey dot */
.sts-contact-form-wrap .choices__list--multiple .choices__button{
    position:absolute !important;
    top:50% !important;
    right:8px !important;
    transform:translateY(-50%) !important;

    width:20px !important;
    min-width:20px !important;
    height:20px !important;
    min-height:20px !important;

    margin:0 !important;
    padding:0 !important;

    display:block !important;
    overflow:hidden !important;

    color:transparent !important;
    background:none !important;
    background-image:none !important;
    border:0 !important;
    border-left:0 !important;
    border-radius:50% !important;
    box-shadow:none !important;

    opacity:1 !important;
    text-indent:-9999px !important;
    cursor:pointer !important;
}

/* Draw our own neat X */
.sts-contact-form-wrap .choices__list--multiple .choices__button::before,
.sts-contact-form-wrap .choices__list--multiple .choices__button::after{
    content:"" !important;
    position:absolute !important;
    top:50% !important;
    left:50% !important;
    width:10px !important;
    height:2px !important;
    border-radius:999px !important;
    background:#6c8491 !important;
    transition:background-color .15s ease, transform .15s ease !important;
}

.sts-contact-form-wrap .choices__list--multiple .choices__button::before{
    transform:translate(-50%,-50%) rotate(45deg) !important;
}

.sts-contact-form-wrap .choices__list--multiple .choices__button::after{
    transform:translate(-50%,-50%) rotate(-45deg) !important;
}

.sts-contact-form-wrap .choices__list--multiple .choices__button:hover{
    background:#dceef7 !important;
}

.sts-contact-form-wrap .choices__list--multiple .choices__button:hover::before{
    background:#0589d6 !important;
    transform:translate(-50%,-50%) rotate(45deg) scale(1.08) !important;
}

.sts-contact-form-wrap .choices__list--multiple .choices__button:hover::after{
    background:#0589d6 !important;
    transform:translate(-50%,-50%) rotate(-45deg) scale(1.08) !important;
}

/* =========================================================
   DROPDOWN
   ========================================================= */

.sts-contact-form-wrap .choices__list--dropdown,
.sts-contact-form-wrap .choices__list[aria-expanded]{
    z-index:80 !important;
    margin-top:7px !important;
    padding:6px !important;

    background:#fff !important;
    border:1px solid #d7e3e9 !important;
    border-radius:12px !important;
    box-shadow:0 16px 36px rgba(3,28,42,.13) !important;

    overflow:hidden !important;

    opacity:0;
    transform:translateY(-5px);
    transform-origin:top center;

    transition:opacity .16s ease, transform .16s ease !important;
}

.sts-contact-form-wrap .choices.is-open .choices__list--dropdown,
.sts-contact-form-wrap .choices.is-open .choices__list[aria-expanded]{
    opacity:1 !important;
    transform:translateY(0) !important;
}

.sts-contact-form-wrap .choices__list--dropdown .choices__list,
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__list{
    max-height:280px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain !important;
    scrollbar-width:thin !important;
    scrollbar-color:#b8c8d1 transparent !important;
}

.sts-contact-form-wrap .choices__list--dropdown .choices__list::-webkit-scrollbar,
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__list::-webkit-scrollbar{
    width:8px !important;
}

.sts-contact-form-wrap .choices__list--dropdown .choices__list::-webkit-scrollbar-thumb,
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__list::-webkit-scrollbar-thumb{
    background:#bac9d1 !important;
    border:2px solid #fff !important;
    border-radius:999px !important;
}

.sts-contact-form-wrap .choices__list--dropdown .choices__item--choice,
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__item--choice{
    position:relative !important;
    margin:2px 0 !important;
    padding:11px 13px !important;

    color:#062337 !important;
    background:transparent !important;
    border:0 !important;
    border-radius:8px !important;

    font-family:inherit !important;
    font-size:14px !important;
    font-weight:700 !important;
    line-height:1.25 !important;

    transition:background-color .14s ease, color .14s ease, padding-left .14s ease !important;
}

.sts-contact-form-wrap .choices__list--dropdown .choices__item--choice.is-highlighted,
.sts-contact-form-wrap .choices__list--dropdown .choices__item--choice:hover,
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__item--choice.is-highlighted,
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__item--choice:hover{
    color:#0589d6 !important;
    background:#eef8fd !important;
    padding-left:16px !important;
}

.sts-contact-form-wrap .choices__list--dropdown .choices__item--choice[aria-selected="true"],
.sts-contact-form-wrap .choices__list[aria-expanded] .choices__item--choice[aria-selected="true"]{
    color:#0589d6 !important;
    background:#f2f9fd !important;
}

/* Hide the little Choices.js helper text on the right */
.sts-contact-form-wrap .choices__item--choice::after{
    display:none !important;
    content:none !important;
}

/* =========================================================
   CUSTOM CHEVRON
   ========================================================= */

.sts-contact-form-wrap .choices[data-type*="select-multiple"]::after{
    content:"" !important;
    position:absolute !important;
    top:22px !important;
    right:18px !important;

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

    border:0 !important;
    border-right:2px solid #6c8491 !important;
    border-bottom:2px solid #6c8491 !important;

    transform:rotate(45deg) !important;
    transform-origin:center !important;

    pointer-events:none !important;
    transition:transform .18s ease, border-color .18s ease !important;
}

.sts-contact-form-wrap .choices[data-type*="select-multiple"].is-open::after{
    border-color:#0589d6 !important;
    transform:translateY(4px) rotate(225deg) !important;
}

/* Required/error state */
.sts-contact-form-wrap .ff-el-is-error .choices__inner,
.sts-contact-form-wrap .choices.is-error .choices__inner{
    border-color:#e84d4d !important;
    box-shadow:0 0 0 3px rgba(232,77,77,.08) !important;
}

/* =========================================================
   MOBILE MULTI SELECT
   ========================================================= */

@media(max-width:760px){

    .sts-contact-form-wrap .choices__inner{
        min-height:52px !important;
        padding:7px 42px 7px 8px !important;
        gap:6px !important;
    }

    .sts-contact-form-wrap .choices__list--multiple{
        gap:6px !important;
    }

    .sts-contact-form-wrap .choices__list--multiple .choices__item{
        min-height:34px !important;
        padding:7px 31px 7px 11px !important;
        font-size:12px !important;
    }

    .sts-contact-form-wrap .choices__list--multiple .choices__button{
        right:7px !important;
        width:18px !important;
        min-width:18px !important;
        height:18px !important;
        min-height:18px !important;
    }

    .sts-contact-form-wrap .choices__input--cloned{
        min-width:125px !important;
        font-size:13px !important;
    }

    .sts-contact-form-wrap .choices[data-type*="select-multiple"]::after{
        top:21px !important;
        right:15px !important;
    }

    .sts-contact-form-wrap .choices__list--dropdown,
    .sts-contact-form-wrap .choices__list[aria-expanded]{
        border-radius:10px !important;
    }

    .sts-contact-form-wrap .choices__list--dropdown .choices__item--choice,
    .sts-contact-form-wrap .choices__list[aria-expanded] .choices__item--choice{
        padding:12px 11px !important;
        font-size:14px !important;
    }
}
/* =========================================================
   QUOTE PHOTO UPLOAD STATUS
   ========================================================= */

.sts-photo-upload-status{
    margin-top:12px;
    padding:10px 13px;

    border-radius:8px;

    font-size:13px;
    font-weight:700;
    line-height:1.4;
}

.sts-photo-upload-status-loading{
    color:#075f8d;
    background:#eef8fd;
    border:1px solid #c6e5f4;
}

.sts-photo-upload-status-success{
    color:#087a34;
    background:#effaf3;
    border:1px solid #cbead5;
}

.sts-photo-upload-status-error{
    color:#b4232f;
    background:#fff2f3;
    border:1px solid #f2c9cd;
}
/* =========================================================
   HIDE PHOTO URL STORAGE FIELD
   ========================================================= */

.sts-photo-urls-field{
    display:none !important;
}

.ff-el-group:has([name="estimate_photos"]){
    display:none !important;
}


/* =========================================================
   UPLOAD STATUS
   ========================================================= */

.sts-photo-upload-status{
    margin-top:14px;
    padding:10px 13px;

    border-radius:8px;

    font-size:13px;
    font-weight:700;
    line-height:1.4;
}

.sts-photo-upload-status-loading{
    color:#075f8d;
    background:#eef8fd;
    border:1px solid #c6e5f4;
}

.sts-photo-upload-status-success{
    color:#087a34;
    background:#effaf3;
    border:1px solid #cbead5;
}

.sts-photo-upload-status-error{
    color:#b4232f;
    background:#fff2f3;
    border:1px solid #f2c9cd;
}


/* =========================================================
   UPLOAD PROGRESS
   ========================================================= */

.sts-photo-upload-progress{
    display:none;

    margin-top:14px;
}

.sts-photo-upload-progress.is-active{
    display:block;
}

.sts-photo-upload-progress-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

    margin-bottom:7px;

    color:#456170;

    font-size:12px;
    font-weight:700;
}

.sts-photo-upload-progress-percent{
    color:#078dd2;

    font-size:12px;
    font-weight:800;
}

.sts-photo-upload-progress-track{
    width:100%;
    height:8px;

    overflow:hidden;

    background:#e3edf2;

    border-radius:999px;
}

.sts-photo-upload-progress-bar{
    width:0;
    height:100%;

    background:#078dd2;

    border-radius:999px;

    transition:width .15s ease;
}


/* =========================================================
   SUBMIT BUTTON WHILE PHOTOS UPLOAD
   ========================================================= */

.sts-contact-form-wrap button[type="submit"]:disabled,
.sts-contact-form-wrap input[type="submit"]:disabled{
    opacity:.68 !important;
    cursor:wait !important;
}
/* =========================================================
   OWNER CARDS — 760PX AND DOWN
   Full image, no crop, no side bars.
   Card expands to the image's natural height.
   ========================================================= */

@media (max-width: 760px) {

    .sts-owner-profile-photo {
        position: relative !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;

        display: block !important;

        overflow: hidden !important;

        padding: 0 !important;
        margin: 0 !important;

        background: transparent !important;
    }

    .sts-owner-profile-photo img {
        position: relative !important;

        display: block !important;

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

        min-width: 100% !important;
        max-width: 100% !important;

        min-height: 0 !important;
        max-height: none !important;

        object-fit: unset !important;
        object-position: center !important;

        transform: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .sts-owner-profile-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        overflow: hidden;
    }
}