
.ip-catalog{background:#f3f6fa;color:#173660;padding-bottom:55px}.ip-wrap{max-width:1280px;margin:auto;padding:0 40px}.ip-breadcrumb{display:flex;gap:12px;flex-wrap:wrap;padding:24px 0;font-size:11px;color:#61738c}.ip-breadcrumb a:hover{text-decoration:underline}.ip-hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;background:#e7eef8;border:1px solid #d9e3f1;border-radius:12px;overflow:hidden;padding:38px 42px;gap:35px}.ip-eyebrow{display:block;font-size:10px;letter-spacing:.14em;font-weight:600;color:#537099;margin-bottom:13px}.ip-hero h1{font-size:clamp(30px,3.4vw,46px);font-weight:600;line-height:1.15;letter-spacing:-.035em;margin:0 0 20px;color:#173660}.ip-hero p{font-size:14px;line-height:1.9;color:#526782;max-width:480px;margin:0 0 25px}.ip-primary{display:inline-flex;align-items:center;gap:26px;padding:13px 21px;background:#ffb900;border-radius:3px;font-size:12px;font-weight:600;color:#142e53}.ip-hero-image{text-align:center;min-width:0}.ip-hero-image img{display:block;object-fit:contain;width:100%;height:230px;mix-blend-mode:multiply}.ip-hero-image>span{display:block;font-size:11px;color:#537099;margin-top:10px}.ip-products{padding:45px 0 35px;scroll-margin-top:155px}.ip-catalog-heading{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:22px}.ip-catalog-heading h2{font-size:28px;font-weight:600;letter-spacing:-.03em;margin:0;color:#173660}.ip-catalog-heading .ip-eyebrow{margin-bottom:8px}.ip-catalog-heading>p{font-size:12px;color:#61738c;margin:0 0 4px}.ip-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}.ip-filters button{display:flex;gap:18px;align-items:center;border:1px solid #d3ddeb;border-radius:6px;padding:10px 18px;font:inherit;font-size:12px;background:white;color:#173660;cursor:pointer}.ip-filters button span{font-size:10px;opacity:.65}.ip-filters button[aria-pressed=true]{background:#1c4287;border-color:#1c4287;color:white}.ip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}.ip-card{display:flex;flex-direction:column;background:white;border:1px solid #dce5f1;border-radius:10px;overflow:hidden;transition:box-shadow .2s}.ip-card:hover{box-shadow:0 8px 24px #17366012}.ip-card[hidden]{display:none}.ip-card-image{display:block;position:relative;background:#f0f4f9;padding:30px 25px 15px}.ip-badge{position:absolute;left:18px;top:16px;font-size:10px;font-weight:600;border:1px solid #d6e0ef;background:white;border-radius:4px;padding:3px 9px;z-index:1}.ip-card-image img{width:100%;height:190px;object-fit:contain;mix-blend-mode:multiply}.ip-card-body{padding:22px;display:flex;flex-direction:column;flex:1}.ip-type{font-size:10px;color:#62748e;margin-bottom:7px}.ip-card h3{font-size:17px;line-height:1.4;font-weight:600;color:#173660;margin:0 0 12px}.ip-card p{font-size:12px;line-height:1.85;color:#61738c;margin:0 0 25px}.ip-card-link{margin-top:auto;padding-top:15px;border-top:1px solid #e0e7f1;display:flex;justify-content:space-between;gap:8px;font-size:11px;font-weight:600;color:#1c4287}.ip-card-link span{font-size:17px}.ip-help{padding:25px 30px;background:#e5edf8;border-radius:9px;display:flex;align-items:center;justify-content:space-between;gap:24px}.ip-help h2{font-size:20px;font-weight:600;color:#173660;margin:0 0 6px}.ip-help p{font-size:12px;color:#526782;margin:0;line-height:1.8}.ip-help>a{white-space:nowrap;font-size:12px;font-weight:600;color:#173660;border-bottom:1px solid #7f96b7;padding:9px 0}.ip-help>a span{margin-left:20px}.ip-catalog a:focus-visible,.ip-catalog button:focus-visible{outline:3px solid #d99b00;outline-offset:4px}
@media(max-width:999px){.ip-wrap{padding:0 24px}.ip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ip-hero{padding:28px;gap:20px}.ip-hero-image img{height:200px}.ip-products{scroll-margin-top:95px}}
@media(max-width:600px){.ip-wrap{padding:0 18px}.ip-breadcrumb{font-size:10px;gap:8px;padding:18px 0}.ip-hero{grid-template-columns:1fr;padding:25px;gap:20px}.ip-hero h1{font-size:32px}.ip-hero p{font-size:13px}.ip-hero-image img{height:170px}.ip-products{padding-top:32px}.ip-catalog-heading h2{font-size:24px}.ip-catalog-heading>p{white-space:nowrap;font-size:10px}.ip-filters{gap:7px}.ip-filters button{padding:9px 12px;gap:8px;font-size:11px}.ip-grid{gap:13px}.ip-card-image{padding:32px 10px 12px}.ip-card-image img{height:135px}.ip-badge{left:12px;top:12px}.ip-card-body{padding:15px}.ip-card h3{font-size:13px;overflow-wrap:anywhere}.ip-card p{font-size:11px}.ip-card-link{font-size:10px}.ip-help{display:block;padding:23px}.ip-help>a{display:inline-block;margin-top:15px}}

.ip-hero-image{overflow:hidden}.ip-hero-image img{transform:scale(1.7)}.ip-hero-image>span{position:relative}.ip-card-image{overflow:hidden}.ip-card-image img{transform:scale(1.35)}

/* Keep the original bullet photograph comfortably inside its category card. */
.ip-card-image img.ip-original-bullet{transform:scale(.92)}

/* Installed-camera hero retains its full photographic composition. */
.ip-hero-installed img{height:auto;aspect-ratio:16/9;object-fit:cover;transform:none;mix-blend-mode:normal;border-radius:10px}

/* Original product photography assembled into a responsive range collage. */
.ip-range-collage{background:#fff;border-radius:12px;padding:12px 8px 18px;box-shadow:0 12px 30px #17366008}
.ip-range-stage{position:relative;aspect-ratio:1.35;background:url('/assets/products/stanklin-ip-range-studio-background.png') center/cover;border-radius:8px;isolation:isolate}
.ip-range-stage img{position:absolute;display:block;object-fit:contain;height:auto;aspect-ratio:auto;transform:none;mix-blend-mode:multiply}
.ip-range-stage .range-ptz{width:35%;height:61%;left:33%;top:0;z-index:2}
.ip-range-stage .range-bullet-left{width:37%;height:28%;left:0;top:17%;z-index:1}
.ip-range-stage .range-bullet-right{width:37%;height:28%;right:0;top:17%;z-index:1}
.ip-range-stage .range-dome-left{width:31%;height:37%;left:10%;top:36%;z-index:3}
.ip-range-stage .range-dome-right{width:31%;height:37%;right:9%;top:36%;z-index:3}
.ip-range-stage .range-nvr-left{width:33%;height:33%;left:0;top:68%}
.ip-range-stage .range-nvr-center{width:33%;height:33%;left:33.5%;top:68%}
.ip-range-stage .range-nvr-right{width:33%;height:33%;right:0;top:68%}
.ip-range-collage>span{font-size:10px;letter-spacing:.04em;margin-top:0;color:#526782}

/* Dark studio arrangement with three vertically stacked recorders. */
.ip-range-collage{padding:0 0 16px;background:#102d40;box-shadow:0 12px 30px #17366020}
.ip-range-stage{aspect-ratio:1.05;background-image:url('/assets/products/stanklin-ip-range-dark-studio.png');border-radius:12px 12px 0 0}
.ip-range-stage img{mix-blend-mode:normal;filter:drop-shadow(0 7px 5px #0003)}
.ip-range-stage .range-ptz{width:35%;height:46%;left:33%;top:3%}
.ip-range-stage .range-bullet-left{width:36%;height:24%;left:2%;top:18%}
.ip-range-stage .range-bullet-right{width:35%;height:30%;right:1%;top:15%}
.ip-range-stage .range-dome-left{width:31%;height:30%;left:11%;top:31%}
.ip-range-stage .range-dome-right{width:31%;height:30%;right:10%;top:31%}
.ip-range-stage .range-nvr-left{width:64%;height:57%;left:18%;top:36%;z-index:6}
.ip-range-stage .range-nvr-center{width:72.5%;height:57%;left:13.75%;top:43.8%;z-index:5}
.ip-range-stage .range-nvr-right{width:64%;height:57%;left:18%;right:auto;top:51.6%;z-index:4}
.ip-range-collage>span{color:#d8e6ef;padding:0 10px}

.ip-range-photograph{aspect-ratio:1;background:none;overflow:hidden}.ip-range-photograph img{position:static;width:100%;height:auto;aspect-ratio:1;filter:none;object-fit:contain;transform:none;mix-blend-mode:normal}.ip-range-collage:has(.ip-range-photograph)>span{padding-top:12px}

.ip-specialist-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ip-specialist-image img{transform:none;height:210px}@media(max-width:600px){.ip-specialist-image img{height:145px}}

/* Normalize visible product bounds, including transparent source margins. */
.ip-catalog .ip-card-image,.ip-catalog .nvr-card-art.nvr-card-photo{display:block;position:relative;height:230px;padding:0;overflow:hidden;background:#f0f4f9}
.ip-catalog .ip-product-frame{position:absolute;display:block;width:min(100%,360px);aspect-ratio:5/3;left:50%;top:50%;transform:translate(-50%,-50%)}
.ip-catalog .ip-product-frame img{display:block;position:absolute;max-width:none;max-height:none;object-fit:fill;transform:none;margin:0;padding:0;mix-blend-mode:multiply}
@media(max-width:600px){.ip-catalog .ip-card-image,.ip-catalog .nvr-card-art.nvr-card-photo{height:170px}}

.ip-resolution-group{margin-top:36px}.ip-resolution-group+.ip-resolution-group{margin-top:64px}.ip-resolution-group[hidden]{display:none}#ip-recorders>.ip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
