/* Размеры, отступы и цвета сняты со скриншота оригинала (раскладка ~1228 px). Основные цвета - в :root */
:root{--ink:#29373d;--navy:#14112c;--card:#1d1a37;--acc:#3949a0;--sky:#34bcf2;--os:"Open Sans","Noto Sans","Segoe UI",Arial,sans-serif;--ro:Roboto,"Open Sans","Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font:400 17px/28px var(--os);color:#000;background:#fff;-webkit-text-size-adjust:100%}
a{color:var(--acc)}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--sky);outline-offset:3px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:50;background:#fff;padding:8px 12px}
/* шапка */
.hdr{position:relative;z-index:10;height:200px;background:#fff}
.hdr .in{display:flex;align-items:center;height:200px;width:886px;margin-left:calc(50% - 437px)}
.logo{display:flex;align-items:center;gap:35px;color:#000;text-decoration:none}
.logo img{width:110px;height:110px}
.logo span{font:700 36px/1.2 var(--os);text-shadow:3px 3px 4px rgba(0,0,0,.4)}
.burger{position:relative;flex:none;width:32px;height:24px;margin-left:auto;padding:0;border:0;background:none;cursor:pointer}
.burger i,.burger i::before,.burger i::after{position:absolute;left:0;width:32px;height:1px;background:#000;content:"";transition:.2s}
.burger i{top:12px}.burger i::before{top:-11px}.burger i::after{top:11px}
.open .burger i{background:transparent}
.open .burger i::before{top:0;transform:rotate(45deg)}
.open .burger i::after{top:0;transform:rotate(-45deg)}
.menu{display:none;position:absolute;left:0;right:0;top:200px;background:var(--navy)}
.open .menu{display:block}
.menu ul{width:886px;margin:0 0 0 calc(50% - 437px);padding:10px 0 18px;list-style:none}
.menu a{display:block;padding:11px 0;font-weight:600;letter-spacing:1px;color:#fff;text-decoration:none}
.menu a:hover{color:var(--sky)}
.hero{height:450px;background:#6f93b8 url(../assets/hero.jpg) center/cover no-repeat}
/* заголовки */
h2{margin:0;padding:0 20px;font:700 35px/42px var(--os);text-align:center;text-transform:uppercase;color:var(--ink)}
/* о нас */
.about{padding:122px 0 137px;background:var(--navy)}
.w{max-width:1240px;margin:0 auto;padding:0 50px}
.about h6{margin:0 0 29px;font:400 18px/28px var(--os);letter-spacing:1.5px;text-align:center;text-transform:uppercase;color:var(--sky)}
.about h2{margin:0 0 39px;padding:0;font-size:42px;line-height:50.4px;color:#fff}
.bar{display:block;width:87px;height:12px;margin:0 0 23px;background:var(--acc)}
.about p{margin:0 0 19px;font:400 17px/28px var(--ro);color:#b9b8c0}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:37px}
.card{display:flex;align-items:center;padding:34px 25px;border-left:3px solid var(--acc);background:var(--card);font:600 18px/28px var(--os);color:#bcbbc3}
/* колонка текста */
.col{width:876px;max-width:calc(100% - 40px);margin-left:calc(50% - 432px)}
.sv{padding:42px 0 156px}
.sv h2{margin-bottom:65px;color:#000;text-shadow:3px 3px 4px rgba(0,0,0,.4)}
.lead{margin:0 0 41px;font-size:20px;line-height:32px;color:var(--ink)}
.lst{margin:0;padding-left:50px;font-size:20px;line-height:34px}
.st{padding:45px 0 52px;border-top:1px solid #808080}
.st h2{margin-bottom:27px}
.st p{margin:0 0 28px}
.st .b{font-weight:700}
.st .m46{margin-bottom:46px}
.st .m0{margin-bottom:0}
.st .last{margin:0}
.st ul{margin:0 0 46px;padding-left:50px}
/* контакты */
.ct{padding:53px 0 54px;border-top:1px solid #ddd}
.ct h2{margin-bottom:96px}
.row{display:flex;width:900px;max-width:calc(100% - 40px);margin:0 auto 100px}
.cell{flex:1;text-align:center;color:var(--acc)}
.cell+.cell{border-left:1px solid var(--acc)}
.ic{display:flex;align-items:center;justify-content:center;height:64px;margin-bottom:29px}
.lb{margin-bottom:5px;font-size:17px;color:#000}
.cell a{font-size:17px;font-weight:700;text-decoration:none}
.hearts{display:flex;align-items:center;height:16px;margin-bottom:30px;color:var(--acc)}
.hearts svg{margin-right:4.5px}
.ct .col p{margin:0 0 17px;color:var(--ink)}
.ft{padding:60px 20px 51px;font-size:16px;border-top:1px solid #ddd;text-align:center}
/* планшет и телефон (оригинальные точки перелома неизвестны - подобраны) */
@media (max-width:940px){
.hdr .in{width:auto;margin:0 24px}.menu ul{width:auto;margin:0 24px}
.col{width:auto;margin:0 24px}
.w{padding:0 24px}
.cards{grid-template-columns:1fr;gap:20px}
.lst,.st ul{padding-left:30px}
}
@media (max-width:575px){
.hdr,.hdr .in{height:96px}.menu{top:96px}
.logo{gap:14px}.logo img{width:64px;height:64px}.logo span{font-size:19px;line-height:1.15}
.hero{height:200px}
h2,.about h2{font-size:26px;line-height:32px}
.about{padding:56px 0 60px}.about h6{margin-bottom:16px}.about h2{margin-bottom:28px}
.lead,.lst{font-size:17px;line-height:28px}
.sv{padding:36px 0 64px}.sv h2{margin-bottom:32px}.lead{margin-bottom:24px}
.st{padding:36px 0 40px}.st h2{margin-bottom:20px}
.ct{padding:36px 0 40px}.ct h2{margin-bottom:40px}
.row{flex-direction:column;margin-bottom:48px}
.cell+.cell{margin-top:28px;padding-top:28px;border-left:0;border-top:1px solid var(--acc)}
}
