.guard-hero{display:grid;grid-template-columns:1.1fr 1fr;background:var(--paper)}
.guard-hero>div:first-child{padding:60px 38px}
.guard-hero h1{font-size:clamp(38px,4vw,62px);margin:24px 0}
.guard-hero p{font-size:15px;line-height:1.8;max-width:490px}
.guard-hero .primary{margin:15px 0}
.guard-hero .guard-domain{font-size:13px;font-weight:600;color:var(--ink);margin-top:24px}
.guard-domain span{display:block;font-size:10px;font-weight:400;color:var(--muted)}
.guard-hero .hero-demo{color:var(--muted);line-height:1.7}
.guard-visual{position:relative;min-height:480px;overflow:hidden;background:var(--dark)}
.guard-visual img{position:absolute;height:200%;width:100%;object-fit:cover;bottom:0}
.guard-visual>span{position:absolute;bottom:18px;left:18px;right:18px;background:#191b1edb;color:white;font-size:9px;line-height:1.7;padding:12px}
.guard-connection{background:var(--paper)}
.guard-connection h2{margin-top:18px}
.guard-connection p{max-width:780px}
.guard-catalog h2{margin:18px 0}
.guard-catalog>p{max-width:760px;line-height:1.8}
.guard-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:30px 0 20px}
.guard-product-card{padding:0;text-align:left;border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden;color:var(--ink);cursor:pointer}
.guard-product-card:hover{border-color:var(--accent-strong);box-shadow:0 8px 24px #191b1e10}
.guard-product-photo{display:block;background-image:url('assets/hardening-demo-pair.png');background-repeat:no-repeat;background-color:var(--paper);aspect-ratio:1.25; background-size:250% auto}
.guard-vent-photo{background-image:url('assets/guard-vent-cutaway.jpeg');background-size:cover;background-position:center}
.guard-fence-photo{background-image:url('assets/guard-metal-fence.jpeg');background-size:cover;background-position:center}
.guard-sprinkler-photo{background-image:url('assets/guard-roof-sprinkler.jpeg');background-size:cover;background-position:center}
.guard-card-copy{display:grid;gap:16px;padding:23px}
.guard-card-copy small{font-size:9px;letter-spacing:.1em;color:var(--muted)}
.guard-card-copy strong{font-family:var(--heading);font-size:21px;font-weight:600}
.guard-card-copy>span{font-size:12px;color:var(--accent-strong);display:flex;justify-content:space-between}
.guard-product-section{display:grid;grid-template-columns:1fr 1.1fr;gap:46px;padding:60px 38px;border-top:1px solid var(--line);scroll-margin-top:20px}
.guard-product-section:nth-of-type(even){background:var(--paper)}
.guard-product-section figure{margin:0;align-self:start}
.guard-product-section figcaption{font-size:9px;line-height:1.7;padding:14px 0;color:var(--muted);letter-spacing:.06em}
.guard-product-copy h2{font-size:32px;margin:15px 0 22px}
.guard-product-copy h3{font-size:22px;margin:0 0 20px}
.guard-product-copy p{font-size:14px;line-height:1.8}
.guard-product-copy dl{margin:25px 0}
.guard-product-copy dl>div{border-top:1px solid var(--line);padding:16px 0;display:grid;grid-template-columns:140px 1fr;gap:18px;font-size:12px;line-height:1.7}
.guard-product-copy dt{font-weight:600}
.guard-product-copy dd{margin:0;color:var(--muted)}
.guard-product-copy details{border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:20px;background:var(--surface)}
.guard-product-copy summary{cursor:pointer;font-size:12px;font-weight:600;line-height:1.6}
.guard-product-copy details p{font-size:12px;margin:15px 0 0}
.guard-product-status{display:block;font-size:10px;color:var(--muted);margin-top:20px;line-height:1.6}
.guard-evidence{border-top:1px solid var(--line)}
.guard-evidence h2{margin:18px 0 30px}
.guard-evidence .micro{margin-top:25px;line-height:1.8}
.guard-evidence .micro a{text-decoration:underline}
@media(max-width:1100px){.guard-product-section{grid-template-columns:1fr;gap:20px}.guard-product-section figure{max-width:600px}.guard-product-grid{gap:12px}.guard-card-copy{padding:16px}.guard-card-copy strong{font-size:17px}}
@media(max-width:650px){.guard-product-grid{grid-template-columns:1fr}.guard-product-section{padding:35px 22px}.guard-product-copy dl>div{grid-template-columns:1fr;gap:5px}.guard-product-copy h2{font-size:28px}}
.company-grid:has(a[href="#guard"]){grid-template-columns:repeat(2,minmax(0,1fr))}
.services:has(a[href="#guard"]){grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:900px){.guard-hero{grid-template-columns:1fr}.guard-visual{min-height:360px}}
@media(max-width:600px){.guard-hero>div:first-child{padding:35px 24px}.company-grid:has(a[href="#guard"]),.services:has(a[href="#guard"]){grid-template-columns:1fr}}

