.ts-page{
  --heading:#082f6d; --text-body:#5a5a72; --purple:#36357f; --accent:#00c1c4;
  --btn-blue:#2970e1; --btn-blue-hover:#1f5dc0; --card-border:#e7e7e7; --bg:#f4f6f9;
  --card-radius:12px;
}.ts-page *{margin:0;padding:0;box-sizing:border-box}.ts-page img{display:block}.ts-page a{color:var(--btn-blue);text-decoration:none}.ts-page .wrap{max-width:1200px;margin:0 auto;padding:0 24px}/* ===== Nav ===== *//* ===== Hero slider (75vh, 4 slides, crossfade) ===== */.ts-page .hero{position:relative;height:75vh;min-height:420px;overflow:hidden;color:#fff}.ts-page .slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;opacity:0;transition:opacity 1.4s ease;pointer-events:none}.ts-page .slide.on{opacity:1;pointer-events:auto;z-index:2}.ts-page .slide .wrap{position:relative;z-index:2;width:52%;max-width:720px;text-align:left;margin-left:6vw}.ts-page .hero-prod{position:absolute;right:3%;top:50%;transform:translateY(-50%);width:44%;aspect-ratio:1.85;z-index:1;pointer-events:none}.ts-page .hero-prod img{width:100%;height:100%;object-fit:contain}.ts-page .slide .eyebrow{margin-bottom:12px}.ts-page .slide .eyebrow img{height:56px;width:auto;object-fit:contain;display:inline-block;vertical-align:middle}.ts-page .slide h1{font-size:44px;font-weight:800;letter-spacing:.5px;margin-bottom:10px;color:#fff}.ts-page .slide p{font-size:18px;color:rgba(255,255,255,.85);max-width:640px;margin:0 auto}.ts-page .s1{background:url('https://www.titansis.com/wp-content/uploads/datasheets/webp/hero-ip-cameras.webp') center/cover no-repeat,linear-gradient(135deg,#082f6d,#36357f)}.ts-page .s2{background:url('https://www.titansis.com/wp-content/uploads/datasheets/webp/hero-ptz.webp') center/cover no-repeat,linear-gradient(135deg,#1b2e63,#45397f)}.ts-page .s3{background:url('https://www.titansis.com/wp-content/uploads/datasheets/webp/hero-nvr.webp') center/cover no-repeat,linear-gradient(135deg,#0d3a66,#3b3a7f)}.ts-page .s4{background:url('https://www.titansis.com/wp-content/uploads/datasheets/webp/hero-anpr.webp') center/cover no-repeat,linear-gradient(135deg,#12315f,#4a3a7a)}.ts-page .dots{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:5}.ts-page .dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.35);cursor:pointer;transition:background .3s}.ts-page .dots span.on{background:#fff}/* ===== Filter bar ===== */.ts-page .filterbar{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--card-border);padding:12px 0;box-shadow:0 2px 8px rgba(0,0,0,.05)}.ts-page .filter-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0}.ts-page .filter-row .f-label{font-weight:800;color:var(--heading);font-size:14px;min-width:58px}.ts-page .chip{display:inline-block;padding:5px 14px;border-radius:999px;font-size:13px;font-weight:700;cursor:pointer;border:1.5px solid #d3dae4;background:#f6f8fb;color:#33415c;user-select:none;transition:all .15s}.ts-page .chip:hover{border-color:var(--purple);color:var(--purple)}.ts-page .chip.on{background:var(--purple);border-color:var(--purple);color:#fff}.ts-page .lab{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:700;background:#eef1f6;color:#082f6d;border:1px solid #d3dae4;white-space:nowrap}.ts-page .lab.on{background:#082f6d;color:#fff;border-color:#082f6d}.ts-page .search-box{flex:1;min-width:200px;max-width:320px;margin-left:auto}.ts-page .search-box input{width:100%;padding:8px 14px;border:1.5px solid #d3dae4;border-radius:6px;font-family:inherit;font-size:14px;outline:none}.ts-page .search-box input:focus{border-color:var(--purple)}/* ===== Groups ===== */.ts-page main{padding:32px 0 64px}.ts-page .group{margin-bottom:52px}.ts-page .group-head{display:flex;align-items:baseline;gap:12px;margin-bottom:18px;border-bottom:2px solid var(--accent);padding-bottom:8px}.ts-page .group-head h2{font-size:26px;font-weight:800;color:var(--heading)}.ts-page .group{scroll-margin-top:80px}.ts-page .group-head .n{color:var(--text-body);font-weight:600;font-size:14px}.ts-page .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.ts-page .card{background:#fff;border:1px solid var(--card-border);border-radius:var(--card-radius);overflow:hidden;transition:box-shadow .2s,transform .15s;display:flex;flex-direction:column;cursor:pointer}.ts-page .card:hover{box-shadow:0 10px 24px rgba(8,47,109,.12);transform:translateY(-3px)}.ts-page .card .pic{position:relative;background:var(--bg);padding:14px;display:flex;align-items:center;justify-content:center;min-height:170px}.ts-page .card .pic::after{content:"";position:absolute;right:8px;bottom:8px;width:68px;height:26px;background:url('https://www.titansis.com/wp-content/uploads/datasheets/webp/NDAA-ICON.png') no-repeat center/contain}.ts-page .card .pic img{max-width:100%;max-height:150px;object-fit:contain}.ts-page .card .body{padding:12px 14px 14px;flex:1;display:flex;flex-direction:column;gap:8px}.ts-page .card .model{font-weight:800;color:var(--heading);font-size:16px;line-height:1.3}.ts-page .card .sub{font-size:12.5px;color:var(--text-body);line-height:1.45;flex:1}.ts-page .card .meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px}.ts-page .badge{display:inline-block;padding:2px 9px;border-radius:4px;font-size:11px;font-weight:800;color:#fff}.ts-page .b-s{background:#2e9e63}.ts-page .b-p{background:#2970e1}.ts-page .b-e{background:#7a4bd8}.ts-page .card .pdf{font-size:12px;font-weight:700;color:var(--btn-blue)}.ts-page .no-result{display:none;text-align:center;padding:60px 0;color:#999;font-weight:600}/* ===== CTA ===== */.ts-page .cta{background:var(--purple);color:#fff;position:relative;overflow:hidden;padding:56px 0;text-align:center}.ts-page .cta::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%2336acbb' stroke-opacity='.18' stroke-width='2'%3E%3Cpath d='M0 60h120M60 0v120'/%3E%3Ccircle cx='60' cy='60' r='22'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat}.ts-page .cta>*{position:relative}.ts-page .cta h2{font-size:30px;font-weight:800;margin-bottom:8px}.ts-page .cta p{color:rgba(255,255,255,.8);margin-bottom:20px}.ts-page .cta .phone{color:var(--accent);font-size:24px;font-weight:800;margin-bottom:22px;display:block}.ts-page .cta .btn{display:inline-block;background:#fff;color:var(--purple);font-weight:800;padding:13px 30px;border-radius:4px;font-size:16px}/* ===== Footer ===== */@media (max-width:1024px){.ts-page .grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:768px){.ts-page .grid{grid-template-columns:repeat(2,1fr)}.ts-page .hero h1{font-size:30px}.ts-page .slide .wrap{width:auto;max-width:520px;text-align:center;margin:0 auto;padding:0 20px}.ts-page .hero-prod{right:auto;left:50%;transform:translate(-50%,-50%);top:62%;width:88%;aspect-ratio:1.85}.ts-page .slide{align-items:flex-start;padding-top:7%}.ts-page .filterbar{padding:6px 0}.ts-page .search-box{order:-1;flex:1 1 100%;max-width:none;margin-left:0;margin-bottom:2px}.ts-page .search-box input{padding:6px 12px;font-size:13px}.ts-page .filter-row{flex-wrap:wrap;gap:4px;margin:1px 0}.ts-page .filter-row .f-label{font-size:12px;min-width:0;flex:none}.ts-page .filter-row .chip,.ts-page .filter-row .lab{flex:none}.ts-page .chip{font-size:12px;padding:2px 8px}.ts-page .lab{font-size:10px;padding:1px 6px}.ts-page .group{scroll-margin-top:200px}}@media (max-width:480px){.ts-page .grid{grid-template-columns:1fr}.ts-page .hero-prod{width:92%;aspect-ratio:1.85;top:66%}.ts-page .slide{padding-top:9%}} .entry-title{display:none!important}#comments{display:none!important} body:has(.ts-page) .ast-container{max-width:none!important;width:100%!important;padding-left:0!important;padding-right:0!important} body:has(.ts-page) .site-content,body:has(.ts-page) .content-area,body:has(.ts-page) .site-main,body:has(.ts-page) .entry-content{width:100%!important;max-width:none!important} body:has(.ts-page){background:#fff!important} body:has(.ts-page) .ast-container,body:has(.ts-page) .site-content,body:has(.ts-page) .content-area,body:has(.ts-page) .site-main,body:has(.ts-page) article,body:has(.ts-page) .entry-content,body:has(.ts-page) .ast-container > .site-content{padding:0!important;margin:0!important} body:has(.ts-page) .entry-header,body:has(.ts-page) .ast-page-title-wrap,body:has(.ts-page) .ast-page-title{display:none!important} .ts-page .slide h1{color:#fff!important}