/* I Sharp Locksmith Brisbane — black header/hero, white content, amber action, slate-blue secondary (from the original site) */
:root{--black:#000;--ink:#161616;--text:#333;--muted:#6b6b6b;--bg:#fff;--soft:#f6f5f2;--line:#e6e3dc;--amber:#F8AE01;--amber2:#EAA209;--slate:#556AA0;--radius:6px;--max:1160px;
--display:"Assistant","Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.65 var(--display);padding-bottom:72px}
img{max-width:100%;height:auto;display:block}a{color:var(--slate)}
h1,h2,h3{font-family:var(--display);color:var(--ink);line-height:1.15;margin:0 0 .55em;text-wrap:balance}
h1,h2{font-weight:800;text-transform:uppercase;letter-spacing:.01em}
h1{font-size:clamp(2.2rem,5.4vw,3.6rem)}h2{font-size:clamp(1.6rem,3.4vw,2.4rem)}h3{font-size:1.2rem;font-weight:700}
p{margin:0 0 1em}.wrap{max-width:var(--max);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap>*,.grid>*,.split>*{min-width:0}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;background:var(--amber);color:#000;padding:8px 12px;z-index:99}
header.top{position:sticky;top:0;z-index:50;background:var(--black);border-bottom:1px solid #222}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;line-height:1}
.brand svg{flex:none}.brand small{display:block;font-size:.72rem;letter-spacing:.12em;color:var(--amber);font-weight:700}
.brand b{display:block;font-size:1.25rem;font-weight:800;letter-spacing:.04em}
.menu{display:flex;gap:24px;list-style:none;margin:0;padding:0}
.menu a{color:#fff;text-decoration:none;font-weight:700;font-size:.98rem;padding:6px 0;border-bottom:2px solid transparent}
.menu a:hover,.menu a[aria-current]{color:var(--amber);border-color:var(--amber)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--amber);color:#000;font-weight:800;text-decoration:none;padding:13px 22px;border-radius:var(--radius);border:0;cursor:pointer;font-size:1rem;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;font-family:inherit}
.btn:hover{background:var(--amber2)}.btn.blue{background:var(--slate);color:#fff}.btn.blue:hover{background:#465a8c}
.btn:focus-visible,a:focus-visible{outline:3px solid var(--slate);outline-offset:2px}
.burger{display:none;background:none;border:1px solid #444;color:#fff;border-radius:6px;padding:8px 11px;font-size:1.05rem}
@media(max-width:900px){.menu{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;gap:6px;background:#000;padding:16px max(16px,env(safe-area-inset-left,0px)) 20px}.menu.open{display:flex}.burger{display:block}.nav .btn{display:none}}
.hero{background:radial-gradient(900px 400px at 85% 10%,rgba(248,174,1,.16),transparent 60%),linear-gradient(160deg,#161616 0%,#000 70%);color:#fff;padding-block:64px 52px}
.hero h1,.hero h2{color:#fff}.hero .lead{color:#d6d6d6}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--amber);margin-bottom:12px}
.live:before{content:"";width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.2)}
.lead{font-size:1.18rem;max-width:58ch;color:var(--muted)}
.bigphone{display:block;font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;color:#fff;text-decoration:none;letter-spacing:.01em;margin:6px 0 4px;border-top:3px solid #fff;padding-top:14px;max-width:420px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}
.panel{background:#111;border:1px solid #2a2a2a;border-radius:10px;padding:22px}
.panel h2{font-size:1.25rem;color:var(--amber)}
.panel ul{list-style:none;margin:0;padding:0}.panel li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #262626;color:#e6e6e6}
.panel li b{color:var(--amber);font-variant-numeric:tabular-nums}
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px}
@media(max-width:700px){.trust{grid-template-columns:repeat(2,1fr)}}
.trust div{border:1px solid #2a2a2a;border-radius:8px;padding:12px;text-align:center;color:#bdbdbd;font-size:.88rem}
.trust b{display:block;font-size:1.45rem;color:#fff;font-weight:800}
section{padding-block:60px}section.soft{background:var(--soft)}section.dark{background:var(--ink);color:#ddd}section.dark h2,section.dark h3{color:#fff}
.center{text-align:center}.center .lead{margin-left:auto;margin-right:auto}
.grid{display:grid;gap:18px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:960px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px;display:flex;flex-direction:column;gap:6px}
.card p{color:var(--muted);margin:0}.card .price{margin-top:auto;padding-top:10px;font-weight:800;color:var(--ink);font-size:1.05rem}.card .price span{color:var(--amber2)}
a.card{text-decoration:none;color:var(--text);transition:border-color .15s,transform .15s}a.card:hover{border-color:var(--amber);transform:translateY(-2px)}
.ico{width:46px;height:46px;border-radius:8px;background:#000;display:grid;place-items:center;margin-bottom:6px}
.tick{list-style:none;padding:0;margin:0 0 1em}.tick li{padding-left:28px;position:relative;margin:6px 0}.tick li:before{content:"";position:absolute;left:0;top:.45em;width:16px;height:9px;border-left:3px solid var(--amber2);border-bottom:3px solid var(--amber2);transform:rotate(-45deg)}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}.chips li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:.95rem}
.chips a{text-decoration:none;color:var(--ink)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}@media(max-width:900px){.split{grid-template-columns:1fr}}
.tablewrap{overflow-x:auto}
table.prices{width:100%;border-collapse:collapse;margin:0 0 24px;background:#fff}
.prices th,.prices td{text-align:left;padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:top}.prices thead th{background:#000;color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}
.prices td:last-child,.prices th:last-child{text-align:right;white-space:nowrap;font-weight:800;font-variant-numeric:tabular-nums}
.prices small{color:var(--muted);display:block}
.callrate{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;background:var(--amber);color:#000;border-radius:10px;padding:22px 26px;margin-bottom:28px}
.callrate b{font-size:2rem;font-weight:800}
details{background:#fff;border:1px solid var(--line);border-radius:8px;padding:16px 18px;margin-bottom:10px}
summary{cursor:pointer;font-weight:700;list-style:none;color:var(--ink)}summary::-webkit-details-marker{display:none}summary:after{content:"+";float:right;color:var(--amber2);font-size:1.4rem;line-height:1}details[open] summary:after{content:"–"}details p{margin:12px 0 0;color:var(--muted)}
.callout{background:#000;color:#fff;border-radius:12px;padding:44px 24px;text-align:center}.callout h2{color:#fff}.callout p{color:#cfcfcf}
.callout .btn{font-size:1.3rem;padding:16px 30px}
.crumbs{font-size:.88rem;color:#9a9a9a;padding-block:14px 0;background:#000}.crumbs a{color:#bdbdbd}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:600px){form .row{grid-template-columns:1fr}}
label{display:block;font-weight:700;font-size:.92rem;margin:12px 0 6px;color:var(--ink)}
input,select,textarea{width:100%;background:#fff;border:1px solid #cfcac0;color:var(--ink);border-radius:6px;padding:12px;font:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid var(--amber);outline-offset:1px}
.form-msg{margin-top:12px;font-weight:700}
.map{border:0;width:100%;height:340px;border-radius:10px}
.prose{max-width:780px}.prose h2{margin-top:1.5em}
footer.site{background:#000;color:#a8a8a8;padding-block:46px 24px;font-size:.96rem}
footer.site h3{color:#fff;font-size:1rem;text-transform:uppercase;letter-spacing:.06em}footer.site ul{list-style:none;padding:0;margin:0}footer.site li{margin:7px 0}
footer.site a{color:#cfcfcf;text-decoration:none}footer.site a:hover{color:var(--amber)}
.legal{border-top:1px solid #222;margin-top:28px;padding-top:18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.86rem}
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:10px;padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:#000;border-top:1px solid #222}
.callbar .btn{flex:1;font-size:1.1rem}
@media(min-width:901px){.callbar{display:none}body{padding-bottom:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* photos */
.logo{display:block;height:52px;width:auto;max-width:100%}
.hero.photo{background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.72) 45%,rgba(0,0,0,.35) 100%),url(/img/hero-1600.webp) center/cover no-repeat;padding-bottom:40px}
@media(max-width:900px){.hero.photo{background:linear-gradient(rgba(0,0,0,.8),rgba(0,0,0,.85)),url(/img/hero-800.webp) center/cover no-repeat}}
.hero .tech{align-self:end;display:flex;justify-content:center}
.hero .tech img{max-height:480px;width:auto;filter:drop-shadow(0 18px 30px rgba(0,0,0,.45))}
@media(max-width:900px){.hero .tech{display:none}}
.card{overflow:hidden}
.card .cardimg{width:calc(100% + 44px);max-width:none;margin:-22px -22px 10px;height:auto;aspect-ratio:357/197;object-fit:cover}
.rounded{border-radius:10px;border:1px solid var(--line);width:100%}
.inline{max-width:420px;margin:8px 0 18px}
.badges{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:28px 44px;margin:12px 0}
.badges img{height:84px;width:auto}
.badges-band{padding-block:28px}