/* brass — engine-family additions to the approved template 1 CSS (style.bldddf3e5171, global.bldddf3e5171, page-*.bldddf3e5171 are the
   hand-built pages' own files, unchanged). Only what the engine needs beyond the hand-built pages:
   the drawn-steps "How a visit goes" (garage), a three-step journey, and the plainer inner pages.
   Nothing here may scroll sideways: every grid/flex child min-width 0, long words wrap. */

/* three-step 3D journey (content gives three steps) */
.irdc6e027324.nxbb4e5d7ff5 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 360px; }

/* drawn steps: the non-3D "How a visit goes" */
.kw9a95a6ea46 { background: var(--cw802fd72432); }
.kw9a95a6ea46 .ao8470289834 { max-width: 62ch; margin-bottom: clamp(20px, 4vw, 40px); }
.kw9a95a6ea46 .ao8470289834 .qsad4fbc9f87 { margin-bottom: 14px; }
.qsa478ff5056 { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); counter-reset: bx; }
@media (min-width: 768px) { .qsa478ff5056 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }
.ezf7cd1b45c8 { min-width: 0; background: var(--dbbbfdd5f65f); border-radius: var(--qs5938933579); padding: 22px 22px 24px; box-shadow: var(--rp2709e7d92f); position: relative; }
.ezf7cd1b45c8 .ly3e317465be { width: 72px; height: 72px; color: var(--kwc8f99290b6); margin-bottom: 12px; }
.ezf7cd1b45c8 .db2246dd1550 { font: 650 .8125rem/1 var(--fy90701b757f); letter-spacing: .1em; color: var(--gt0c91d84602); margin: 0 0 8px; }
.ezf7cd1b45c8 .db4c3953aaef { font: 650 1.25rem/1.22 var(--fy90701b757f); margin: 0 0 8px; overflow-wrap: anywhere; }
.ezf7cd1b45c8 p:last-child { margin: 0; color: var(--kwc8f99290b6); overflow-wrap: break-word; }
@media (min-width: 768px) { .ezf7cd1b45c8:nth-child(2) { transform: translateY(18px); } .ezf7cd1b45c8:nth-child(3) { transform: translateY(36px); } .qsa478ff5056 { padding-bottom: 36px; } }

/* inner pages built from content (services, areas, questions, about, contact, site map) */
.dbbf8b0bbcd2 { overflow-wrap: break-word; }
.qs01688f85db .ly5332bcbacd { margin-top: 10px; }
.qs01688f85db .qsad4fbc9f87 a, .vhd1117fbbae .qsad4fbc9f87 a, .gt715b4592f0 .qsad4fbc9f87 a { color: inherit; text-decoration: none; }
.qs01688f85db .qsad4fbc9f87 a:hover, .vhd1117fbbae .qsad4fbc9f87 a:hover, .gt715b4592f0 .qsad4fbc9f87 a:hover { color: var(--gt0c91d84602); }
.fyc7da95c62c .sm2cdcba2118 { border-radius: var(--qs5938933579); overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--rp2709e7d92f); }
@media (min-width: 768px) { .fyc7da95c62c .sm2cdcba2118 { aspect-ratio: 16 / 9; } }
.fyc7da95c62c .sm2cdcba2118 iframe { width: 100%; height: 100%; border: 0; display: block; }
.vhd1117fbbae { display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 700px) { .vhd1117fbbae { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 28px; } .vhd1117fbbae:nth-of-type(even) .kwc16051696b { order: 2; } }
.kwc16051696b, .bl1bcaeff21b { min-width: 0; }
.kwc16051696b img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--qsfedcc0ca01); display: block; }
.vhd1117fbbae:nth-of-type(3n+1) .kwc16051696b img { border-radius: 999px 999px var(--qsfedcc0ca01) var(--qsfedcc0ca01); }
.ly9e2b0609e0 { font-size: .9375rem; color: var(--gt1647dd7951); border-left: 3px solid var(--gt7e345b2ebc); padding-left: 12px; }
.vhd1117fbbae .md6a59dd0f65 { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; }
.vh393e8455a6 { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; align-items: center; margin-bottom: 14px; }
.ao9324cc4e3f { margin: 0; }
.ao9324cc4e3f img { width: 96px; height: 96px; object-fit: cover; border-radius: 50%; display: block; box-shadow: 0 0 0 5px var(--fy7f089a2e37), var(--rp2709e7d92f); }
.ezcc9c8acc84 { color: var(--rp4c6a89fe1d); margin: 8px 0 18px; }
.mda8a852e452 h2 { font: 650 1.375rem/1.2 var(--ao21d37b5bc4); margin: 0 0 10px; }

