/* GreenGuard layered render supplied by SGL Golf. Scoped to the hardware section. */
#hardware{height:340svh;min-height:0}
#hardware .hardware-sticky{position:sticky;top:0;height:100svh;min-height:0;display:grid;grid-template-columns:minmax(0,.76fr) minmax(0,1.24fr);align-items:center;overflow:hidden}
#hardware .hardware-copy{padding:64px clamp(24px,4.5vw,80px);align-self:center}
#hardware .gg-visual{position:relative;inset:auto;min-height:0;height:100%;max-height:none;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:36px 24px 58px}
.gg-frame{position:relative;width:min(100%,calc((100svh - 100px)*1125/780));aspect-ratio:1125/780}
.gg-robot{position:absolute;inset:0 16.6667%;transform-origin:50% 50%}
.gg-part{position:absolute;inset:0;transform-origin:50% 50%}
.gg-part{will-change:transform}
.gg-part img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.gg-shadow{position:absolute;left:26%;right:25%;top:58%;height:9%;background:radial-gradient(closest-side,#17202b35,transparent);filter:blur(5px)}
.gg-scroll-hint{position:absolute;bottom:25px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#65727b;margin:0}
.gg-scroll-hint span{color:var(--orange);margin-left:10px}
.gg-uv{position:absolute;left:31%;top:59%;width:34%;height:10%;background:radial-gradient(closest-side,#5ccaf4cc,transparent);mix-blend-mode:screen;filter:blur(6px);opacity:0;transition:opacity .4s}
.gg-ping{position:absolute;left:44%;top:11.5%;width:0;height:0;pointer-events:none}
.gg-ping i{position:absolute;left:-32px;top:-11px;width:64px;height:22px;border:1.5px solid var(--orange);border-radius:50%;opacity:0}
#hardware[data-gg-phase="sense"] .gg-ping i{animation:gg-ping 2.6s ease-out infinite}
#hardware[data-gg-phase="sense"] .gg-ping i:nth-child(2){animation-delay:.85s}
#hardware[data-gg-phase="sense"] .gg-ping i:nth-child(3){animation-delay:1.7s}
#hardware[data-gg-phase="treat"] .gg-uv{animation:gg-uv 2.4s ease-in-out infinite}
@keyframes gg-ping{0%{transform:scale(.5);opacity:.85}100%{transform:scale(2.8);opacity:0}}
@keyframes gg-uv{0%,100%{opacity:.85}50%{opacity:.4}}
.gg-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.gg-lines path{fill:none;stroke:#65727b;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .65s cubic-bezier(.6,0,.2,1)}
.gg-lines circle{fill:var(--orange);opacity:0;transition:opacity .3s}
.gg-lines .is-visible path{stroke-dashoffset:0}
.gg-lines .is-visible circle{opacity:1}
.gg-lines circle.gg-verify-pulse{fill:none;stroke:var(--orange);stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center}
#hardware[data-gg-phase="verify"] .gg-lines .gg-verify-pulse{animation:gg-verify 2.4s ease-out infinite}
@keyframes gg-verify{0%{transform:scale(.4);opacity:.8}100%{transform:scale(2.4);opacity:0}}
.gg-callout{position:absolute;width:17%;opacity:0;transform:translateY(8px);transition:opacity .45s ease .2s,transform .45s ease .2s;color:#65727b;pointer-events:none}
.gg-callout strong{display:block;font-size:clamp(16px,1.7vw,24px);font-weight:500;line-height:1.1;transition:color .3s}
.gg-callout small{display:block;margin-top:6px;font-size:clamp(9px,.75vw,11px);line-height:1.5;letter-spacing:.06em;text-transform:uppercase}
.gg-callout.is-visible{opacity:1;transform:none}
.gg-callout.is-active strong{color:#17202b}
.gg-sense{left:71%;top:3%}
.gg-treat{left:0;top:52%;text-align:right}
.gg-verify{left:83%;top:70%}
#hardware:not(.gg-in-view) .gg-ping i,#hardware:not(.gg-in-view) .gg-uv,#hardware:not(.gg-in-view) .gg-verify-pulse{animation-play-state:paused}
@media(max-width:820px){
 #hardware{height:300svh}
 #hardware .hardware-sticky{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);display:grid}
 #hardware .hardware-copy{padding:28px 24px 12px}
 #hardware .hardware-copy h2{font-size:clamp(32px,7vw,48px);line-height:1.03}
 #hardware .hardware-copy .eyebrow{font-size:10px;margin-bottom:10px}
 #hardware .hardware-copy>p:last-child{font-size:14px;line-height:1.5;margin-top:14px;max-width:560px}
 #hardware .gg-visual{padding:8px 20px 92px;height:100%;min-height:0;max-height:none;container-type:size}
 #hardware .gg-frame{width:min(100%,calc((100svh - 366px)*750/780));aspect-ratio:750/780}
 @supports(height:1cqh){#hardware .gg-frame{width:min(100%,calc(100cqh*750/780))}}
 #hardware .gg-robot{inset:0}
 #hardware .gg-shadow{left:14%;right:12%}
 #hardware .gg-lines{display:none}
 #hardware .gg-callout{top:calc(100% + 8px);width:32%;text-align:center}
 #hardware .gg-sense{left:0}
 #hardware .gg-treat{left:34%}
 #hardware .gg-verify{left:68%}
 #hardware .gg-callout strong{font-size:14px}
 #hardware .gg-callout small{font-size:8px;letter-spacing:.03em;line-height:1.4;margin-top:4px}
 #hardware .gg-scroll-hint{bottom:12px;font-size:9px}
}
@media(max-height:560px) and (min-width:821px){#hardware .hardware-copy{padding:24px 32px}#hardware .hardware-copy h2{font-size:40px}#hardware .hardware-copy>p:last-child{font-size:15px;margin-top:18px}}
@media(prefers-reduced-motion:reduce),(max-height:540px) and (max-width:820px){
 #hardware{height:auto}
 #hardware .hardware-sticky{position:relative;height:auto;min-height:0}
 #hardware .gg-visual{height:auto;min-height:0;container-type:normal;padding:24px}
 #hardware .gg-frame{width:min(100%,850px)}
 #hardware .gg-scroll-hint{display:none}
 #hardware .gg-uv,#hardware .gg-ping i,#hardware .gg-lines .gg-verify-pulse{animation:none;transition:none}
 #hardware .gg-uv{opacity:.55}
 #hardware .gg-lines path,#hardware .gg-lines circle,#hardware .gg-callout{transition:none}
}
@media(prefers-reduced-motion:reduce) and (max-width:820px),(max-height:540px) and (max-width:820px){#hardware .gg-visual{padding-bottom:100px}#hardware .gg-frame{width:min(100%,500px)}}
