/* ДискСервис — основной стиль */
html{-webkit-text-size-adjust:100%}
*{box-sizing:border-box}
body{margin:0;font-family:'Comfortaa',Verdana,Arial,sans-serif;font-size:13px;line-height:1.65;color:#4d4d4d;
 background-color:#111;
 background-image:conic-gradient(#e9a33c 0 25%,#111 0 50%,#e9a33c 0 75%,#111 0);
 background-size:120px 120px;background-attachment:fixed}
a{color:#d9861c;text-decoration:none}
a:hover{color:#b8650a;text-decoration:underline}
img{max-width:100%;height:auto;border:0}

#wrap{width:960px;margin:0 auto;background:#fdf8ee;box-shadow:0 0 18px rgba(0,0,0,.55)}
#header{display:block;line-height:0;background:#2d2f32}
#header img{display:block;width:100%}

/* верхнее меню */
#topnav{background:linear-gradient(#f2b24d,#e39a2c);padding:9px 14px;border-top:1px solid #ffd58e;border-bottom:1px solid #b9771a}
#topnav ul{list-style:none;margin:0;padding:0;display:flex;justify-content:space-between;gap:12px}
#topnav li{flex:1}
#topnav a{display:block;text-align:center;color:#fff;font-size:12px;font-weight:bold;letter-spacing:.5px;text-transform:uppercase;
 padding:8px 4px;border:1px solid #fff4dc;border-radius:3px;background:rgba(255,255,255,.06);text-shadow:0 1px 1px rgba(0,0,0,.25)}
#topnav a:hover,#topnav a.on{background:#fff;color:#d9861c;text-decoration:none;text-shadow:none}
#burger{display:none}

/* колонки */
#cols{display:flex;align-items:flex-start;
 background-color:#fdf8ee;
 background-image:conic-gradient(rgba(0,0,0,.035) 0 25%,transparent 0 50%,rgba(0,0,0,.035) 0 75%,transparent 0);
 background-size:90px 90px}
#side{width:200px;flex:none;padding:16px 8px 30px 14px;font-size:11px}
#main{flex:1;min-width:0;padding:14px 26px 40px 18px}

.side-h{color:#999;font-size:10px;text-transform:lowercase;margin:0 0 6px;letter-spacing:.3px}
#menu{list-style:none;margin:0 0 22px;padding:0}
#menu li{position:relative;padding:2px 0 2px 11px;border-bottom:1px dotted #e6d6b8}
#menu li:before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;background:#e9a33c;border-radius:50%}
#menu a{color:#d9861c;text-transform:uppercase;font-size:10.5px;line-height:1.35;display:inline-block;padding:2px 0}
#menu a.on{color:#333;font-weight:bold}
#menu ul{list-style:none;margin:2px 0 4px;padding:0 0 0 6px}
#menu ul li{border:0}
#menu ul li:before{background:#c5c5c5}
#menu ul a{text-transform:none;font-size:11px}
#menu .group>a{color:#333;font-weight:bold}

.promo{text-align:center;margin:0 0 24px}
.promo img{display:block;margin:0 auto 8px;width:170px}
.promo p{margin:0 0 8px;font-size:10.5px;color:#666;line-height:1.5}
.btn-red{display:inline-block;background:#d63a1a;color:#fff!important;border-radius:12px;padding:4px 14px;font-size:10.5px;font-weight:bold;text-transform:uppercase}
.btn-red:hover{background:#b02a0d;text-decoration:none}
.socials{text-align:center}
.socials .side-h{text-align:center}
.soc{display:block;width:56px;height:56px;margin:8px auto;border-radius:10px;color:#fff;font:bold 18px/56px Arial,sans-serif;box-shadow:0 2px 4px rgba(0,0,0,.3);cursor:default}
.soc.vk{background:linear-gradient(#5d84b5,#3f6593)}
.soc.tg{background:linear-gradient(#5fb7ea,#2c95cf)}
.soc.ok{background:linear-gradient(#f8a54b,#e88413)}
.side-box{background:#fff;border:1px solid #ecd9b4;border-radius:6px;padding:10px;margin:0 0 20px;font-size:11px;line-height:1.5}
.side-box b{color:#d9861c}

/* типографика контента */
h1,.h1{color:#d9861c;font-size:15px;font-weight:bold;margin:0 0 12px;padding:0 0 6px;border-bottom:1px solid #f0d9ae}
h2{color:#d9861c;font-size:14px;font-weight:bold;margin:26px 0 10px}
h3{color:#8a5a1a;font-size:13px;font-weight:bold;margin:18px 0 8px}
.content p{margin:0 0 11px}
.content ul,.content ol{margin:0 0 12px;padding-left:22px}
.content li{margin:0 0 5px}
.content table{width:100%;border-collapse:collapse;margin:8px 0 16px;background:#fff;font-size:12px}
.content th{background:#e9a33c;color:#fff;font-weight:bold;text-align:left;padding:6px 8px;border:1px solid #d18f2a}
.content td{padding:6px 8px;border:1px solid #ead7b2;vertical-align:top}
.content tr:nth-child(even) td{background:#fff9ee}
.content blockquote{margin:12px 0;padding:10px 14px;border-left:4px solid #e9a33c;background:#fff;font-style:italic}
.note{background:#fff3dc;border:1px solid #f0cf90;border-radius:6px;padding:10px 14px;margin:12px 0 16px}
.tblwrap{overflow-x:auto}

.crumbs{font-size:10.5px;color:#999;margin:0 0 10px}
.crumbs a{color:#b48a4c}
.lead{font-size:13.5px;color:#555;background:#fff;border:1px solid #f0dfbd;border-radius:6px;padding:12px 14px;margin:0 0 16px}
.center{text-align:center}
.muted{color:#999;font-size:11px}

/* главная */
.notice{background:#fbe3d6;border:1px solid #efb79c;color:#7b3f22;border-radius:4px;padding:10px 14px;margin:0 0 16px;font-size:12px}
.sub-h{text-align:center;color:#888;font-size:13px;margin:20px 0 10px}
.quick{display:grid;grid-template-columns:1fr 1fr;gap:4px 30px;max-width:520px;margin:10px auto 14px;text-align:center;font-size:12px;font-weight:bold}
.quick a{color:#333}
.quick a:hover{color:#d9861c}

.circles{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px;max-width:520px;margin:20px auto 10px}
.circles.three{grid-template-columns:repeat(3,1fr);max-width:none}
.circ{text-align:center;color:#d9861c;font-size:12px;line-height:1.35}
.circ .t{display:block;min-height:34px;margin-bottom:6px}
.circ img{width:165px;height:165px;border-radius:50%;box-shadow:0 3px 8px rgba(0,0,0,.35);border:3px solid #fff;transition:transform .2s}
.circ:hover img{transform:scale(1.04)}
.circ:hover{text-decoration:none;color:#b8650a}
.circ small{display:block;color:#777;font-size:11px;margin-top:6px}

.section{margin:30px 0}
.sec-title{color:#d9861c;font-size:14px;text-align:center;margin:0 0 14px}
.reasons{counter-reset:r;list-style:none;padding:0;margin:0}
.reasons li{counter-increment:r;position:relative;padding:10px 12px 10px 56px;background:#fff;border:1px solid #f0dfbd;border-radius:6px;margin:0 0 10px}
.reasons li:before{content:counter(r);position:absolute;left:12px;top:10px;width:32px;height:32px;border-radius:50%;background:#e9a33c;color:#fff;font-weight:bold;font-size:15px;text-align:center;line-height:32px}
.reasons b{color:#8a5a1a;display:block}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.step{background:#fff;border:1px solid #f0dfbd;border-radius:6px;padding:12px;font-size:12px}
.step b{display:block;color:#d9861c;margin-bottom:4px}
.step i{font-style:normal;display:inline-block;background:#2b2b2b;color:#fff;border-radius:3px;padding:0 6px;margin-bottom:6px;font-size:10px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.card{background:#fff;border:1px solid #f0dfbd;border-radius:6px;overflow:hidden;font-size:12px;display:flex;flex-direction:column}
.card img{display:block;width:100%;aspect-ratio:760/300;object-fit:cover}
.card .in{padding:10px 12px 12px;flex:1}
.card .cat{font-size:10px;color:#999;text-transform:uppercase}
.card a.tt{display:block;font-weight:bold;color:#8a5a1a;margin:3px 0 6px;font-size:12.5px;line-height:1.4}
.card p{margin:0;color:#666}
.addr{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.addr div{background:#fff;border:1px solid #f0dfbd;border-radius:6px;padding:12px;font-size:12px}
.addr b{color:#d9861c;display:block;margin-bottom:4px}
.band{background:#2d2f32;color:#eee;border-radius:6px;padding:16px 18px;margin:24px 0;display:flex;gap:16px;align-items:center}
.band img{width:150px;flex:none}
.band b{color:#f2b24d;font-size:14px}
.band a{color:#f2b24d}
.faq details{background:#fff;border:1px solid #f0dfbd;border-radius:6px;margin:0 0 8px;padding:0 12px}
.faq summary{cursor:pointer;padding:9px 0;font-weight:bold;color:#8a5a1a;font-size:12.5px}
.faq details p{margin:0 0 10px}

/* формы */
.form-box{background:#fff;border:2px solid #e9a33c;border-radius:8px;padding:16px 18px;margin:26px 0}
.form-box .ft{color:#d9861c;font-weight:bold;font-size:14px;margin:0 0 4px}
.form-box .fs{color:#888;font-size:11.5px;margin:0 0 12px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-box label.f{display:block;font-size:11px;color:#777;margin:0 0 8px}
.form-box input[type=text],.form-box input[type=email],.form-box select,.form-box textarea{width:100%;font:inherit;font-size:12.5px;padding:7px 9px;border:1px solid #d9c49d;border-radius:4px;background:#fffdf8;margin-top:3px;color:#333}
.form-box textarea{min-height:80px;resize:vertical}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:11px;color:#666;margin:6px 0 12px;line-height:1.45}
.agree input{margin:2px 0 0;flex:none;width:15px;height:15px}
.btn{display:inline-block;background:linear-gradient(#f2b24d,#df9325);color:#fff;border:1px solid #c47f1d;border-radius:4px;padding:8px 22px;font:bold 12px 'Comfortaa',Verdana,sans-serif;text-transform:uppercase;cursor:pointer}
.btn:hover{background:#d9861c;text-decoration:none;color:#fff}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.form-msg{display:none;margin-top:10px;padding:8px 12px;border-radius:4px;font-size:12px}
.form-msg.ok{display:block;background:#e5f4df;border:1px solid #a9d39a;color:#2f5f22}
.form-msg.err{display:block;background:#fbe3d6;border:1px solid #efb79c;color:#7b3f22}

/* статья */
.cover{display:block;width:100%;border-radius:6px;margin:0 0 14px;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.svc-img{float:right;width:170px;height:170px;border-radius:50%;margin:0 0 12px 18px;border:3px solid #fff;box-shadow:0 3px 8px rgba(0,0,0,.3)}
.cats{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px}
.cats a{background:#fff;border:1px solid #e9c78b;border-radius:12px;padding:3px 10px;font-size:11px}
.cats a.on{background:#e9a33c;color:#fff;border-color:#e9a33c}
.pager{text-align:center;margin:20px 0}
.pager a,.pager span{display:inline-block;min-width:26px;padding:3px 7px;margin:2px;border:1px solid #e9c78b;border-radius:3px;background:#fff;font-size:11px}
.pager span{background:#e9a33c;color:#fff;border-color:#e9a33c}
.svc-list{list-style:none;padding:0;margin:0}
.svc-list li{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid #f0dfbd;border-radius:6px;padding:10px;margin:0 0 10px}
.svc-list img{width:90px;height:90px;border-radius:50%;flex:none}
.svc-list b a{font-size:13px}
.svc-list p{margin:4px 0 0;font-size:12px}

/* подвал */
#footer{background:#2d2f32;color:#bbb;font-size:11px;padding:18px 24px;border-top:4px solid #e9a33c;line-height:1.7}
#footer a{color:#f2b24d}
.fcols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:20px;margin-bottom:12px}
.fcols b{color:#fff;display:block;margin-bottom:4px}
.fcols ul{list-style:none;margin:0;padding:0}
.copy{border-top:1px solid #45484c;padding-top:10px;color:#999}

/* cookie */
#cookie{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(32,33,35,.97);color:#ddd;border-top:3px solid #e9a33c;padding:12px 16px;font-size:12px;display:none}
#cookie .in{max-width:960px;margin:0 auto;display:flex;gap:14px;align-items:center}
#cookie a{color:#f2b24d}
#cookie .btn{flex:none}

.p404{text-align:center;padding:30px 0}
.p404 .big{font-size:80px;color:#e9a33c;font-weight:bold;line-height:1}

@media (max-width:980px){
 #wrap{width:100%}
}
@media (max-width:760px){
 body{font-size:14px;background-size:80px 80px}
 #topnav ul{flex-direction:column;gap:6px;display:none}
 #topnav.open ul{display:flex}
 #burger{display:block;width:100%;background:none;border:1px solid #fff4dc;border-radius:3px;color:#fff;font:bold 13px 'Comfortaa',sans-serif;padding:8px;text-transform:uppercase;cursor:pointer}
 #cols{flex-direction:column}
 #side{width:100%;order:2;padding:16px;border-top:2px solid #e9a33c}
 #main{padding:14px 16px 30px}
 .circles{gap:20px 12px}
 .circ img{width:130px;height:130px}
 .circles.three{grid-template-columns:1fr 1fr}
 .steps,.addr,.cards,.fcols,.frow{grid-template-columns:1fr}
 .band{flex-direction:column;text-align:center}
 .svc-img{float:none;display:block;margin:0 auto 12px}
 #cookie .in{flex-direction:column;align-items:stretch;text-align:center}
}
