/* Автокамеры Titan — основные стили */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:'Roboto',Arial,Helvetica,sans-serif;font-size:15px;line-height:1.8;color:#777;background:#fff}
body:before{content:"";position:fixed;left:0;top:0;bottom:0;width:calc((100% - 1150px)/2 + 10px);background:#fff url(/assets/img/side-bg.jpg) no-repeat left center;background-size:auto 125vh;z-index:0;pointer-events:none}
a{color:#4e8fc4;text-decoration:none;transition:color .2s}
a:hover{color:#a33a43}
img{max-width:100%;height:auto;border:0}
h1,h2,h3,h4{font-family:'Roboto',Arial,sans-serif;color:#333;line-height:1.3;font-weight:700}

.wrap{position:relative;z-index:1;width:1150px;margin:0 auto;display:flex;align-items:flex-start}

/* ---------- боковая колонка ---------- */
.side{width:300px;flex:none;background:#fff;position:sticky;top:0;height:100vh;overflow-y:auto;padding:34px 30px 40px 50px;scrollbar-width:none}
.side::-webkit-scrollbar{display:none}
.logo{display:block;width:212px}
.logo img{display:block;width:100%}
.burger{display:none}
.nav{margin:90px 0 0}
.nav ul{list-style:none;margin:0;padding:0}
.nav>ul>li{position:relative}
.nav>ul>li:before,.nav>ul:after{content:"";display:block;width:30px;height:1px;background:#c2545c}
.nav>ul>li>a{display:inline-block;font-size:25px;font-weight:500;color:#6ba7d3;line-height:1.2;padding:12px 0 13px}
.nav>ul>li>a:hover,.nav>ul>li.active>a{color:#a33a43}
.nav .plus{position:absolute;right:10px;top:15px;width:20px;height:20px;border:0;background:none;cursor:pointer;padding:0}
.nav .plus:before,.nav .plus:after{content:"";position:absolute;left:3px;top:9px;width:14px;height:1px;background:#bfd3e3;transition:transform .25s}
.nav .plus:after{transform:rotate(90deg)}
.nav li.open>.plus:after{transform:rotate(0)}
.nav .sub{display:none;padding:0 0 14px 2px}
.nav li.open>.sub{display:block}
.nav .sub a{display:block;font-size:14.5px;line-height:1.5;padding:3px 0;color:#6ba7d3}
.nav .sub a:hover,.nav .sub a.cur{color:#a33a43}
.contacts{margin:48px 0 0;font-size:13px;line-height:1.6;color:#2f4777}
.contacts div{display:flex;align-items:flex-start;gap:7px;margin:0 0 8px}
.contacts svg{flex:none;margin-top:4px}
.contacts a{color:#2f4777}
.socials{display:flex;gap:5px;margin:8px 0 0}
.socials span{width:26px;height:26px;border:2px solid #6ba7d3;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#6ba7d3;font:700 11px/1 Arial,sans-serif;cursor:default}
.adwidget{margin:34px 0 0;padding:16px 0 0;border-top:1px solid #eee;font-size:12.5px;line-height:1.55;color:#999;display:flex;gap:12px;align-items:center}
.adwidget img{width:46px;flex:none;display:block}
.adwidget a{color:#4e8fc4;text-decoration:underline}

/* ---------- основная колонка ---------- */
.main{width:850px;flex:none;background:#fff;box-shadow:0 0 22px rgba(0,0,0,.09);min-height:100vh;position:relative}
.content{padding:0 50px 30px}

/* слайдер */
.slider{position:relative;height:420px;overflow:hidden;background:#333}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1s}
.slide.on{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover;display:block}
.slide .cap{position:absolute;left:28px;bottom:62px;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.55)}
.cap b{display:block;font:800 41px/1.05 'Open Sans',Arial,sans-serif;text-transform:uppercase;letter-spacing:.5px}
.cap span{display:block;font:700 19px/1.4 'Open Sans',Arial,sans-serif;margin-top:4px;letter-spacing:.3px}
.sl-ctrl{position:absolute;right:28px;top:160px;width:92px;height:92px;cursor:pointer}
.sl-ctrl svg{position:absolute;inset:0;transform:rotate(-90deg)}
.sl-ctrl circle.bg{fill:rgba(60,60,60,.45)}
.sl-ctrl circle.pr{fill:none;stroke:#4ea0e6;stroke-width:3;stroke-dasharray:283;stroke-dashoffset:283}
.sl-ctrl i{position:absolute;left:36px;top:33px;width:20px;height:26px;border-left:6px solid #fff;border-right:6px solid #fff;opacity:.75}
.sl-ctrl.paused i{border:0;width:0;height:0;border-left:20px solid #fff;border-top:13px solid transparent;border-bottom:13px solid transparent;left:40px}
.sl-dots{position:absolute;right:54px;top:262px;display:flex;flex-direction:column;gap:12px}
.sl-dots button{width:38px;height:38px;border-radius:50%;border:2px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06) center/cover;cursor:pointer;padding:0;opacity:.6}
.sl-dots button.on{opacity:1;border-color:#4ea0e6}

/* шапка внутренних страниц */
.pagehead{position:relative;height:230px;overflow:hidden;background:#333}
.pagehead img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.88)}
.pagehead .cap{position:absolute;left:28px;bottom:40px;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.55)}
.pagehead .cap b{font-size:34px}
.crumbs{font-size:12.5px;color:#aaa;padding:22px 0 0;line-height:1.6}
.crumbs a{color:#7aa9cf}
.crumbs span.sep{margin:0 6px;color:#ccc}

/* текст */
.lead{padding:68px 0 0}
.content p{margin:0 0 14px}
ul.dots{margin:0 0 16px;padding:0 0 0 20px}
ul.dots li{margin:0 0 4px}
.note{text-align:right;font-weight:700;color:#777;font-size:15px}
h1.title,h2.title{text-align:center;font-size:34px;margin:60px 0 34px;color:#333}
h1.title{margin-top:26px;font-size:32px}
.bar{background:#dcdfe2;text-align:center;font:400 22px/1.3 'Roboto',Arial,sans-serif;color:#333;padding:15px 20px;margin:46px 0 0}
.article h2,.text h2{font-size:25px;margin:38px 0 16px;color:#333;position:relative;padding-bottom:12px}
.article h2:after,.text h2:after{content:"";position:absolute;left:0;bottom:0;width:30px;height:1px;background:#c2545c}
.article h3,.text h3{font-size:18px;margin:26px 0 10px;color:#2b4372}
.article ul,.article ol,.text ul,.text ol{margin:0 0 16px;padding:0 0 0 22px}
.article li,.text li{margin:0 0 6px}
.article blockquote,.text blockquote{margin:20px 0;padding:14px 20px;border-left:3px solid #c2545c;background:#f7f7f7;color:#666;font-style:italic}
.article strong,.text strong{color:#555}
.article table,.text table{width:100%;border-collapse:collapse;margin:10px 0 22px;font-size:13.5px;line-height:1.5;background:#f6f6f6}
.article th,.text th{font-weight:500;color:#555;padding:12px 10px;text-align:left;border-bottom:1px solid #e2e2e2}
.article td,.text td{padding:10px;border-top:1px solid #e6e6e6;color:#666;vertical-align:top}
.tablewrap{overflow-x:auto}

/* прайс */
.price{background:#f6f6f6;padding:16px 15px 10px;overflow-x:auto}
.price table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.5;color:#555;text-align:center}
.price th{font-weight:400;color:#666;padding:14px 8px;border-top:1px solid #e3e3e3;line-height:2.1}
.price th b{font-weight:700;color:#555}
.price td{padding:9px 8px;border-top:1px solid #e3e3e3;height:38px}
.price tr:hover td{background:#eef2f6}
.price .cls{font-size:12px;color:#888}
.price-filter{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.price-filter button{border:1px solid #d8dde2;background:#fff;color:#666;font:13px 'Roboto',Arial,sans-serif;padding:5px 12px;border-radius:3px;cursor:pointer}
.price-filter button.on{background:#2b4372;color:#fff;border-color:#2b4372}
.price-note{font-size:13px;color:#999;margin:10px 0 0;line-height:1.6}

/* партнёры */
.partners{margin:56px 0 0;border:1px solid #e6e6e6;padding:30px 34px 22px;position:relative}
.partners h2{margin:0 0 10px;font-size:24px;color:#333}
.partners>p{font-size:14px}
.partner{display:flex;gap:28px;align-items:flex-start;padding:18px 0 4px;border-top:1px solid #eee;margin-top:12px}
.partner .plogo{flex:none;width:190px;display:block;border:1px solid #eee;padding:8px;background:#fff}
.partner .plogo img{display:block;width:100%}
.partner h3{margin:0 0 6px;font-size:18px;color:#2b4372}
.partner p{font-size:14px;line-height:1.75}
.partner a.anc{color:#a33a43;text-decoration:underline}

/* карточки */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.card{display:block;background:#fff;color:#777}
.card .im{display:block;height:190px;overflow:hidden;background:#ddd}
.card .im img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.card:hover .im img{transform:scale(1.04)}
.card h3{font-size:19px;margin:16px 0 6px;color:#2b4372}
.card:hover h3{color:#a33a43}
.card p{font-size:14px;margin:0 0 6px}
.more{font-size:13px;color:#a33a43;text-transform:uppercase;letter-spacing:.6px;font-weight:500}

.adv{display:grid;grid-template-columns:1fr 1fr 1fr;gap:34px 30px;text-align:center}
.adv .ic{width:62px;height:62px;border:2px solid #6ba7d3;border-radius:50%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;color:#6ba7d3}
.adv h3{font-size:17px;margin:0 0 6px}
.adv p{font-size:14px;line-height:1.65;margin:0}

.valves{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}
.valve{display:flex;gap:18px;align-items:flex-start;padding:20px 0;border-top:1px solid #eee}
.valve .vi{flex:none;width:64px;height:84px;background:#f6f6f6;display:flex;align-items:center;justify-content:center}
.valve h3{margin:0 0 2px;font-size:18px;color:#2b4372}
.valve small{display:block;font-size:12.5px;color:#a33a43;margin:0 0 6px;line-height:1.4}
.valve p{font-size:13.5px;line-height:1.6;margin:0}

.svc{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:#e6e6e6;border:1px solid #e6e6e6}
.svc a{background:#fff;padding:26px 22px;color:#777;display:block}
.svc a:hover{background:#f7f9fb}
.svc h3{font-size:17px;margin:0 0 8px;color:#2b4372}
.svc a:hover h3{color:#a33a43}
.svc p{font-size:13.5px;line-height:1.6;margin:0}

.steps{counter-reset:s;list-style:none;padding:0;margin:0}
.steps li{position:relative;padding:0 0 22px 74px;min-height:56px}
.steps li:before{counter-increment:s;content:counter(s);position:absolute;left:0;top:0;width:52px;height:52px;border-radius:50%;background:#2b4372;color:#fff;font:700 22px/52px 'Roboto',Arial,sans-serif;text-align:center}
.steps li:after{content:"";position:absolute;left:25px;top:56px;bottom:4px;width:1px;background:#d8dde2}
.steps li:last-child:after{display:none}
.steps b{display:block;color:#333;font-size:17px;margin:0 0 2px}

.tiers{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
.tier{border:1px solid #e3e3e3;text-align:center;padding:26px 20px}
.tier b{display:block;font-size:26px;color:#2b4372;line-height:1.2}
.tier span{display:block;color:#a33a43;font-size:13px;text-transform:uppercase;letter-spacing:.8px;margin:6px 0 10px}
.tier p{font-size:13.5px;line-height:1.6;margin:0}

.nums{display:grid;grid-template-columns:repeat(4,1fr);background:#2b4372;color:#fff;text-align:center;margin:56px -50px 0;padding:34px 20px}
.nums b{display:block;font:700 36px/1.1 'Open Sans',Arial,sans-serif}
.nums span{font-size:13px;color:#b8c7e2;text-transform:uppercase;letter-spacing:.6px}

.faq details{border-top:1px solid #e6e6e6;padding:0}
.faq details:last-child{border-bottom:1px solid #e6e6e6}
.faq summary{cursor:pointer;list-style:none;padding:16px 40px 16px 0;font-size:16.5px;color:#2b4372;position:relative;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:6px;top:10px;font-size:26px;color:#bfd3e3;font-weight:300}
.faq details[open] summary:after{content:"–"}
.faq details p{margin:0 0 18px;font-size:14.5px}

/* галерея */
.viewer{position:relative;height:440px;background:#222;overflow:hidden;cursor:grab}
.viewer img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;transform-origin:center;transition:transform .25s}
.viewer .zb{position:absolute;left:10px;width:26px;height:26px;background:none;border:0;color:#fff;font:700 26px/26px Arial,sans-serif;cursor:pointer;text-shadow:0 1px 3px rgba(0,0,0,.6);z-index:2;padding:0}
.viewer .zin{top:10px}.viewer .zout{top:40px}
.viewer .fs{position:absolute;right:12px;top:10px;width:26px;height:26px;background:none;border:0;cursor:pointer;z-index:2;padding:0}
.viewer:fullscreen{height:100vh}
.thumbs{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin:6px 0 0}
.thumbs button{padding:0;border:2px solid transparent;cursor:pointer;height:62px;background:#ddd center/cover;opacity:.7}
.thumbs button.on{border-color:#2b4372;opacity:1}

/* формы */
.form{max-width:750px;margin:0 auto}
.form input[type=text],.form input[type=email],.form input[type=tel],.form textarea{display:block;width:100%;border:1px solid #e3e3e3;background:#fbfbfb;padding:9px 15px;font:14px 'Roboto',Arial,sans-serif;color:#555;margin:0 0 10px;outline:none;border-radius:0}
.form input:focus,.form textarea:focus{border-color:#a9c4dd;background:#fff}
.form textarea{height:262px;resize:vertical}
.form ::placeholder{color:#b5b5b5}
.form .agree{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.55;color:#888;margin:4px 0 14px;cursor:pointer}
.form .agree input{margin:3px 0 0;width:16px;height:16px;flex:none;accent-color:#2b4372}
.form .agree a{color:#4e8fc4;text-decoration:underline}
.form .row{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.btn{display:inline-block;background:#2b4372;color:#fff;border:0;border-radius:4px;font:700 17px/38px 'Roboto',Arial,sans-serif;height:38px;padding:0 30px;min-width:396px;text-align:center;cursor:pointer;transition:background .2s}
.btn:hover{background:#a33a43;color:#fff}
.btn[disabled]{opacity:.6;cursor:default}
.form .hint{font-size:12px;color:#aaa;line-height:1.5;flex:1;min-width:200px}
.form .hint a{color:#4e8fc4}
.form .msg{margin:14px 0 0;font-size:14px;padding:10px 14px;display:none}
.form .msg.ok{display:block;background:#eef6ee;color:#3c763d}
.form .msg.err{display:block;background:#fbeeee;color:#a33a43}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form .agree.warn{color:#a33a43}

/* блог */
.cats{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 30px}
.cats a{border:1px solid #d8dde2;padding:5px 13px;font-size:13.5px;color:#666;border-radius:3px}
.cats a.on,.cats a:hover{background:#2b4372;color:#fff;border-color:#2b4372}
.posts{display:grid;grid-template-columns:1fr 1fr;gap:34px 30px}
.post .im{display:block;height:180px;overflow:hidden;background:#ddd}
.post .im img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.post:hover .im img{transform:scale(1.04)}
.post .cat{display:inline-block;font-size:11.5px;text-transform:uppercase;letter-spacing:.7px;color:#a33a43;margin:14px 0 2px}
.post h3{font-size:18px;margin:0 0 8px;line-height:1.35}
.post h3 a{color:#2b4372}
.post h3 a:hover{color:#a33a43}
.post p{font-size:14px;line-height:1.65;margin:0 0 8px}
.pager{display:flex;justify-content:center;gap:6px;margin:44px 0 10px;flex-wrap:wrap}
.pager a,.pager span{min-width:36px;height:36px;line-height:34px;text-align:center;border:1px solid #d8dde2;color:#666;font-size:14px;padding:0 10px}
.pager span.on{background:#2b4372;border-color:#2b4372;color:#fff}
.pager a:hover{border-color:#2b4372;color:#2b4372}
.meta{font-size:13px;color:#aaa;text-align:center;margin:-20px 0 26px}
.meta a{color:#a33a43}
.cover{margin:0 0 28px}
.cover img{display:block;width:100%;height:330px;object-fit:cover}
.toc{background:#f6f6f6;padding:20px 26px;margin:0 0 30px}
.toc b{display:block;color:#333;font-size:16px;margin:0 0 8px}
.toc ol{margin:0;padding:0 0 0 20px;font-size:14px;line-height:1.7}
.toc a{color:#4e8fc4}
.cta{background:#2b4372;color:#cfdaee;padding:28px 32px;margin:40px 0 0;display:flex;gap:24px;align-items:center;justify-content:space-between}
.cta b{display:block;color:#fff;font-size:20px;margin:0 0 4px}
.cta p{margin:0;font-size:14px;line-height:1.6}
.cta a{flex:none;background:#fff;color:#2b4372;font-weight:700;padding:10px 24px;border-radius:4px;font-size:15px}
.cta a:hover{background:#a33a43;color:#fff}
.prevnext{display:flex;justify-content:space-between;gap:20px;margin:36px 0 0;padding:20px 0 0;border-top:1px solid #eee;font-size:14px}
.prevnext a{max-width:48%;line-height:1.5}
.prevnext small{display:block;color:#aaa;font-size:12px;text-transform:uppercase;letter-spacing:.6px}
.related h2{font-size:24px;text-align:left;margin:46px 0 20px}
.posts.three{grid-template-columns:1fr 1fr 1fr;gap:22px}
.posts.three .im{height:120px}
.posts.three h3{font-size:15.5px}

.contactbox{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:0 0 30px}
.contactbox div{background:#f6f6f6;padding:22px 26px;font-size:14px;line-height:1.75}
.contactbox b{display:block;color:#333;font-size:15px;margin:0 0 4px}
.map{height:300px;background:#e9ecef;position:relative;overflow:hidden;margin:0 0 30px}
.map svg{display:block;width:100%;height:100%}

/* подвал */
.footer{border-top:1px solid #eee;margin:60px 50px 0;padding:26px 0 34px;font-size:13px;line-height:1.7;color:#999}
.footer .fl{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0 0 10px}
.footer .fl a{color:#6ba7d3}
.footer .fl a:hover{color:#a33a43}
.footer .copy{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

.up{position:fixed;right:22px;bottom:22px;width:44px;height:44px;background:rgba(170,170,170,.55);border:0;cursor:pointer;z-index:20;display:none}
.up.show{display:block}
.up:before{content:"";position:absolute;left:21px;top:13px;width:2px;height:20px;background:#fff}
.up:after{content:"";position:absolute;left:15px;top:13px;width:10px;height:10px;border-left:2px solid #fff;border-top:2px solid #fff;transform:rotate(45deg);transform-origin:0 0;left:22px;top:12px}

.cookie{position:fixed;left:20px;bottom:20px;max-width:460px;background:#fff;border-top:3px solid #2b4372;box-shadow:0 4px 24px rgba(0,0,0,.18);padding:18px 22px;font-size:13px;line-height:1.6;color:#666;z-index:30;display:none}
.cookie.show{display:block}
.cookie b{display:block;color:#333;font-size:15px;margin:0 0 4px}
.cookie .cb{display:flex;gap:10px;margin:12px 0 0;align-items:center}
.cookie button{background:#2b4372;color:#fff;border:0;border-radius:4px;font:700 14px 'Roboto',Arial,sans-serif;padding:8px 22px;cursor:pointer}
.cookie button:hover{background:#a33a43}

.e404{text-align:center;padding:40px 0 20px}
.e404 b{display:block;font:800 120px/1 'Open Sans',Arial,sans-serif;color:#2b4372}
.e404 p{max-width:520px;margin:10px auto 18px}

/* ---------- адаптив ---------- */
@media (max-width:1180px){
  body:before{display:none}
  .wrap{width:100%;display:block}
  .side{position:sticky;top:0;z-index:40;width:100%;height:auto;overflow:visible;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:0 2px 10px rgba(0,0,0,.08)}
  .logo{width:150px}
  .burger{display:block;width:40px;height:34px;border:0;background:none;cursor:pointer;position:relative}
  .burger i,.burger:before,.burger:after{content:"";position:absolute;left:8px;right:8px;height:2px;background:#2b4372}
  .burger i{top:16px}.burger:before{top:8px}.burger:after{top:24px}
  .nav,.contacts,.adwidget{display:none;width:100%}
  .side.open .nav,.side.open .contacts,.side.open .adwidget{display:block}
  .side.open{max-height:100vh;overflow-y:auto}
  .nav{margin:16px 0 0}
  .nav>ul>li>a{font-size:20px}
  .contacts{margin:20px 0 0}
  .adwidget{display:none}
  .side.open .adwidget{display:flex}
  .main{width:100%;box-shadow:none}
}
@media (max-width:760px){
  body{font-size:14.5px}
  .content{padding:0 16px 20px}
  .slider{height:300px}
  .cap b{font-size:26px}.cap span{font-size:14px}
  .slide .cap{left:16px;bottom:30px}
  .sl-ctrl{transform:scale(.6);right:6px;top:10px}
  .sl-dots{display:none}
  .pagehead{height:160px}.pagehead .cap{left:16px;bottom:22px}.pagehead .cap b{font-size:22px}
  h1.title,h2.title{font-size:25px;margin:40px 0 22px}
  .cards,.posts,.valves,.contactbox{grid-template-columns:1fr}
  .adv,.svc,.tiers{grid-template-columns:1fr}
  .posts.three{grid-template-columns:1fr}
  .nums{grid-template-columns:1fr 1fr;margin:40px -16px 0;gap:20px}
  .partner{flex-direction:column;gap:12px}
  .partners{padding:22px 18px 14px}
  .btn{min-width:0;width:100%}
  .footer{margin:40px 16px 0}
  .cta{flex-direction:column;align-items:flex-start}
  .thumbs{grid-template-columns:repeat(4,1fr)}
  .viewer{height:260px}
  .cover img{height:200px}
  .lead{padding-top:36px}
  .cookie{left:10px;right:10px;bottom:10px;max-width:none}
}
.inds{text-align:left}
.inds>div{border-top:2px solid #2b4372;padding-top:14px}
.inds h3{color:#2b4372}
ul.geo{columns:4;list-style:none;padding:0;margin:0 0 16px;font-size:14px}
ul.geo li{padding:3px 0 3px 16px;position:relative}
ul.geo li:before{content:"";position:absolute;left:0;top:13px;width:8px;height:1px;background:#c2545c}
@media (max-width:760px){ul.geo{columns:2}}