* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: #17221d; background: #f6f3e8; font-family: "Microsoft YaHei", "Segoe UI", sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.aqivo { background: #f6f3e8; border-bottom: 1px solid #17221d; }
.bexar, .opira, .xenil, .pirel { width: 1200px; max-width: calc(100% - 48px); margin: auto; }
.bexar { height: 74px; display: flex; align-items: center; gap: 25px; }
.cuvem { display: inline-flex; align-items: center; gap: 10px; font-size: 19px; font-weight: 900; }.cuvem img { width: 38px; height: 38px; border-radius: 5px; }
.dorin { display: flex; gap: 19px; margin-left: auto; font-size: 13px; }.dorin a:hover { color: #e94f70; }
.mepul { display: inline-flex; align-items: center; gap: 7px; padding: 10px 15px; background: #153d2d; color: #fff; font-size: 13px; font-weight: 800; }
.nufix { border-bottom: 1px solid #17221d; }.opira { min-height: 660px; display: grid; grid-template-columns: 55% 45%; }
.pavon { padding: 90px 55px 75px 0; align-self: center; }.qetel { display: inline-block; margin-bottom: 25px; padding: 5px 10px; background: #baf443; font-size: 11px; font-weight: 900; letter-spacing: 1px; }
h1 { margin: 0; max-width: 680px; font-size: 62px; line-height: 1.08; letter-spacing: 0; }.pavon > p { max-width: 580px; margin: 26px 0 33px; color: #58635d; font-size: 17px; }
.rufex { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; }.rufex > a { display: inline-flex; align-items: center; gap: 20px; padding: 15px 19px; background: #e94f70; color: #fff; font-weight: 900; }.rufex > span { padding: 4px 8px; border: 1px solid #879088; font-size: 10px; }
.sovin { position: relative; overflow: hidden; display: grid; place-items: end center; background: #63dfce; border-left: 1px solid #17221d; }.uvela { width: 68%; height: 560px; overflow: hidden; border: 7px solid #17221d; border-bottom: 0; border-radius: 30px 30px 0 0; }.uvela img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.tager { position: absolute; top: 40px; left: 17px; z-index: 2; font-size: 24px; line-height: .92; font-weight: 1000; }.vexor { position: absolute; right: 15px; bottom: 55px; z-index: 2; padding: 11px 13px; background: #baf443; border: 1px solid #17221d; font-size: 12px; font-weight: 800; transform: rotate(-2deg); }
.woran { border-bottom: 1px solid #17221d; }.xenil { padding: 88px 0; }.yotem { margin-bottom: 40px; text-align: center; font-size: 34px; font-weight: 1000; }.yotem:before { content: "// "; color: #e94f70; }.yotem:after { content: " //"; color: #153d2d; }
.zafir { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }.zafir figure { position: relative; margin: 0; overflow: hidden; border: 1px solid #17221d; background: #fff; }.zafir span { position: absolute; z-index: 1; top: 9px; left: 9px; padding: 4px 7px; background: #f6f3e8; border: 1px solid #17221d; font-size: 9px; font-weight: 900; }.zafir img { width: 100%; height: auto; }
.abixo { background: #153d2d; color: #fff; }.abixo .yotem:after { color: #baf443; }.buvor { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #5d766a; border: 1px solid #5d766a; }.buvor article { position: relative; min-height: 195px; padding: 27px; background: #153d2d; }.buvor b { position: absolute; top: 16px; right: 18px; color: #72877d; font-size: 10px; }.buvor i { color: #63dfce; font-size: 29px; }
.cirex { margin: 13px 0 6px; font-size: 17px; font-weight: 900; }.buvor p, .dupel p, .girel p, .jupin p { margin: 0; color: #acc0b6; font-size: 13px; }
.dupel { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }.dupel article { min-height: 135px; display: grid; grid-template-columns: 46px 1fr 26px; gap: 12px; align-items: center; padding: 21px; background: #fff; border: 1px solid #17221d; }.evano { width: 44px; height: 44px; display: grid; place-items: center; background: #63dfce; border-radius: 50%; font-size: 23px; }.dupel .cirex { margin: 0; }.dupel p { color: #727b76; }.dupel article > a { font-size: 19px; color: #e94f70; }
.favix { background: #e94f70; }.girel { max-width: 900px; margin: auto; position: relative; }.girel:before { content: ""; position: absolute; top: 0; bottom: 0; left: 55px; border-left: 2px dashed #17221d; }.girel article { position: relative; min-height: 125px; display: grid; grid-template-columns: 110px 1fr; gap: 22px; }.girel b { z-index: 1; width: 70px; height: 70px; display: grid; place-items: center; background: #f6f3e8; border: 2px solid #17221d; border-radius: 50%; font-size: 18px; }.girel article > div { padding-top: 5px; }.girel i { float: left; margin-right: 12px; font-size: 28px; }.girel .cirex { margin: 0; }.girel p { color: #4d242f; }
.huxor { max-width: 900px; margin: auto; border-top: 1px solid #17221d; }.huxor article { border-bottom: 1px solid #17221d; }.huxor button { width: 100%; padding: 19px 4px; display: flex; justify-content: space-between; border: 0; background: transparent; font: inherit; text-align: left; cursor: pointer; }.huxor button span { display: flex; gap: 20px; font-weight: 800; }.huxor button b { color: #e94f70; }.huxor button i { font-size: 20px; transition: transform .2s; }.huxor p { max-height: 0; overflow: hidden; margin: 0; padding-left: 38px; color: #657069; font-size: 13px; transition: max-height .25s, padding .25s; }.huxor .qovin p { max-height: 100px; padding: 0 35px 19px 38px; }.huxor .qovin button i { transform: rotate(45deg); }
.ivelo { background: #63dfce; }.jupin { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.jupin article { min-height: 190px; padding: 24px; background: #f6f3e8; border: 1px solid #17221d; }.kanor { display: flex; justify-content: space-between; font-size: 10px; }.kanor span { color: #e94f70; font-weight: 900; }.jupin p { color: #66716b; }.jupin a { display: inline-flex; gap: 7px; margin-top: 15px; color: #153d2d; font-size: 12px; font-weight: 900; }
.luver { columns: 3; column-gap: 15px; }.luver article { break-inside: avoid; margin-bottom: 15px; padding: 23px; border: 1px solid #17221d; background: #fff; }.luver article:nth-child(2n) { background: #edffd0; }.minoa { display: flex; justify-content: space-between; color: #e94f70; }.minoa > i { font-size: 24px; }.minoa span { color: #153d2d; font-size: 10px; }.luver article > p { font-size: 14px; }.naxir { padding-top: 14px; display: flex; justify-content: space-between; border-top: 1px solid #b8bdb9; font-size: 10px; }.naxir time { color: #7b837e; }
.oveta { background: #153d2d; color: #fff; }.pirel { min-height: 125px; display: flex; align-items: center; gap: 24px; }.pirel nav { margin-left: auto; display: flex; flex-wrap: wrap; gap: 15px; color: #b7c9c0; font-size: 12px; }.oveta > p { margin: 0; padding: 18px; border-top: 1px solid #526b5f; color: #8fa399; text-align: center; font-size: 11px; }
@media (max-width: 767px) {
    .bexar, .opira, .xenil, .pirel { max-width: calc(100% - 30px); }.bexar { height: 66px; }.dorin { display: none; }.mepul { margin-left: auto; padding: 8px 10px; }
    .opira { display: flex; flex-direction: column; }.pavon { padding: 62px 0 45px; }h1 { font-size: 40px; }.pavon > p { font-size: 15px; }.rufex > a { width: 100%; justify-content: space-between; }.rufex > span { flex: 1; text-align: center; }.sovin { min-height: 480px; border: 1px solid #17221d; border-bottom: 0; }.uvela { width: 72%; height: 440px; }.tager { top: 25px; font-size: 19px; }.vexor { right: 3px; bottom: 34px; }
    .xenil { padding: 63px 0; }.yotem { margin-bottom: 30px; font-size: 28px; }.zafir { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }.zafir figure { min-width: 72%; scroll-snap-align: start; }
    .buvor, .dupel, .jupin { grid-template-columns: 1fr; }.buvor article { min-height: 165px; }.dupel article { min-height: 120px; }.girel:before { left: 26px; }.girel article { grid-template-columns: 60px 1fr; gap: 12px; }.girel b { width: 54px; height: 54px; }.girel i { font-size: 23px; }.huxor button span { gap: 10px; }
    .luver { columns: 1; }.pirel { min-height: 180px; flex-wrap: wrap; align-content: center; }.pirel nav { order: 3; width: 100%; margin: 0; gap: 10px 14px; }
}