:root{--navy:#071f50;--green:#079b4d;--green2:#35b75a;--blue:#0b8ce8;--ink:#14264d;--muted:#61708a;--line:#e7eef2;--soft:#f6fbf8;--shadow:0 14px 38px rgba(14,58,88,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.wrap{width:min(1180px,92%);margin:auto}
.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav{height:82px;display:flex;align-items:center;gap:27px}.brand{margin-right:auto}.brand img{width:215px;height:64px;object-fit:contain;object-position:left center}.navlinks{display:flex;gap:25px;font-size:14px;font-weight:650}.navlinks a:hover,.navlinks a.active{color:var(--green)}.nav-cta{padding:12px 18px;border-radius:10px;background:linear-gradient(110deg,var(--green),#078d71);color:#fff;font-size:13px;font-weight:800}.menu-btn{display:none;border:0;background:none;font-size:27px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 21px;border-radius:10px;font-weight:800;font-size:13px;border:1px solid transparent}.btn-primary{background:linear-gradient(110deg,var(--green),#078e71);color:#fff}.btn-outline{border-color:#2cb4aa;background:#fff}.eyebrow,.kicker{font-size:12px;letter-spacing:3.4px;font-weight:900;color:var(--green);text-transform:uppercase}
.home-hero{min-height:590px;display:grid;grid-template-columns:minmax(0,1fr) minmax(540px,1fr);background:linear-gradient(100deg,#fff 0 48%,#f3fbf8 48%)}.home-copy{padding:82px 5vw 60px max(5vw,calc((100vw - 1180px)/2))}.home-copy h1{font-size:clamp(49px,5vw,72px);line-height:.98;letter-spacing:-3px;color:var(--navy);margin:16px 0 20px}.home-copy h1 span{color:var(--green)}.home-copy>p{font-size:18px;color:#4f6079;max-width:680px}.hero-actions{display:flex;gap:13px;margin:28px 0}.trust{display:flex;gap:28px;flex-wrap:wrap;margin-top:30px}.trust div{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:750}.round{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#e8f8ed;color:var(--green);font-weight:900}.home-visual{min-height:590px;background:url("../images/hero-home.png") center/cover no-repeat;position:relative}.home-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05),transparent 35%)}.home-visual .badge{position:absolute;right:5%;bottom:8%;background:rgba(255,255,255,.94);padding:16px 19px;border-radius:15px;box-shadow:var(--shadow);font-size:12px;line-height:1.8;font-weight:750}
section{padding:76px 0}.section-head{text-align:center;max-width:800px;margin:0 auto 34px}.section-head h2,.split-copy h2{font-size:clamp(31px,4vw,47px);line-height:1.05;letter-spacing:-1.5px;color:var(--navy);margin:8px 0 12px}.section-head p,.split-copy p{color:var(--muted)}.need-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.card{border:1px solid var(--line);background:#fff;border-radius:17px;box-shadow:0 8px 25px rgba(15,58,84,.06);padding:21px 17px}.card h3{font-size:17px;line-height:1.16;color:var(--navy);margin:13px 0 7px}.card p{font-size:13px;color:var(--muted);margin:0}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.service-card{padding:0;overflow:hidden}.service-card img{width:100%;height:155px;object-fit:cover}.service-card .copy{padding:18px}.service-card h3{margin:0 0 7px}.connected{background:linear-gradient(110deg,#f1faf5,#fff 58%,#f4f9ff)}.split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.feature-img{height:390px;border-radius:28px;object-fit:cover;width:100%;box-shadow:var(--shadow)}.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:22px}.flow div{padding:14px;border:1px solid #dfece7;border-radius:12px;background:#fff;text-align:center;font-size:12px;font-weight:800}.ai-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.industry-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.industry{border:1px solid var(--line);border-radius:15px;overflow:hidden;background:#fff}.industry img{height:110px;width:100%;object-fit:cover}.industry b{display:block;padding:12px;font-size:12px;line-height:1.2}.contact-area{background:linear-gradient(110deg,#f5fbf7,#fff 50%,#f4f9ff)}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr .72fr;gap:22px}.contact-info,.formbox,.contact-photo{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.contact-info{padding:30px}.contact-info h2{font-size:37px;line-height:1.05;margin:8px 0}.contact-info p,.contact-info li{color:var(--muted);font-size:13px}.contact-info ul{list-style:none;padding:0}.contact-info li{margin:13px 0}.formbox{padding:27px}.formbox h3{margin-top:0}.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{font-size:11px;font-weight:750}.field input,.field select,.field textarea{display:block;width:100%;padding:12px;border:1px solid #d8e2e7;border-radius:8px;margin-top:5px;font:inherit}.field.full{grid-column:1/-1}.field textarea{min-height:100px}.contact-photo{overflow:hidden}.contact-photo img{height:100%;min-height:430px;width:100%;object-fit:cover}.cta{padding:29px 0;background:linear-gradient(100deg,#31ad43,#078e70,#0c87db);color:#fff}.cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:25px}.cta h2{margin:0;font-size:28px}.cta p{margin:3px 0}.cta .btn{background:#fff;color:var(--green)}
.page-hero{min-height:410px;display:grid;grid-template-columns:1fr 1fr;background:#f5faf8}.page-hero-copy{padding:80px 5vw 60px max(5vw,calc((100vw - 1180px)/2))}.page-hero h1{font-size:clamp(45px,5vw,67px);line-height:1;letter-spacing:-2.5px;color:var(--navy);margin:14px 0}.page-hero p{font-size:18px;color:var(--muted);max-width:650px}.page-hero-img{background-size:cover;background-position:center;min-height:410px}.services-banner{background-image:linear-gradient(90deg,rgba(7,31,80,.12),transparent),url("../images/banner-services.jpg")}.ai-banner{background-image:linear-gradient(90deg,rgba(7,31,80,.08),transparent),url("../images/banner-ai.jpg")}.industries-banner{background-image:linear-gradient(90deg,rgba(7,31,80,.08),transparent),url("../images/banner-industries.jpg")}.about-banner{background-image:linear-gradient(90deg,rgba(7,31,80,.08),transparent),url("../images/banner-about.jpg")}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.detail-card{min-height:210px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.step{padding:24px;border-radius:17px;background:#fff;border:1px solid var(--line)}.step strong{font-size:30px;color:var(--green)}.quote-band{background:var(--navy);color:#fff}.quote-band .section-head h2,.quote-band .section-head p{color:#fff}.legal{max-width:900px}.legal h1{font-size:48px;color:var(--navy)}.legal h2{margin-top:30px;color:var(--navy)}.legal p,.legal li{color:#53627a}
footer{padding:48px 0 22px}.footer-grid{display:grid;grid-template-columns:1.45fr repeat(3,1fr);gap:38px}.footer-logo{width:225px}.footer-grid h4{margin:0 0 10px}.footer-grid a,.footer-grid p{display:block;font-size:13px;color:var(--muted);margin:7px 0}.copyright{border-top:1px solid var(--line);margin-top:30px;padding-top:15px;color:#7a8799;font-size:11px;display:flex;justify-content:space-between}
@media(max-width:980px){.navlinks{display:none}.menu-btn{display:block}.home-hero,.page-hero,.split,.contact-grid{grid-template-columns:1fr}.home-copy,.page-hero-copy{padding:55px 5%}.home-visual{min-height:430px}.need-grid{grid-template-columns:repeat(3,1fr)}.service-grid,.ai-grid{grid-template-columns:repeat(2,1fr)}.industry-grid{grid-template-columns:repeat(3,1fr)}.detail-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.brand img{width:165px}.nav-cta{display:none}.home-copy h1{letter-spacing:-2px}.hero-actions{flex-direction:column}.need-grid,.service-grid,.ai-grid,.industry-grid,.detail-grid,.steps{grid-template-columns:1fr}.fields{grid-template-columns:1fr}.field.full{grid-column:auto}.cta .wrap,.copyright{flex-direction:column;align-items:flex-start}.footer-grid{grid-template-columns:1fr 1fr}}
.contact-banner{background-image:linear-gradient(90deg,rgba(7,31,80,.12),transparent),url("../images/banner-contact.jpg")}


/* SEO/content expansion */
.content-band{background:#fff}
.soft-band{background:linear-gradient(110deg,#f4fbf7,#fff 55%,#f5f9ff)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:start}
.copy-block h2{font-size:clamp(30px,3.6vw,45px);line-height:1.08;color:var(--navy);letter-spacing:-1.2px;margin:8px 0 16px}
.copy-block h3{color:var(--navy);margin:22px 0 7px}
.copy-block p,.copy-block li{color:var(--muted)}
.check-list{list-style:none;padding:0;margin:22px 0}
.check-list li{margin:12px 0;padding-left:27px;position:relative}
.check-list li:before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:900}
.value-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.value-card{border:1px solid var(--line);border-radius:17px;padding:23px;background:#fff;box-shadow:0 8px 25px rgba(15,58,84,.05)}
.value-card h3{color:var(--navy);margin:13px 0 8px}.value-card p{color:var(--muted);font-size:13px}
.faq{max-width:900px;margin:auto}.faq details{border-bottom:1px solid var(--line);padding:17px 2px}.faq summary{cursor:pointer;font-weight:800;color:var(--navy);font-size:16px}.faq p{color:var(--muted);padding-right:25px}
.industry-detail{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.industry-detail .card{min-height:230px}
.service-links{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.service-link{padding:20px;border:1px solid var(--line);border-radius:15px;background:#fff}.service-link b{color:var(--navy);display:block;margin-bottom:6px}.service-link span{font-size:13px;color:var(--muted)}
@media(max-width:980px){.two-col,.value-grid{grid-template-columns:repeat(2,1fr)}.service-links{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.two-col,.value-grid,.service-links,.industry-detail{grid-template-columns:1fr}}

/* RSS creative effects */
.btn,.nav-cta,.card,.service-card,.industry,.value-card,.flow div,.round,.feature-img,.contact-info,.formbox,.contact-photo,.faq details{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background .28s ease,color .28s ease}
.navlinks a{position:relative}.navlinks a:after{content:"";position:absolute;left:50%;right:50%;bottom:-9px;height:2px;background:linear-gradient(90deg,var(--green),var(--blue));transition:.25s}.navlinks a:hover:after,.navlinks a.active:after{left:0;right:0}
.btn:hover,.nav-cta:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(7,155,77,.22)}
.trust-enhanced{gap:18px 28px}.trust-enhanced div{min-width:205px;padding:10px 13px 10px 8px;border-radius:18px;border:1px solid transparent;transition:.28s}.trust-enhanced div:hover{background:#fff;border-color:#dcefe5;box-shadow:0 12px 28px rgba(14,58,88,.08);transform:translateY(-3px)}
.trust-enhanced .round{width:54px;height:54px;min-width:54px;font-size:28px;background:linear-gradient(145deg,#e7f9ed,#edf8ff);box-shadow:0 8px 18px rgba(7,155,77,.08)}
.trust-enhanced div:hover .round{transform:rotate(-6deg) scale(1.08)}
.card:hover,.value-card:hover{transform:translateY(-7px);border-color:#d6eae1;box-shadow:0 18px 38px rgba(14,58,88,.12)}
.card:hover .round,.value-card:hover .round{transform:scale(1.1) rotate(-5deg)}
.service-card img,.industry img,.contact-photo img{transition:transform .55s ease,filter .35s ease}
.service-card:hover{transform:translateY(-8px);box-shadow:0 20px 42px rgba(14,58,88,.14)}.service-card:hover img{transform:scale(1.055);filter:saturate(1.07)}
.industry:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(14,58,88,.12)}.industry:hover img{transform:scale(1.08)}.industry:hover b{color:var(--green)}
.feature-img:hover{transform:scale(1.018);box-shadow:0 22px 50px rgba(14,58,88,.16)}.flow div:hover{transform:translateY(-4px);border-color:#cce9dc;box-shadow:0 10px 24px rgba(14,58,88,.08);color:var(--green)}
.contact-info:hover,.formbox:hover,.contact-photo:hover{transform:translateY(-4px);box-shadow:0 20px 45px rgba(14,58,88,.13)}.contact-photo:hover img{transform:scale(1.035)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 4px rgba(7,155,77,.08)}
.value-card .round{width:48px;height:48px;font-size:15px;background:linear-gradient(145deg,#e7f9ed,#edf8ff)}
.process-band{position:relative;overflow:hidden;background:linear-gradient(115deg,#fff 0 48%,#f7fbff 48%)}.process-grid{gap:24px;align-items:stretch}
.process-card{position:relative;padding:36px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.94);box-shadow:0 10px 30px rgba(14,58,88,.06);overflow:hidden;transition:.28s}.process-card:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(14,58,88,.11)}
.process-card .check-list li{transition:.22s}.process-card .check-list li:hover{transform:translateX(5px);color:var(--navy)}
.london-card{padding-right:150px;background:linear-gradient(105deg,#fff 0 64%,#edf7ff 64%)}.london-card:after{content:"";position:absolute;right:18px;bottom:0;width:105px;height:82%;opacity:.13;background:var(--navy);clip-path:polygon(44% 0,56% 0,58% 18%,66% 18%,64% 25%,69% 25%,67% 35%,75% 35%,71% 100%,29% 100%,25% 35%,33% 35%,31% 25%,36% 25%,34% 18%,42% 18%)}
.faq-band{position:relative;background:linear-gradient(115deg,#f4fbf7,#fff 50%,#f3f9ff)}
.faq{counter-reset:rssfaq}
.faq details{counter-increment:rssfaq;position:relative;background:rgba(255,255,255,.92);border:1px solid #e3edf0;border-radius:15px;padding:0;margin:10px 0;overflow:hidden;box-shadow:0 5px 18px rgba(14,58,88,.035)}
.faq details:nth-child(odd){background:linear-gradient(90deg,#f1fbf5 0%,#fff 38%)}
.faq details:nth-child(even){background:linear-gradient(90deg,#f1f8ff 0%,#fff 38%)}
.faq details:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--green),var(--blue));transform:scaleY(0);transition:transform .25s ease}
.faq details:hover{transform:translateX(4px);border-color:#d1e8dd;box-shadow:0 10px 25px rgba(14,58,88,.075)}
.faq details:hover:before,.faq details[open]:before{transform:scaleY(1)}
.faq summary{list-style:none;padding:17px 54px 17px 58px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before{content:"0" counter(rssfaq);position:absolute;left:20px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:900;letter-spacing:1px;color:var(--green)}
.faq details:nth-child(even) summary:before{color:var(--blue)}
.faq summary:after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e8f8ed;color:var(--green);font-size:20px;transition:.25s}
.faq details:nth-child(even) summary:after{background:#e8f4ff;color:var(--blue)}
.faq details:hover summary:after{background:linear-gradient(135deg,var(--green),var(--blue));color:#fff;box-shadow:0 6px 14px rgba(7,155,77,.18)}
.faq details[open] summary:after{transform:translateY(-50%) rotate(45deg);background:linear-gradient(135deg,var(--green),var(--blue));color:#fff}
.faq details p{margin:0;padding:0 54px 19px 58px}
.footer-grid a{transition:.2s}.footer-grid a:hover{color:var(--green);transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
@media(max-width:980px){.process-band{background:linear-gradient(180deg,#fff,#f7fbff)}.london-card{padding-right:120px}}
@media(max-width:620px){.trust-enhanced{display:grid;grid-template-columns:1fr}.trust-enhanced div{min-width:0}.process-card{padding:25px}.london-card{padding-right:25px;padding-bottom:115px}.faq summary,.faq details p{padding-left:16px}}




/* WHOLE SECTION LONDON BACKGROUND */
.process-band{
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.94) 0%,
            rgba(255,255,255,.90) 38%,
            rgba(245,250,255,.78) 65%,
            rgba(235,247,255,.60) 100%
        ),
        url("../images/london-bg.png") center center / cover no-repeat;

    background-attachment: scroll;
}



/* AI Customer Assistant icon */
.chat-icon{
    background:#e8f8ed;
    color:var(--green);
}

.chat-icon svg{
    width:22px;
    height:22px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.card:hover .chat-icon{
    background:var(--green);
    color:#fff;
}

/* ===== Payroll page ===== */
.green-text{color:var(--green)}
.payroll-hero{padding:72px 0 28px;background:linear-gradient(105deg,#f5fbff 0%,#fff 58%,#f1fbf5 100%);overflow:hidden}.payroll-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:55px}.payroll-hero h1{font-size:clamp(42px,5vw,70px);line-height:1.02;margin:12px 0 22px;color:var(--navy)}.payroll-hero h1 span{color:var(--green)}.payroll-hero p{font-size:18px;max-width:610px;line-height:1.7}.payroll-hero-image{position:relative}.payroll-hero-image img{width:100%;height:390px;object-fit:cover;border-radius:30px;box-shadow:0 24px 60px rgba(14,58,88,.15)}.payroll-float{position:absolute;right:-10px;bottom:30px;background:#fff;padding:16px 22px;border-radius:14px;font-weight:800;color:var(--navy);box-shadow:0 14px 35px rgba(14,58,88,.16)}
.payroll-trust{padding:0 0 30px;background:#fff}.payroll-trust-grid{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 35px rgba(14,58,88,.07);overflow:hidden}.payroll-trust-grid div{display:flex;align-items:center;justify-content:center;gap:14px;padding:22px;border-right:1px solid var(--line);font-size:14px;color:var(--navy)}.payroll-trust-grid div:last-child{border-right:0}.payroll-trust-grid b{font-size:25px;color:var(--blue)}
.payroll-process{padding:70px 0}.payroll-process .section-head{max-width:760px;margin:0 auto 48px}.payroll-steps{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:start;text-align:center;gap:20px}.payroll-steps div span{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:0 auto 15px;background:#eaf7ff;color:var(--blue);font-weight:900;font-size:20px}.payroll-steps div:nth-of-type(even) span{background:#eaf9ef;color:var(--green)}.payroll-steps b{display:block;color:var(--navy);font-size:16px}.payroll-steps p{font-size:14px}.payroll-steps i{padding-top:19px;color:var(--green);font-size:25px;font-style:normal}
.payroll-services{padding:65px 0;background:#fbfdfc}.payroll-service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.payroll-service-grid article{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px 20px;text-align:center;box-shadow:0 8px 24px rgba(14,58,88,.04);transition:.25s}.payroll-service-grid article:hover{transform:translateY(-5px);box-shadow:0 16px 35px rgba(14,58,88,.09)}.payroll-service-grid span{font-size:30px;color:var(--green)}.payroll-service-grid h3{font-size:17px;color:var(--navy);margin:14px 0 8px}.payroll-service-grid p{font-size:14px;margin:0}
.payroll-calc-section{padding:70px 0}.payroll-calc{display:grid;grid-template-columns:1.35fr .65fr;gap:40px;align-items:center;padding:40px;border-radius:24px;background:linear-gradient(120deg,#f4fbf7,#f6fbff);border:1px solid #e2efea}.calc-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}.calc-fields label{font-weight:700;color:var(--navy);font-size:14px}.calc-fields select,.calc-fields input{width:100%;margin-top:9px;padding:14px 15px;border:1px solid #d8e5e9;border-radius:10px;background:#fff;font:inherit;color:var(--navy)}.estimate-card{background:#fff;border-radius:18px;padding:28px;text-align:center;box-shadow:0 12px 30px rgba(14,58,88,.08)}.estimate-card small{color:var(--muted)}.estimate-card strong{display:block;color:var(--green);font-size:38px;margin:8px 0}.estimate-card strong em{font-size:16px;color:var(--navy);font-style:normal}.estimate-card p{font-size:13px}
.payroll-industries{padding:55px 0 75px}.payroll-industry-row{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.payroll-industry-row div{text-align:center;padding:20px 10px;border-right:1px solid var(--line);font-size:26px;color:var(--blue)}.payroll-industry-row div:last-child{border-right:0}.payroll-industry-row b{display:block;font-size:13px;color:var(--navy);margin-top:10px}
.payroll-final {
    padding: 0;
    background: linear-gradient(115deg,#f6fbf8,#fff);
    overflow: hidden;
}.payroll-final-grid{display:grid;grid-template-columns:1fr .75fr;align-items:end;gap:50px}.payroll-final-grid>div{padding:55px 0 65px}.payroll-final h2{font-size:42px;margin:8px 0 15px}.payroll-final p{max-width:600px}.payroll-final img {
    width: 115%;
    max-height: 390px;
    object-fit: contain;
    object-position: bottom center;
    border-radius: 0;
    transform: translateX(-8%);
}
@media(max-width:980px){.payroll-hero-grid,.payroll-calc,.payroll-final-grid{grid-template-columns:1fr}.payroll-service-grid{grid-template-columns:repeat(2,1fr)}.payroll-industry-row{grid-template-columns:repeat(3,1fr)}.payroll-steps{grid-template-columns:1fr 1fr}.payroll-steps i{display:none}.payroll-trust-grid{grid-template-columns:repeat(2,1fr)}.payroll-final img{display:none}}
@media(max-width:620px){.payroll-hero{padding-top:45px}.payroll-hero-image img{height:260px}.payroll-trust-grid,.payroll-service-grid,.calc-fields,.payroll-industry-row,.payroll-steps{grid-template-columns:1fr}.payroll-trust-grid div{border-right:0;border-bottom:1px solid var(--line)}.payroll-calc{padding:25px}.payroll-hero h1{font-size:42px}}


/* ===== Payroll page refinement ===== */
.payroll-services{position:relative;overflow:hidden;background:linear-gradient(180deg,#fbfdfc 0%,#fff 100%)}
.payroll-services:before{content:"";position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(7,155,77,.08),transparent 68%);left:-150px;top:-100px;pointer-events:none}
.payroll-services .section-head p{max-width:690px;margin-left:auto;margin-right:auto}
.payroll-service-grid{grid-template-columns:repeat(3,1fr);gap:18px;position:relative}
.payroll-service-grid article{padding:30px 24px;text-align:left;position:relative;overflow:hidden}
.payroll-service-grid article:after{content:"";position:absolute;left:0;bottom:0;width:0;height:3px;background:linear-gradient(90deg,var(--green),var(--blue));transition:width .28s ease}
.payroll-service-grid article:hover:after{width:100%}
.payroll-service-grid article:nth-child(even) .payroll-service-icon{background:#eaf5ff;color:var(--blue)}
.payroll-service-icon{width:54px;height:54px;border-radius:16px;display:grid!important;place-items:center;background:#eaf9ef;color:var(--green);box-shadow:inset 0 0 0 1px rgba(7,155,77,.08)}
.payroll-service-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.payroll-service-grid h3{margin-top:18px}
.calc-includes{display:flex;flex-wrap:wrap;gap:9px 18px;margin-top:22px;color:#52637c;font-size:12px;font-weight:750}
.calc-includes span{padding:7px 10px;background:rgba(255,255,255,.72);border:1px solid #e1ece7;border-radius:999px}
.estimate-card{border:1px solid #e4eee9;position:relative;overflow:hidden}
.estimate-card:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--green),var(--blue))}
.payroll-support-band{padding:70px 0;background:linear-gradient(110deg,#f4fbf7,#fff 52%,#f3f9ff)}
.payroll-support-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:65px;align-items:center}
.payroll-support-grid h2{font-size:clamp(31px,4vw,46px);line-height:1.08;color:var(--navy);margin:9px 0 14px}
.payroll-support-grid>div>p{color:var(--muted);max-width:560px}
.payroll-support-points{display:grid;gap:12px}
.payroll-support-points>div{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px 20px;box-shadow:0 7px 22px rgba(14,58,88,.045);transition:.25s}
.payroll-support-points>div:hover{transform:translateX(5px);box-shadow:0 13px 28px rgba(14,58,88,.08)}
.payroll-support-points b{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#e7f9ed,#edf8ff);color:var(--green);font-size:12px}
.payroll-support-points strong{display:block;color:var(--navy);margin-bottom:2px}.payroll-support-points span{font-size:13px;color:var(--muted)}
@media(max-width:980px){.payroll-service-grid{grid-template-columns:repeat(2,1fr)}.payroll-support-grid{grid-template-columns:1fr;gap:30px}}
@media(max-width:620px){.payroll-service-grid{grid-template-columns:1fr}.payroll-service-grid article{text-align:left}.payroll-support-points>div{grid-template-columns:44px 1fr}}

/* Contact form status and spam honeypot */
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-message{padding:12px 14px;border-radius:10px;margin:10px 0 16px}
.form-message.success{background:#eefaf3}
.form-message.error{background:#fff1f1}

/* ===== Footer UK-wide service area & email links ===== */
.footer-email{display:flex!important;align-items:center;gap:9px;width:max-content;max-width:100%}
.footer-email-icon{width:25px;height:25px;min-width:25px;border-radius:50%;display:grid;place-items:center;background:#eaf9ef;color:var(--green)}
.footer-email-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.footer-email:hover .footer-email-icon{background:var(--green);color:#fff}
@media(max-width:620px){.footer-email{font-size:12px!important}}

/* ===== Footer: separate Service Area and Contact columns ===== */
.footer-grid{
    grid-template-columns:1.35fr .75fr .75fr .8fr 1.25fr;
    gap:30px;
}
@media(max-width:1100px){
    .footer-grid{grid-template-columns:1.2fr repeat(2,1fr)}
}
@media(max-width:620px){
    .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:440px){
    .footer-grid{grid-template-columns:1fr}
}



/* ===== MOBILE MENU FIX - KEEP AT END OF FILE ===== */
@media (max-width: 980px) {

    .site-header {
        overflow: visible !important;
    }

    .nav {
        position: relative !important;
        overflow: visible !important;
    }

    .navlinks.mobile-open {
        display: flex !important;
        position: absolute !important;
        top: 82px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;

        flex-direction: column !important;
        gap: 0 !important;

        background: #ffffff !important;
        padding: 10px 20px 18px !important;

        border-top: 1px solid #e7eef2;
        box-shadow: 0 15px 30px rgba(14,58,88,.15);

        z-index: 99999 !important;
    }

    .navlinks.mobile-open a {
        display: block !important;
        width: 100% !important;
        padding: 14px 5px !important;
        border-bottom: 1px solid #e7eef2;
        color: var(--navy) !important;
    }

    .navlinks.mobile-open a:last-child {
        border-bottom: 0;
    }

    .navlinks.mobile-open a.active {
        color: var(--green) !important;
    }

    .menu-btn {
        position: relative;
        z-index: 100000;
        cursor: pointer;
    }
}

/* ===== MOBILE FAQ DESIGN FIX ===== */
@media (max-width:620px){

    .faq{
        width:92%;
        margin:auto;
    }

    .faq details{
        margin:12px 0;
        border-radius:16px;
    }

    .faq summary{
        min-height:72px;
        display:flex;
        align-items:center;
        padding:16px 55px 16px 52px !important;

        font-size:16px;
        line-height:1.35;
        font-weight:800;
        position:relative;
    }

    /* FAQ number */
    .faq summary:before{
        left:17px !important;
        top:50% !important;
        transform:translateY(-50%) !important;

        width:24px;
        font-size:11px;
        line-height:1;
        letter-spacing:0;
    }

    /* Plus button */
    .faq summary:after{
        right:15px !important;
        top:50% !important;
        transform:translateY(-50%) !important;

        width:30px;
        height:30px;
        min-width:30px;
    }

    .faq details[open] summary:after{
        transform:translateY(-50%) rotate(45deg) !important;
    }

    /* Open answer */
    .faq details p{
        padding:0 20px 20px 52px !important;
        margin:0;
        font-size:14px;
        line-height:1.6;
    }
}



/* =========================
   RSS AI - 404 PAGE
========================= */

.error-page {
    min-height: 68vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 90px 20px;
    background:
        radial-gradient(circle at 15% 20%, rgba(40, 180, 120, .09), transparent 30%),
        radial-gradient(circle at 85% 75%, rgba(20, 80, 130, .08), transparent 30%),
        #fff;
    text-align: center;
}

.error-container {
    max-width: 760px;
    margin: auto;
}

.error-code {
    font-size: clamp(100px, 18vw, 180px);
    line-height: .8;
    font-weight: 900;
    letter-spacing: -10px;
    color: #0e3a58;
    opacity: .08;
    margin-bottom: -18px;
}

.error-label {
    display: inline-block;
    padding: 8px 15px;
    border-radius: 50px;
    background: #eaf8f1;
    color: #16885b;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
    margin-bottom: 20px;
}

.error-page h1 {
    color: #0e3a58;
    font-size: clamp(36px, 6vw, 58px);
    line-height: 1.08;
    margin: 0 0 20px;
}

.error-page p {
    max-width: 590px;
    margin: 0 auto 32px;
    color: #647482;
    font-size: 17px;
    line-height: 1.7;
}

.error-actions {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

.error-primary,
.error-secondary {
    padding: 14px 25px;
    border-radius: 10px;
    font-weight: 800;
    text-decoration: none;
    transition: .2s ease;
}

.error-primary {
    background: #16885b;
    color: #fff;
}

.error-primary:hover {
    transform: translateY(-2px);
}

.error-secondary {
    background: #fff;
    color: #0e3a58;
    border: 1px solid #dce5ea;
}

.error-secondary:hover {
    border-color: #16885b;
    color: #16885b;
}

.error-help {
    margin-top: 38px;
    padding-top: 25px;
    border-top: 1px solid #e7eef2;
    color: #788791;
    font-size: 14px;
}

.error-help a {
    color: #16885b;
    font-weight: 700;
    text-decoration: none;
}

@media (max-width: 620px) {
    .error-page {
        padding: 65px 18px;
    }

    .error-code {
        letter-spacing: -5px;
    }

    .error-actions {
        flex-direction: column;
    }

    .error-primary,
    .error-secondary {
        width: 100%;
    }
}