/*
Theme Name: Sheffield Locksmith 24H
Description: Lightweight hand built theme for sheffieldlocksmith24h.co.uk. No page builder.
Version: 1.1.1
Author: Sheffield Locksmith 24H
Text Domain: slk24
*/
:root{--n:#0b1f4d;--n2:#13307a;--a:#ff5a1f;--a2:#e8460d;--ink:#1f2937;--mut:#5b6474;--line:#e3e8f0;--bg2:#f5f7fb;--r:14px}
*,*:before,*:after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.65;font-size:17px}
img{max-width:100%;height:auto}
a{color:var(--n2)}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:10px;z-index:100000}.skip:focus{left:10px}
.wrap{max-width:1160px;margin:0 auto;padding:0 18px}
svg{vertical-align:-3px}

/* top bar */
.topbar{background:var(--n);color:#dfe6ff;font-size:14px}
.tb-in{max-width:1240px;margin:0 auto;padding:7px 18px;display:flex;gap:22px;align-items:center}
.tb-in span{display:inline-flex;gap:7px;align-items:center}
.tb-call{margin-left:auto;color:#fff;font-weight:800;text-decoration:none;display:inline-flex;gap:7px;align-items:center}
@media(max-width:860px){.tb-hide{display:none!important}.tb-in{justify-content:space-between}}

/* header */
.hd{position:sticky;top:0;z-index:9999;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 2px 14px rgba(11,31,77,.07)}
.admin-bar .hd{top:32px}@media(max-width:782px){.admin-bar .hd{top:0}}
.hd-in{max-width:1480px;margin:0 auto;padding:6px 18px;display:flex;align-items:center;gap:16px;min-height:80px;position:relative}
.logo{flex:0 0 auto;display:flex}.logo img{height:84px;width:auto;display:block}
.nav{flex:1 1 auto}.menu,.menu ul{list-style:none;margin:0;padding:0}
.menu a{color:var(--n);text-decoration:none;font-weight:700;font-size:15.5px;display:block}
.subbtn,.navcall{display:none}
.hd-cta{display:flex;align-items:center;gap:10px;margin-left:auto}
.call{display:inline-flex;align-items:center;gap:9px;background:var(--a);color:#fff;text-decoration:none;border-radius:12px;padding:9px 16px;font-weight:800;line-height:1.1;white-space:nowrap}
.call:hover{background:var(--a2)}
.wa{display:inline-flex;align-items:center;gap:7px;background:#25d366;color:#fff;text-decoration:none;border-radius:12px;padding:0 14px;height:46px;font-weight:800;white-space:nowrap}.wa:hover{background:#1ebe5b}
.getp{display:inline-flex;align-items:center;height:46px;padding:0 16px;border:2px solid var(--n);color:var(--n);border-radius:12px;text-decoration:none;font-weight:800;white-space:nowrap}.getp:hover{background:var(--n);color:#fff}
.navwa{display:none}
.menu>li>a{white-space:nowrap}@media(max-width:1460px) and (min-width:1101px){.wa{width:46px;padding:0;justify-content:center}.wa span{display:none}.menu>li>a{padding:10px 8px}.hd-in{gap:10px}}@media(max-width:1460px) and (min-width:1101px){.getp{padding:0 12px;font-size:15px}}@media(max-width:1299px) and (min-width:1101px){.getp{display:none}}.num{display:flex;flex-direction:column;font-size:17px}.num small{font-size:11px;font-weight:600;opacity:.92}
.burger{display:none;position:relative;width:46px;height:46px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px 11px;cursor:pointer}
.burger span{display:block;height:2px;background:var(--n);margin:4px 0;border-radius:2px}
.burger[aria-expanded="true"] span{opacity:0}.burger[aria-expanded="true"]:after{content:"\2715";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--n)}
.gt{margin:0 0 6px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--a2)}
@media(min-width:1101px){
 .menu{display:flex;justify-content:center;gap:2px}
 .menu>li{position:relative}.menu>li>a{padding:10px 12px;border-radius:10px}.menu>li>a:hover{background:var(--bg2);color:var(--a2)}
 .dd>a:after{content:"";display:inline-block;margin-left:6px;border:5px solid transparent;border-top-color:currentColor;vertical-align:-2px}
 .panel{display:none;position:absolute;left:0;top:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 18px 40px rgba(11,31,77,.16);padding:16px;min-width:250px;z-index:10000}
 .menu>li.wide{position:static}.wide>.panel{left:50%;transform:translateX(-50%)}
 .mega{gap:18px;width:max-content;max-width:min(980px,94vw)}
 .dd:hover>.panel,.dd:focus-within>.panel{display:block}.dd:hover>.mega,.dd:focus-within>.mega{display:flex}
 .col{min-width:170px}.col3 ul{columns:3;column-gap:14px}
 .panel li a{padding:6px 10px;border-radius:8px;font-weight:600;font-size:14.5px}.panel li a:hover{background:#fff1ea;color:var(--a2)}
}
@media(max-width:1100px){
 .hd-in{min-height:72px;gap:8px;padding:4px 10px}.logo img{height:64px}
 .burger{display:block}.num{display:none}.call{width:46px;height:46px;padding:0;justify-content:center}.wa{width:46px;padding:0;justify-content:center}.wa span,.getp{display:none}
 .navwa{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px 16px 4px;background:#25d366;color:#fff;text-decoration:none;border-radius:12px;padding:14px;font-weight:800;font-size:17px}
 .nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 22px 34px rgba(11,31,77,.2);max-height:calc(100vh - 110px);overflow:auto;padding-bottom:12px}
 .nav.open{display:block}
 .menu>li{border-bottom:1px solid #edf1f6;position:relative}.menu>li>a{padding:15px 20px;font-size:17px}
 .subbtn{display:block;position:absolute;right:6px;top:6px;width:46px;height:46px;border:0;background:transparent;cursor:pointer}
 .subbtn:after{content:"";position:absolute;left:17px;top:19px;border:6px solid transparent;border-top-color:var(--n);transition:transform .15s}
 .dd.open>.subbtn:after{transform:rotate(180deg);top:13px}
 .panel{display:none;background:var(--bg2);padding:8px 20px 14px}.dd.open>.panel{display:block}
 .col{margin:8px 0}.col3 ul{columns:2;column-gap:12px}
 .panel li a{padding:9px 0;font-weight:600;font-size:15.5px}
 .navcall{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 16px 4px;background:var(--a);color:#fff;text-decoration:none;border-radius:12px;padding:14px;font-weight:800;font-size:17px}
}

/* footer */
.ft{background:#071538;color:#c9d3ee;margin-top:0;padding:48px 0 0;font-size:15px}
.ft-in{max-width:1240px;margin:0 auto;padding:0 18px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:28px}
.ft a{color:#fff;text-decoration:none}.ft a:hover{text-decoration:underline}
.ft ul{list-style:none;margin:0;padding:0}.ft li{margin:0 0 8px}
.ft-name{color:#fff;font-weight:800;font-size:20px;margin:0 0 10px}.ft-h{color:#fff;font-weight:800;margin:0 0 12px;font-size:15px;text-transform:uppercase;letter-spacing:.05em}
.ft-nap{line-height:2}.ft-nap svg{color:var(--a)}
.ft-bot{border-top:1px solid rgba(255,255,255,.12);margin-top:36px;padding:16px 18px;text-align:center;font-size:13px}.ft-bot p{margin:0}
@media(max-width:900px){.ft-in{grid-template-columns:1fr 1fr}.ft-brand{grid-column:1/-1}}
.mbar{display:none}
@media(max-width:760px){.mbar{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:6px;position:fixed;left:0;right:0;bottom:0;z-index:9998;background:#fff;padding:8px 8px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(11,31,77,.18)}
 .mbar a{display:flex;align-items:center;justify-content:center;gap:6px;height:50px;border-radius:12px;color:#fff;font-weight:800;font-size:16px;text-decoration:none}
 .mb-call{background:var(--a)}.mb-wa{background:#25d366}.mb-q{background:var(--n)}
 body{padding-bottom:74px}.navopen .mbar{display:none}
 .hd .wa{display:none}}
/* quick answer box (AI and featured snippet friendly) */
.slk .qa-box{max-width:1120px;margin:0 auto 18px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:14px 18px;text-align:left;color:#eef2ff;font-size:1.02rem}
.slk .qa-box strong{color:#fff}

/* simple pages (archive, 404) */
.plain{padding:48px 0}.plain h1{color:var(--n)}.postlist{list-style:none;padding:0}.postlist li{border-bottom:1px solid var(--line);padding:14px 0}.postlist a{font-weight:700;font-size:1.1rem}

/* quote form (sits directly under the H1) */
.qf-wrap{max-width:1120px;margin:22px auto 22px;text-align:left}
.qf{background:#fff;color:var(--ink);border-radius:16px;padding:18px 20px;box-shadow:0 16px 44px rgba(0,0,0,.28)}
.qf-t{margin:0 0 12px;font-weight:800;font-size:1.15rem;color:var(--n);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.qf-t span{background:var(--n);color:#fff;font-size:.78rem;padding:3px 9px;border-radius:999px;font-weight:700}
.qf-g{display:grid;grid-template-columns:1fr 1fr .8fr 1.1fr auto auto;gap:10px;align-items:end}
.qf label{display:block;font-size:.8rem;font-weight:700;color:var(--n);margin:0}
.qf input[type=text],.qf input[type=tel],.qf select{display:block;width:100%;height:48px;margin-top:5px;padding:0 12px;border:1.5px solid #cfd6e3;border-radius:10px;font:inherit;font-size:16px;color:var(--ink);background:#fff}
.qf input:focus,.qf select:focus{outline:2px solid var(--a);border-color:var(--a)}
.qf fieldset{border:0;margin:0;padding:0;min-width:0}.qf legend{font-size:.8rem;font-weight:700;color:var(--n);padding:0;margin-bottom:5px}
.qf-m{display:flex;gap:6px}
.qf-pill{position:relative}.qf-pill input{position:absolute;opacity:0}.qf-pill span{display:flex;align-items:center;height:48px;padding:0 14px;border:1.5px solid #cfd6e3;border-radius:10px;font-weight:700;font-size:.92rem;cursor:pointer;white-space:nowrap}
.qf-pill input:checked+span{border-color:var(--a);background:#fff1ea;color:var(--a2)}.qf-pill input:focus-visible+span{outline:2px solid var(--a)}
.qf button{height:48px;padding:0 22px;border:0;border-radius:10px;background:var(--a);color:#fff;font:inherit;font-weight:800;font-size:1rem;cursor:pointer;white-space:nowrap}
.qf button:hover{background:var(--a2)}.qf button[disabled]{opacity:.6}
.qf-note{margin:10px 0 0;font-size:.85rem;color:var(--mut);text-align:center}
.qf-err{margin:10px 0 0;color:#b42318;font-weight:600;text-align:center}.qf-err a{color:#b42318}
.qf-hp{position:absolute!important;left:-5000px!important;width:1px;height:1px;overflow:hidden}
.qf-ok{background:#fff;color:var(--ink);border-radius:16px;padding:26px 20px;text-align:center;box-shadow:0 16px 44px rgba(0,0,0,.28)}
.qf-ok:focus{outline:none}.qf-tick{width:52px;height:52px;margin:0 auto 10px;border-radius:50%;background:#16a34a;color:#fff;font-size:28px;line-height:52px}
.qf-th{font-size:1.3rem;font-weight:800;color:var(--n);margin:0 0 6px}
.qf-ok a{color:var(--a2);font-weight:800}
@media(max-width:1100px){.qf-g{grid-template-columns:1fr 1fr}.qf-m,.qf button{grid-column:1/-1}.qf-m{grid-column:auto}}
@media(max-width:640px){.qf{padding:16px}.qf-g{grid-template-columns:1fr}.qf-m{grid-column:auto}.qf-pill{flex:1}.qf-pill span{justify-content:center}.qf button{width:100%;height:54px;font-size:1.05rem}}

/* page content (all pages share these classes) */
.slk{color:var(--ink);line-height:1.7;font-size:17px;background:#fff}
.slk h1,.slk h2,.slk h3,.slk h4{line-height:1.25;margin:0 0 .6em;color:var(--n);letter-spacing:-.01em}
.slk p{margin:0 0 1em}
.slk a{color:var(--n2)}
.slk .narrow{max-width:800px;margin:0 auto}
.slk .crumbs{background:var(--bg2);font-size:.88rem;padding:9px 0;border-bottom:1px solid var(--line)}
.slk .crumbs a{color:var(--n2)}.slk .crumbs span{color:var(--mut);margin:0 5px}
.slk .hero{background:radial-gradient(1200px 400px at 80% -10%,#2a48a8 0%,transparent 60%),linear-gradient(135deg,var(--n) 0%,#152f78 100%);color:#fff;padding:44px 0 42px;text-align:center}
.slk .hero h1{color:#fff;font-size:2.55rem;margin:0 auto .3em;max-width:980px;font-weight:800}
.slk .hero .sub{font-size:1.13rem;max-width:760px;margin:0 auto 1.2em;color:#e3e9ff}
.slk .btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:16px 0}
.slk .btn{display:inline-flex;align-items:center;padding:14px 26px;border-radius:999px;font-weight:800;text-decoration:none;font-size:1.05rem}
.slk .btn-a{background:var(--a);color:#fff;box-shadow:0 8px 20px rgba(255,90,31,.35)}.slk .btn-a:hover{background:var(--a2)}
.slk .btn-o{border:2px solid rgba(255,255,255,.85);color:#fff}.slk .btn-o:hover{background:rgba(255,255,255,.1)}
.slk .feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:26px auto 0;max-width:1120px}
.slk .feat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);padding:16px}
.slk .feat .ic{font-size:1.8rem;line-height:1}.slk .feat h3{color:#fff;font-size:1.04rem;margin:.45em 0 .25em}.slk .feat p{margin:0;font-size:.94rem;color:#dbe3ff}
.slk .sec{padding:52px 0}.slk .sec.alt{background:var(--bg2)}
.slk .sec h2{font-size:1.95rem;text-align:center;margin-bottom:.8em;font-weight:800}
.slk .prose ul,.slk .prose ol:not(.steps):not(.how-grid){margin:0 0 1.2em 1.3em;padding:0}.slk .prose li{margin-bottom:.45em}
.slk .prose h3{font-size:1.28rem;margin-top:1.4em}.slk .prose a{font-weight:600;text-decoration-thickness:1px;text-underline-offset:3px}
.slk .byline{font-size:.88rem;color:var(--mut)}
.slk .toc{background:var(--bg2);border:1px solid var(--line);border-left:5px solid var(--a);border-radius:10px;padding:16px 20px;margin:18px 0}
.slk .toc h2{font-size:1.05rem;text-align:left;margin:0 0 .5em}.slk .toc ol{margin:0 0 0 1.2em;columns:2;column-gap:2rem}.slk .toc li{margin-bottom:.3em;break-inside:avoid}.slk .toc a{text-decoration:none;font-weight:600}
.slk .tw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.slk table{width:100%;border-collapse:separate;border-spacing:0;margin:1em 0 1.4em;font-size:.96rem;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.slk th{background:var(--n);color:#fff;text-align:left;padding:11px 12px;font-weight:700}.slk td{border-top:1px solid var(--line);padding:11px 12px;vertical-align:top}.slk tr:nth-child(even) td{background:#fafbfd}
.slk .services-grid,.slk .door-grid,.slk .area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:1em 0 1.4em}
.slk .service-card,.slk .door-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--a);border-radius:var(--r);padding:18px;box-shadow:0 6px 18px rgba(11,31,77,.05)}
.slk .service-card h3,.slk .door-card h3{font-size:1.1rem;margin-top:0}
.slk .door-verdict{font-weight:700;background:#eef2fb;padding:6px 10px;border-radius:8px;display:inline-block;margin:0}
.slk .steps{counter-reset:s;list-style:none;margin:1em 0 1.4em;padding:0}
.slk .steps li{counter-increment:s;position:relative;padding:14px 16px 14px 58px;background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:10px}
.slk .steps li:before{content:counter(s);position:absolute;left:16px;top:13px;width:30px;height:30px;border-radius:50%;background:var(--a);color:#fff;font-weight:800;text-align:center;line-height:30px}
.slk .how-grid{list-style:none;counter-reset:h;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:1em 0 1.4em;padding:0}
.slk .how-grid li{counter-increment:h;background:#fff;border-top:4px solid var(--a);border-radius:var(--r);padding:16px;box-shadow:0 6px 18px rgba(11,31,77,.07)}
.slk .how-grid h3:before{content:counter(h) ". ";color:var(--a)}
.slk .callout{background:#fff4ee;border-left:5px solid var(--a);border-radius:10px;padding:16px 18px;margin:1.2em 0}.slk .callout h3{margin-top:0}
.slk .trust-box{background:var(--n);color:#fff;border-radius:var(--r);padding:18px;margin:1.2em 0}.slk .trust-box h3,.slk .trust-box a{color:#fff}
.slk .model-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:1em 0 1.2em}
.slk .model-list span{border:1.5px solid var(--line);border-radius:999px;padding:6px 14px;font-weight:600;color:var(--n);background:#fff;font-size:.95rem}
.slk .area-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;text-align:left;box-shadow:0 6px 18px rgba(11,31,77,.05);transition:transform .15s,box-shadow .15s}
.slk .area-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(11,31,77,.12)}
.slk .area-card h3{font-size:1.05rem;margin:0 0 .3em}.slk .area-card h3 a{color:var(--n);text-decoration:none}.slk .area-card h3 a:after{content:" \2192";color:var(--a)}
.slk .area-card p{color:var(--mut);font-size:.93rem;margin:0}
.slk .banner{background:linear-gradient(135deg,var(--a),var(--a2));color:#fff;border-radius:16px;padding:28px;text-align:center;margin-top:30px}
.slk .banner h3{color:#fff;font-size:1.6rem}.slk .banner p{color:#fff}
.slk .banner a{display:inline-block;background:#fff;color:var(--a2);font-weight:800;padding:13px 28px;border-radius:999px;text-decoration:none;font-size:1.15rem}
.slk .faqsec{background:var(--bg2)}.slk .faqsec h2{color:var(--n)}
.slk .faq{max-width:840px;margin:0 auto}
.slk .faq-i{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;overflow:hidden}
.slk .faq-q{width:100%;text-align:left;background:#fff;color:var(--n);border:0;padding:17px 50px 17px 18px;font-size:1.03rem;font-weight:700;cursor:pointer;position:relative;font-family:inherit;line-height:1.4}
.slk .faq-q:after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:1.5rem;color:var(--a)}
.slk .faq-i.open .faq-q:after{content:"\2212"}.slk .faq-a{display:none;padding:0 18px 18px;color:var(--ink)}.slk .faq-i.open .faq-a{display:block}
.slk .price-note{text-align:center;color:var(--mut)}
@media(max-width:768px){.slk .hero{padding:30px 0 34px}.slk .hero h1{font-size:1.85rem}.slk .sec{padding:40px 0}.slk .sec h2{font-size:1.5rem}.slk .toc ol{columns:1}.slk{font-size:16px}.slk .feats{grid-template-columns:1fr 1fr}.slk .feat{padding:12px}.slk .feat p{display:none}}

html{scroll-behavior:smooth}#quote{scroll-margin-top:120px}@media(max-width:1100px){#quote{scroll-margin-top:84px}}