/* advice article: a printed page (rule 60) */
.fy3601eba0f8 { background: var(--cw8cd5df78a8); border-radius: var(--tv2c490b56d2); padding: clamp(18px, 4vw, 44px); box-shadow: var(--jd27af5dce15); position: relative;
  background-image: repeating-linear-gradient(0deg, color-mix(in srgb, var(--rp4c6a89fe1d) 2.5%, transparent) 0 1px, transparent 1px 4px); }
.qs49fe9b5d78 { border-bottom: 3px double var(--rp4c6a89fe1d); padding-bottom: 14px; margin-bottom: 18px; text-align: center; }
.aoe185a8a0af { font: 700 .75rem/1.2 var(--fy90701b757f); letter-spacing: .22em; text-transform: uppercase; color: var(--gt0c91d84602); margin: 0 0 10px; overflow-wrap: anywhere; }
.sm52b4dc3fbd { font: 760 clamp(1.75rem, 1.1rem + 3vw, 3rem)/1.04 var(--ao21d37b5bc4); letter-spacing: -.02em; margin: 0 0 10px; overflow-wrap: anywhere; text-wrap: balance; }
.gt4638d916ab { font: 500 .8125rem/1.3 var(--fy90701b757f); letter-spacing: .08em; text-transform: uppercase; color: var(--gt1647dd7951); margin: 0; border-top: 1px solid var(--jdeb12f0efe8); padding-top: 8px; }
.qs27543e5cd9 { margin: 0 0 18px; }
.qs27543e5cd9 img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; display: block; filter: sepia(.12) contrast(1.02); }
.rp6e342a4ba7 { font: 500 1.1875rem/1.55 var(--fy90701b757f); }
.rp6e342a4ba7::first-letter { float: left; font: 800 3.6em/.82 var(--ao21d37b5bc4); margin: .06em .08em 0 0; color: var(--gt0c91d84602); }
.ezaed9b84b81 { columns: 1; column-gap: 36px; column-rule: 1px solid var(--lyc2bc327957); }
@media (min-width: 900px) { .ezaed9b84b81 { columns: 2; } }
.sm428d2adaf6 { break-inside: avoid-column; }
.sm428d2adaf6 h2 { font: 700 1.1875rem/1.25 var(--ao21d37b5bc4); margin: 0 0 8px; border-top: 1px solid var(--rp4c6a89fe1d); padding-top: 10px; overflow-wrap: anywhere; }
.sm428d2adaf6 p { margin: 0 0 18px; overflow-wrap: break-word; }

/* "What happened?" tiles: a photo that is dark on its own is lifted, and the shade under the words eased,
   so no tile reads as a black square (Tamir's note on the High Security Locks tile, 2026-09-27) */
.nx7250aedb4a.tv31a3ec8189 img { filter: brightness(1.38) saturate(1.06); }
.nx7250aedb4a.tv31a3ec8189::after { background: linear-gradient(0deg, color-mix(in srgb, var(--db11107a8bc9) 78%, transparent) 0%, color-mix(in srgb, var(--db11107a8bc9) 26%, transparent) 44%, color-mix(in srgb, var(--db11107a8bc9) 0%, transparent) 66%); }

/* ------------------------------------------------------------------ clip slots (the engine's approved clips, 2026-09-28)
   The photo is on screen first and stays under the clip. The clip sits exactly on the photo's box (no
   layout shift), fades in only once it is really playing (never a black box), and under reduced motion
   there is no clip at all (app.ireb1f3f661a also removes it). */
figure[data-clip-frame] { position: relative; }
video[data-clip-v] { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .8s var(--bl88def3a0d5); pointer-events: none; }
[data-playing] > video[data-clip-v] { opacity: 1; }
/* the still under a clip is the clip's own first frame: both sit on exactly the same crop, with no zoom or drift,
   so the fade from still to moving picture shows no jump */
img[data-clip-still], video[data-clip-v] { object-position: 50% 50% !important; animation: none !important; transform: none !important; }
video[data-clip-v]::-webkit-media-controls, video[data-clip-v]::-webkit-media-controls-start-playback-button { display: none !important; -webkit-appearance: none; }
.ux5bdec7fade[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { video[data-clip-v] { display: none; } }

/* ------------------------------------------------------------------ dark-ground themes (palette skin "dark", rule 73)
   Colours only. The two 3D scroll stages are rendered on a light ground (re-tinted per theme by --ez3cfd5013a5),
   so on a dark site they stay light islands and keep dark words. */
[data-skin="dark"] .nx1e0abe1c06, [data-skin="dark"] .kwe1f89defdb {
  --rp4c6a89fe1d: #141A22; --kwc8f99290b6: #2B313A; --gt1647dd7951: #4F4A42; --gt0c91d84602: var(--qsce443956ce);
  --pn2a8a7f4aab: rgb(20 26 34 / .16); --lyc2bc327957: rgb(20 26 34 / .13); --jdeb12f0efe8: rgb(20 26 34 / .24);
  color: #141A22;
}
/*7c41afdd4a91*/
