/* Hawk Security preview: extra rules on top of the Hawk family CSS */
:root{--navy:#0A0F1E}
.wordmark{font-size:1.25rem;font-weight:900;color:#fff;letter-spacing:.06em;text-transform:uppercase;line-height:1;display:inline-flex;align-items:center;min-height:44px}
.wordmark span{color:var(--yellow)}
.header-logo{text-decoration:none}
.mobile-nav{display:none;position:relative}
.mobile-nav summary{list-style:none;cursor:pointer;min-height:44px;min-width:44px;padding:0 var(--s2);display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.35);border-radius:6px;color:#fff;font-weight:700;font-size:1rem}
.mobile-nav summary::-webkit-details-marker{display:none}
.mobile-nav .menu{position:absolute;right:0;top:56px;width:min(300px,86vw);background:#111;border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:var(--s1);display:flex;flex-direction:column}
.mobile-nav .menu a{display:flex;align-items:center;min-height:48px;padding:0 var(--s2);color:#fff;text-decoration:none;font-size:1rem;border-radius:6px}
.mobile-nav .menu a:hover{background:rgba(255,255,255,.08)}
@media(max-width:1240px){.mobile-nav{display:block}}
#header .container{height:72px}
.hero-bg{background-image:url(https://static.wixstatic.com/media/be083c_db06340e37234bfc91dfe7593dd0e0e5~mv2.jpg/v1/fit/w_1600,h_900,q_80,enc_auto/hero.jpg)}
#hero{min-height:auto}
#hero .hero-content{padding:calc(72px + var(--s12)) 0 var(--s12)}
@media(max-width:700px){#hero .hero-content{padding:calc(60px + var(--s8)) 0 var(--s8)}}
#hero h1{font-size:clamp(2rem,5vw,3.5rem)}
.hero-trust{margin-top:var(--s2)}
.hero-buttons{margin-bottom:var(--s5)}
.hs-section{padding:var(--s12) 0}
@media(max-width:700px){.hs-section{padding:var(--s8) 0}}
.bg-2{background:var(--dark2)}.bg-3{background:var(--dark3)}.bg-navy{background:var(--navy)}
.hs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);grid-auto-rows:1fr}
@media(max-width:1000px){.hs-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.hs-grid{grid-template-columns:1fr}}
.pv-photo img.pos-left{object-position:22% 50%}
.pv-photo img.pos-top{object-position:50% 25%}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);grid-auto-rows:1fr}
@media(max-width:800px){.steps3{grid-template-columns:1fr}}
.step3{background:var(--dark3);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:var(--s3);display:flex;flex-direction:column;gap:var(--s1);text-align:left}
.step3 .n{font-size:.875rem;font-weight:800;letter-spacing:.1em;color:var(--yellow)}
.step3 h3{font-size:1.25rem;color:#fff}
.step3 p{font-size:1rem}
.xlink{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:center}
@media(max-width:860px){.xlink{grid-template-columns:1fr;gap:var(--s5)}}
.xlink .split-img{aspect-ratio:4/3}
.xlink h2{margin-bottom:var(--s2)}
.xlink p{margin-bottom:var(--s3)}
.page-hero{position:relative;overflow:hidden;padding:calc(72px + var(--s8)) 0 var(--s8)}
.page-hero .ph-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.32)}
.page-hero .ph-ov{position:absolute;inset:0;background:linear-gradient(160deg,rgba(10,15,30,.9) 0%,rgba(13,13,13,.6) 100%)}
.page-hero .container{position:relative;z-index:2;max-width:980px}
.page-hero h1{font-size:clamp(2rem,4.6vw,3.25rem);margin-bottom:var(--s3)}
.page-hero .lead{font-size:1.1875rem;color:var(--grey-lt);max-width:60ch;margin-bottom:var(--s4)}
@media(max-width:700px){.page-hero{padding:calc(60px + var(--s5)) 0 var(--s6)}}
.crumb{font-size:.9375rem;margin-bottom:var(--s2);color:var(--text-2)}
.crumb a{color:var(--text-2);display:inline-flex;align-items:center;min-height:44px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:start}
@media(max-width:860px){.two-col{grid-template-columns:1fr;gap:var(--s5)}}
.two-col h2{margin-bottom:var(--s2)}
.two-col p+p{margin-top:var(--s2)}
.check-list{list-style:none;display:flex;flex-direction:column;gap:var(--s2)}
.check-list li{display:flex;gap:var(--s2);align-items:flex-start;color:var(--text-2);font-size:1.0625rem;line-height:1.55}
.check-list li::before{content:'';width:18px;height:18px;margin-top:4px;flex-shrink:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 4.8' fill='none' stroke='%23F5C400' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.photo-wide{border-radius:8px;overflow:hidden;aspect-ratio:16/9;border:1px solid rgba(255,255,255,.12)}
.photo-wide img{width:100%;height:100%;object-fit:cover;display:block}
.cta-band{background:var(--dark3);border:1px solid rgba(245,196,0,.25);border-radius:12px;padding:var(--s6);display:flex;flex-direction:column;gap:var(--s2);align-items:flex-start}
.cta-band h2{font-size:clamp(1.5rem,3vw,2rem)}
.cta-band .row{display:flex;flex-wrap:wrap;gap:var(--s2)}
@media(max-width:700px){.cta-band{padding:var(--s4) var(--s3)}}
.note-box{font-size:.9375rem;color:var(--text-2);padding:var(--s2) var(--s3);background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:6px;max-width:65ch}
/* form */
.hs-form{background:rgba(13,27,42,.95);border:1px solid rgba(245,196,0,.25);border-radius:12px;padding:var(--s5) var(--s4);display:flex;flex-direction:column;gap:var(--s2)}
@media(max-width:700px){.hs-form{padding:var(--s4) var(--s3)}}
.hs-form label{display:flex;flex-direction:column;gap:var(--s1);font-size:1rem;font-weight:600;color:#fff}
.hs-form input,.hs-form textarea{font:inherit;font-size:1rem;min-height:48px;padding:12px var(--s2);background:#0D0D0D;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:6px;width:100%}
.hs-form textarea{min-height:120px;resize:vertical}
.hs-form input:focus,.hs-form textarea:focus{outline:3px solid #F5C400;outline-offset:2px}
.hs-form .btn{width:100%}
.hs-form .fine{font-size:.9375rem;color:var(--text-2);text-align:left}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:start}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr;gap:var(--s5)}}
.contact-grid h2{margin-bottom:var(--s2)}
.cd{display:flex;flex-direction:column;gap:var(--s1);margin:var(--s3) 0}
.cd a,.cd span{color:#fff;text-decoration:none;font-size:1.0625rem;display:flex;align-items:center;min-height:44px}
.cd a:hover{color:var(--yellow)}
.cd small{display:block;color:var(--text-2);font-size:.875rem;margin-right:var(--s2);min-width:72px;text-transform:uppercase;letter-spacing:.08em}
.brand-line{display:flex;gap:var(--s2);flex-wrap:wrap}
.footer-top{grid-template-columns:2fr 1fr 1fr 1fr}
@media(max-width:920px){.footer-top{grid-template-columns:1fr 1fr}}
@media(max-width:500px){.footer-top{grid-template-columns:1fr}}
@media(max-width:700px){[data-symphony-badge]{bottom:76px!important}}
.hs-form select{font:inherit;font-size:1rem;min-height:48px;padding:0 var(--s2);background:#0D0D0D;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:6px;width:100%}
@media(max-width:1000px){.header-cta{display:none}}@media(max-width:700px){.header-phone{display:none}}
.logo-img{height:56px;width:auto;display:block}
.footer-logo{height:104px;width:auto;display:block;margin-bottom:var(--s2)}
@media(max-width:700px){.logo-img{height:48px}}
/* Flashlight hero: effect lives on the photo only. Text sits on an opaque dark panel. */
.fx{position:relative;overflow:hidden;min-height:600px}
.fx .hero-content{padding-bottom:var(--s12)}
.fl-scene{position:absolute;inset:0;overflow:hidden;--x:74%;--y:46%;--r:260px;pointer-events:none;background:#0D0D0D}
.fl-dark,.fl-lit{position:absolute;inset:0;background-image:var(--img);background-size:cover;background-position:var(--bp,center 40%);pointer-events:none}
.fl-dark{filter:brightness(.3)}
.fl-lit{filter:brightness(1);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y),#000 0%,rgba(0,0,0,.92) 38%,rgba(0,0,0,.35) 72%,transparent 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y),#000 0%,rgba(0,0,0,.92) 38%,rgba(0,0,0,.35) 72%,transparent 100%)}
.fx{touch-action:pan-y}
.fl-panel{position:relative;z-index:2;max-width:640px;background:rgba(8,10,18,.9);border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:var(--s5)}
.fx .page-hero .container,.page-hero.fx .container{max-width:1240px}
.fx .hero-content .container{max-width:1240px}
.fx .hero-content{position:relative;z-index:2;padding-top:calc(72px + var(--s12))}
.page-hero.fx{padding:calc(72px + var(--s8)) 0 var(--s12)}
@media(max-width:700px){
 .fx{min-height:0}
 .fl-scene{--r:150px;--x:70%;--y:82%}
 .fl-panel{padding:var(--s3)}
 .fx .hero-content{padding-top:calc(60px + var(--s5));padding-bottom:calc(var(--s8) + 200px)}
 .page-hero.fx{padding:calc(60px + var(--s4)) 0 calc(var(--s8) + 200px)}
}
@media(prefers-reduced-motion:reduce){.fl-lit{display:none}.fl-dark{filter:brightness(.55)}}
/* calm hover states only */
.btn:hover{transform:none}
.pv-card:hover,.step3:hover{border-color:rgba(245,196,0,.6);background:#232323}
.step3:hover{background:#242424}
.pv-card,.step3{transition:none}
/* Standout layer: identity */
.brand-row{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s3);flex-wrap:wrap}
.brand-row .hero-live-badge{margin:0}
.shield{flex-shrink:0;display:block}
#hero h1{font-size:clamp(2.25rem,5.5vw,4rem);font-weight:900;letter-spacing:-.02em;line-height:1.05}
#hero h1 em{display:inline-block;border-bottom:6px solid var(--yellow);padding-bottom:2px}
.section-header h2,.two-col h2{font-weight:900;letter-spacing:-.01em}
.section-label{display:inline-flex;align-items:center;gap:var(--s1)}
.section-label::before{content:'';width:24px;height:4px;background:var(--yellow);display:inline-block}
/* tabs (work without scripts: all panels show) */
.tabs{max-width:1100px;margin:0 auto}
.tab-ctl{display:none;gap:var(--s2);flex-wrap:wrap;margin-bottom:var(--s4);justify-content:center}
.tabs.js .tab-ctl{display:flex}
.tab-btn{font:inherit;font-size:1rem;font-weight:700;min-height:48px;min-width:44px;padding:0 var(--s4);border-radius:6px;background:transparent;color:#fff;border:2px solid rgba(255,255,255,.45);cursor:pointer}
.tab-btn:hover{border-color:var(--yellow);color:var(--yellow)}
.tab-btn[aria-selected="true"]{background:var(--yellow);border-color:var(--yellow);color:#0D0D0D}
.tab-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.tab-stack{display:grid;gap:var(--s5)}
.tabs.js .tab-panel[hidden]{display:none}
.tp{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:center}
@media(max-width:860px){.tp{grid-template-columns:1fr;gap:var(--s3)}}
.tp-img{aspect-ratio:4/3}
.tp-text{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2);text-align:left}
.tp-text h3{font-size:1.75rem;font-weight:900;color:#fff}
.tp-text h4,.cmp h4{font-size:.875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow);font-weight:800}
.step-no{font-size:.875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow);font-weight:800}
.cmp{display:grid;grid-template-columns:auto 1fr 1fr;gap:var(--s5);align-items:start;background:var(--dark3);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:var(--s5)}
.cmp>div h4{margin-bottom:var(--s1)}
@media(max-width:860px){.cmp{grid-template-columns:1fr;gap:var(--s3);padding:var(--s3)}}
/* day / night */
.fxbox{position:relative;aspect-ratio:4/3;border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.12);touch-action:pan-y}
.fxbox .fl-scene{--x:50%;--y:50%;--r:200px}
.fxbox[data-mode="day"] .fl-dark{filter:none}
.fxbox[data-mode="day"] .fl-lit{display:none}
.fxbox[data-mode="night"] .fl-dark{filter:brightness(.3)}
.dn-btn[aria-pressed="true"]{background:var(--yellow);color:#0D0D0D}
@media(prefers-reduced-motion:reduce){.fxbox[data-mode="night"] .fl-lit{display:none}.fxbox[data-mode="night"] .fl-dark{filter:brightness(.55)}}
/* services: calm hover */
.cmp:hover{border-color:rgba(245,196,0,.6)}
/* Logo (new file, ratio 1.5:1) */
.logo-img{height:56px;width:auto}
@media(max-width:700px){.logo-img{height:44px}}
.footer-logo{height:104px;width:auto}
/* Hawk Group of Companies footer row */
.group-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1) var(--s4);padding:var(--s3) 0;margin-bottom:var(--s3);border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.group-title{font-size:.875rem;font-weight:800;letter-spacing:.08em;color:#E8E8E8;margin:0}
.group-links{list-style:none;display:flex;flex-wrap:wrap;gap:0 var(--s4);margin:0;padding:0}
.group-links a{display:inline-flex;align-items:center;min-height:44px;font-size:1rem;color:var(--text-2);text-decoration:none}
.group-links a:hover{color:#fff;text-decoration:underline}
/* Polished matte gold FINISH over the logo's original colours (source file untouched). Only when scripts run and motion is allowed. */
.logo-shine{position:relative;display:inline-block;line-height:0;isolation:isolate}
.footer-shine{margin-bottom:var(--s2)}
.footer-shine .footer-logo{margin-bottom:0}
.logo-shine::before,.logo-shine::after{content:'';position:absolute;inset:0;pointer-events:none;
 -webkit-mask-image:url(https://static.wixstatic.com/media/be083c_abe044aeae21484898d1a2322edb5f28~mv2.png/v1/fit/w_486,h_323,q_80,enc_auto/hawk-security-logo-sm.png);mask-image:url(https://static.wixstatic.com/media/be083c_abe044aeae21484898d1a2322edb5f28~mv2.png/v1/fit/w_486,h_323,q_80,enc_auto/hawk-security-logo-sm.png);
 -webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.logo-shine::before{display:none;mix-blend-mode:soft-light;opacity:.5;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.6' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"),linear-gradient(135deg,#FFE38F 0%,#E8C060 45%,#C9933A 100%)}
.logo-shine::after{display:none}
@supports ((-webkit-mask-image:url(x)) or (mask-image:url(x))){.logo-shine.mask-ok::before,.logo-shine.mask-ok::after{display:block}}
.js .logo-shine.mask-ok img{filter:drop-shadow(0 0 .6px rgba(255,238,180,.75))}
/* v13 interactive beam: a yellow searchlight follows the pointer across the logo, clipped to the logo's own shape. The mask is weaker on the navy so the H stays readable. At rest nothing is drawn. */
.logo-shine{--bx:-200px;--by:50%;--br:60px;--bry:50px;--bo:0}
.logo-shine::after{opacity:var(--bo);-webkit-mask-image:url(https://static.wixstatic.com/media/be083c_a91019ab7b5849f0b8d76ef7947d2c82~mv2.png/v1/fit/w_486,h_323,q_80,enc_auto/hawk-security-beam-mask.png);mask-image:url(https://static.wixstatic.com/media/be083c_a91019ab7b5849f0b8d76ef7947d2c82~mv2.png/v1/fit/w_486,h_323,q_80,enc_auto/hawk-security-beam-mask.png);
 background:radial-gradient(ellipse var(--br) var(--bry) at var(--bx) var(--by),rgba(255,243,168,.97) 0,rgba(250,210,40,.88) 26%,rgba(245,196,0,.5) 58%,rgba(245,196,0,0) 100%);transition:opacity .35s ease-out!important}
@media(prefers-reduced-motion:reduce){.logo-shine::before{display:none!important}.js .logo-shine img{filter:none}.logo-shine::after{display:none!important}}
/* Visible brand name beside the header logo */
.header-logo{gap:var(--s2);min-height:48px;align-items:center}
.brand-name{font-family:'Inter',system-ui,sans-serif;font-weight:800;font-size:1.25rem;letter-spacing:.01em;color:#fff;white-space:nowrap;line-height:1}
@media(max-width:700px){.header-logo{gap:var(--s1)}.brand-name{font-size:1.0625rem}}
@media(max-width:360px){.brand-name{font-size:1rem}}
@media(max-width:1400px){.header-cta{display:none}}
/* Illustration labels */
.photo-wide,.pv-photo{position:relative}
.img-tag{position:absolute;right:var(--s2);bottom:var(--s2);z-index:3;pointer-events:none;background:rgba(8,10,18,.88);color:#fff;font-size:.875rem;font-weight:600;line-height:1;padding:8px 12px;border-radius:4px;border:1px solid rgba(255,255,255,.25)}
.page-hero>.img-tag,#hero>.img-tag{right:var(--s3);bottom:var(--s3)}
/* v10: real photos only. Slots without a real photo are text cards with the shield motif. */
.pv-nophoto{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:var(--s2);padding:var(--s3);background:linear-gradient(160deg,#10162a 0%,#0D0D0D 100%);border-bottom:3px solid var(--yellow);text-decoration:none}
.pv-nophoto .shield{width:56px;height:auto}
.pv-nophoto span{font-size:1.75rem;font-weight:900;color:#fff;letter-spacing:-.01em;line-height:1.1}
.np-panel{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:var(--s2);padding:var(--s4);background:linear-gradient(160deg,#10162a 0%,#0D0D0D 100%);border-bottom:3px solid var(--yellow)}
.np-panel .shield{width:64px;height:auto}
.np-num{font-size:6rem;font-weight:900;line-height:1;color:var(--yellow)}
.np-label{font-size:1.75rem;font-weight:900;color:#fff;line-height:1.1}
.page-hero.nophoto{background:linear-gradient(160deg,#10162a 0%,#0D0D0D 100%);border-bottom:3px solid var(--yellow)}
.page-hero.nophoto .np-bg{position:absolute;right:var(--s6);top:50%;transform:translateY(-50%);opacity:.14;pointer-events:none}
.page-hero.nophoto .np-bg .shield{width:260px;height:auto}
@media(max-width:700px){.page-hero.nophoto .np-bg{right:var(--s2)}.page-hero.nophoto .np-bg .shield{width:140px}.np-num{font-size:4.5rem}}
.page-hero.nophoto .fl-panel{background:transparent;border:0;padding:0}
.page-hero.nophoto{padding-bottom:var(--s8)}
/* patrol-car photo: guard sits at the left of the picture, so the text panel moves right on wide screens and the beam rests on the guard */
.fx.right .fl-scene{--x:30%;--y:50%}
@media(min-width:1001px){.fx.right .fl-panel{margin-left:auto}}
.fl-dark,.fl-lit{background-position:center 35%}
@media(max-width:700px){.hs-grid[style*="1fr 1fr"]{grid-template-columns:1fr!important}}
/* v11 picture layout */
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
@media(max-width:700px){.two-up{grid-template-columns:1fr}}
.fig{margin:0}
.fig figcaption{margin-top:12px;font-size:.9375rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--yellow)}

/* v12: home hero shows the night construction picture whole (cap logo, banner, vehicle door), never cropped */
.fx.split{background:#0D0D0D;align-items:stretch}
.fx.split .hero-content{width:100%;align-self:stretch}
.fx.split .hero-content .container{width:100%;max-width:1240px;margin:0 auto}
.fx.split .fl-panel{margin-left:0;margin-right:auto}
.fx.split .fl-scene{--x:40%;--y:42%;--r:220px}
.fx.split .fl-dark,.fx.split .fl-lit{background-size:contain;background-repeat:no-repeat;background-position:center center}
@media(min-width:1001px){.fx.split .fl-scene{left:52%;right:max(24px,calc((100% - 1240px)/2 + 24px));top:50%;bottom:auto;height:auto;aspect-ratio:4/3;transform:translateY(-38%);border-radius:8px;border:1px solid rgba(255,255,255,.14)}.fx.split .fl-panel{max-width:540px}.fx.split{min-height:0}}
@media(max-width:1000px){.fx.split .fl-scene{left:0;right:0;top:auto;bottom:0;height:75vw;max-height:520px;--r:150px}.fx.split .hero-content{padding-bottom:calc(var(--s8) + min(75vw,520px))}}

/* v12: footer lockup, logo with the name beside it */
.footer-lockup{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s2);flex-wrap:nowrap}
.footer-lockup .footer-shine{margin-bottom:0;flex-shrink:0}
.footer-name{font-size:1.5rem}
@media(max-width:700px){.footer-name{font-size:1.25rem}.footer-logo{height:84px}}

.footer-col h3{font-size:.875rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#E8E8E8;margin-bottom:16px}
.cmp h3.cmp-h{font-size:.875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow);font-weight:800;margin-bottom:var(--s1)}
