/* Fonts */
@font-face {
    font-family: 'Nimbus Sans Nova';
    src: url('../fonts/NimbusSanNov-Reg.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Nimbus Sans Nova';
    src: url('../fonts/NimbusSanNov-RegIta.woff') format('woff');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Nimbus Sans Nova';
    src: url('../fonts/NimbusSanNov-Bol.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

/* Base */
body {
    padding: 54px 0 0;
    color: #000;
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Override */
.b-nav {
    background: #000 !important;
}

#top100counter {
    position: absolute;
    top: 0;
    left: 0;
}

/* Root */
.b-longread-root {
    font-weight: 400;
    font-size: 10px;
    line-height: 1;
    color: #5f5f5f;
    background: #fff;
}

@media (max-width: 480px) {
    .b-longread-root {
        font-size: 8px;
    }
}

@media (max-width: 375px) {
    .b-longread-root {
        font-size: 6px;
    }
}

.b-longread-root *,
.b-longread-root *:before,
.b-longread-root *:after {
    max-width: none;
    margin: 0;
    padding: 0;
    font: inherit;
    box-sizing: border-box;
}

/* Intro */
.b-longread-intro {
    color: #fff;
    background: #2dccd3 url('../img/intro-bg.png') no-repeat 80% 50%;
    padding: 8em 0 10em;
}

.b-longread-intro__content {
    max-width: 62.5%;
    margin: 0 auto;
    padding: 0 4.5em;
}

.b-longread-intro__logo {
    display: block;
    max-width: 100%;
    width: 42em;
    height: auto;
    margin: 0 0 6em;
}

.b-longread-intro__title {
    margin: 0 0 calc(30 / 60 * 1em);
    font: normal 700 6em/1 'Nimbus Sans Nova', sans-serif;
}

.b-longread-intro__txt {
    max-width: 50%;
    font: normal 400 2.7em/1.22 'Nimbus Sans Nova', sans-serif;
}

.b-longread-intro__txt a {
    text-decoration: underline;
}

.b-longread-intro__txt a:hover {
    text-decoration: none;
}

.b-longread-intro__txt p + p {
    margin-top: calc(20 / 27 * 1em);
}

@media (max-width: 1800px) {
    .b-longread-intro {
        background-size: 35% auto;
    }

    .b-longread-intro {
        font-size: 0.5vw;
    }
}

@media (max-width: 640px) {
    .b-longread-intro {
        font-size: inherit;
        background-image: none;
    }

    .b-longread-intro__content {
        max-width: none;
    }

    .b-longread-intro__logo {
        margin-bottom: 6em;
    }

    .b-longread-intro__title {
        font-size: 4.2em;
    }

    .b-longread-intro__txt {
        max-width: none;
    }
}

/* Navbar */
.b-longread-navbar {
    color: #fff;
    background: #5f646a;
}

.b-longread-navbar__items {
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
}

.b-longread-navbar__toggle {
    display: none;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 70px;
    font: normal 400 24px/1 'Nimbus Sans Nova', sans-serif;
    color: #fff;
    background: #455052;
    border-width: 1px 0 1px 0;
    border-style: solid;
    border-color: #283638;
    transition: all 0.3s;
}

.b-longread-navbar__toggle:hover {
    background: #2897a0;
}

.b-longread-navbar__toggle--active {
    background: #2dccd3;
}

.b-longread-navbar__item {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 63px;
    font: normal 400 18px/1 'Nimbus Sans Nova', sans-serif;
    color: #fff;
    background: #455052;
    border-width: 0 1px 0 1px;
    border-style: solid;
    border-color: #283638;
    transition: all 0.3s;
}

.b-longread-navbar__item + .b-longread-navbar__item {
    border-width: 0 1px 0 0;
}

.b-longread-navbar__item:hover {
    background: #2897a0;
}

.b-longread-navbar__item--active {
    background: #2dccd3;
}

@media (max-width: 992px) {
    .b-longread-navbar__toggle {
        display: flex;
    }

    .b-longread-navbar__items {
        flex-direction: column;
    }

    .b-longread-navbar__item {
        flex: 0 0 auto;
        min-width: 100%;
        max-width: 100%;
        border-width: 0 0 1px 0;
    }

    .b-longread-navbar__item + .b-longread-navbar__item {
        border-width: 0 0 1px 0;
    }
}

/* City */
.b-longread-city__body {
    margin: 8em 0 5em;
    padding: 27em 0 0;
    background-repeat: no-repeat;
    background-position: 50% 0;
}

.b-longread-city#spb .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/spb-bg.png');
}

.b-longread-city#kzn .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/kzn-bg.png');
}

.b-longread-city#ekb .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/ekb-bg.png');
}

.b-longread-city#sochi .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/sochi-bg.png');
}

.b-longread-city#nn .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/nn-bg.png');
}

.b-longread-city#smr .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/smr-bg.png');
}

.b-longread-city#nsk .b-longread-city__body {
    background-image: url('https://static.sobaka.ru/uploads/longread/83404/nsk-bg.png');
}

.b-longread-city__service-items {
    display: flex;
    justify-content: center;
    margin: -3em 0 0;
}

.b-longread-city__service-item {
    flex: 0 0 auto;
    width: 225px;
    margin: 3em 0 0;
}

.b-longread-city__service-img {
    display: block;
    max-width: 100%;
    width: 12em;
    height: auto;
    margin: 0 auto 1.5em;
}

.b-longread-city__service-txt {
    max-width: 200px;
    margin: 0 auto;
    font: normal 400 16px/20px 'Nimbus Sans Nova', sans-serif;
    letter-spacing: 0.025em;
    text-align: center;
}

.b-longread-city__foot {
    color: #fff;
    background: #5f646a;
}

.b-longread-city__foot-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

.b-longread-city__speaker {
    flex: 1 0 auto;
    display: flex;
    align-items: center;
    width: 45%;
}

.b-longread-city__speaker:first-child {
    justify-content: flex-start;
    text-align: left;
}

.b-longread-city__speaker:last-child {
    justify-content: flex-end;
    text-align: right;
}

.b-longread-city__speaker-picture {
    flex: 0 0 auto;
}

.b-longread-city__speaker-content {
    max-width: 34.5em;
    padding: 1.5em;
}

.b-longread-city__speaker-img {
    display: block;
    max-width: 100%;
    height: auto;
}

.b-longread-city__speaker-title {
    margin: 0 0 calc(5 / 24 * 1em);
    font: normal 700 2.4em/1 'Nimbus Sans Nova', sans-serif;
    text-transform: uppercase;
}

.b-longread-city__speaker-txt {
    font: normal 400 1.4em/1.25 'Nimbus Sans Nova', sans-serif;
}

.b-longread-city__speakers-expand-btn {
    flex: 1 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 30px;
    height: 40px;
    font: normal 400 18px/1 'Nimbus Sans Nova', sans-serif;
    color: #fff;
    background: #2dccd3;
    transition: all 0.3s;
}

.b-longread-city__speakers-expand-btn:hover {
    background: #2897a0;
}

@media (max-width: 1366px) {
    .b-longread-city {
        font-size: 0.75vw;
    }

    .b-longread-city__body {
        margin: 12em 0;
        background-size: contain;
    }
}

@media (max-width: 1200px) {
    .b-longread-city__foot-content {
        flex-direction: column;
    }

    .b-longread-city__speakers {
        max-width: 100%;
        width: 100%;
    }

    .b-longread-city__speakers-expand-btn {
        width: 100%;
        height: 60px;
    }
}

@media (max-width: 1060px) {
    .b-longread-city__speakers {
        flex-direction: column;
    }

    .b-longread-city__speaker {
        width: 100%;
        font-size: 8px;
    }

    .b-longread-city__speaker + .b-longread-city__speaker {
        border-top: 1px solid #283638;
    }
}

@media (max-width: 675px) {
    .b-longread-city__service-items {
        flex-direction: column;
        align-items: center;
    }

    .b-longread-city__service-item {
        width: 100%;
        font-size: 8px;
    }
}

/* Speakers */
.b-longread-speakers {
    color: #000;
    background: #f4f4f4;
}

.b-longread-speakers__speaker {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6em 0 3.5em;
    background: #fff;
}

.b-longread-speakers__collapse {
    display: flex;
    justify-content: center;
    margin: 8em 0 0;
}

.b-longread-speakers__collapse-btn {
    font: normal 400 14px/1 'Nimbus Sans Nova', sans-serif;
    color: inherit;
    background: none;
    border: none;
    cursor: pointer;
}

.b-longread-speakers__collapse-btn:before {
    content: '';
    display: block;
    width: 9px;
    height: 40px;
    margin: 0 auto 15px;
    background: url('../img/arrow-top.png') no-repeat 50% 50%;
    background-size: contain;
}

@media (max-width: 1200px) {
    .b-longread-speakers__speaker {
        padding: 6em 3em 3.5em;
    }

    .b-longread-speakers__collapse-btn {
        display: block;
        width: 100%;
    }
}

/* Speaker */
.b-longread-speaker {
    max-width: 845px;
    margin: 0 auto;
}

.b-longread-speaker__title {
    margin: 0 0 calc(15 / 61 * 1em);
    font: normal 700 6.1em/1 'Nimbus Sans Nova', sans-serif;
    text-align: center;
    color: #2dccd3;
}

.b-longread-speaker__lead {
    margin: 0 0 calc(80 / 22 * 1em);
    font: normal 700 2.2em/1.2 'Nimbus Sans Nova', sans-serif;
    text-align: center;
}

.b-longread-speaker__lead:before {
    content: '';
    display: block;
    width: 76px;
    height: 2px;
    background: currentColor;
    margin: 0 auto calc(15 / 22 * 1em);
}

.b-longread-speaker__photo {
    margin: 0 0 7em;
    text-align: center;
}

.b-longread-speaker__photo-content {
    position: relative;
    display: inline-block;
    max-width: 100%;
}

.b-longread-speaker__photo-img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    background: #f4f4f4;
}

.b-longread-speaker__photo-title {
    position: absolute;
    right: 0;
    bottom: -6px;
    font: italic 400 12px/1 'Nimbus Sans Nova', sans-serif;
    transform: rotate(-90deg) translate(100%, 100%);
    transform-origin: 100%;
}

.b-longread-speaker__img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto 7em;
    background: #f4f4f4;
}

.b-longread-speaker__txt {
    margin: 0 0 calc(60 / 16 * 1em);
    font: normal 400 16px/1.25 'Nimbus Sans Nova', sans-serif;
}

.b-longread-speaker__txt a {
    text-decoration: underline;
}

.b-longread-speaker__txt a:hover {
    text-decoration: none;
}

.b-longread-speaker__txt p + p {
    margin-top: calc(24 / 16 * 1em);
}

.b-longread-speaker__txt em {
    font-style: italic;
}

.b-longread-speaker__txt strong {
    font-weight: 700;
    text-transform: uppercase;
}

.b-longread-speaker__quote {
    position: relative;
    margin: calc(90 / 30 * 1em) 0 calc(70 / 30 * 1em);
    padding: 0 calc(100 / 30 * 1em);
    font: normal 400 3em/1.66 'Nimbus Sans Nova', sans-serif;
    text-transform: uppercase;
    color: #2dccd3;
}

.b-longread-speaker__quote:before,
.b-longread-speaker__quote:after {
    content: '';
    position: absolute;
    width: calc(69 / 30 * 1em);
    height: calc(72 / 30 * 1em);
    background: url('../img/quotes.png') no-repeat 50% 50%;
    background-size: contain;
}

.b-longread-speaker__quote:before {
    top: 0;
    left: 0;
}

.b-longread-speaker__quote:after {
    right: 0;
    bottom: 0;
    transform: scaleX(-1);
}

@media (max-width: 1200px) {
    .b-longread-speaker__lead br {
        display: none;
    }
}

@media (max-width: 850px) {
    .b-longread-speaker__photo-img {
        margin-bottom: 3em;
    }

    .b-longread-speaker__photo-title {
        position: static;
        transform: none;
    }
}

/* Promo Features */
.b-longread-promo-features {
    padding: 5em 3em 7em;
    color: #fff;
    background: #2dccd3;
}

.b-longread-promo-features__title {
    margin: 0 0 calc(50 / 40 * 1em);
    font: normal 700 4em/1 'Nimbus Sans Nova', sans-serif;
    text-align: center;
}

.b-longread-promo-features__title a {
    text-decoration: underline;
}

.b-longread-promo-features__title a:hover {
    text-decoration: none;
}

.b-longread-promo-features__items {
    display: flex;
    justify-content: center;
    margin: -3em 0 0;
}

.b-longread-promo-features__item {
    flex: 0 0 auto;
    width: 250px;
    margin: 3em 0 0;
    padding: 0 20px;
}

.b-longread-promo-features__item-img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto 5em;
}

.b-longread-promo-features__item-title {
    margin: 0 0 calc(5 / 16 * 1em);
    font: normal 700 1.6em/1.25 'Nimbus Sans Nova', sans-serif;
    text-align: center;
}

.b-longread-promo-features__item-txt {
    font: normal 400 1.6em/1.25 'Nimbus Sans Nova', sans-serif;
    text-align: center;
}

@media (max-width: 1000px) {
    .b-longread-promo-features__items {
        flex-direction: column;
        align-items: center;
        font-size: 12px;
    }

    .b-longread-promo-features__item-img {
        margin-bottom: 1.5em;
    }
}

/* Promo Details */
.b-longread-promo-details {
    color: #000;
    background: #f4f4f4;
}

.b-longread-promo-details__content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 7em 3em 5.5em;
    background: #fff;
}

.b-longread-promo-details__title {
    margin: 0 0 calc(30 / 40 * 1em);
    font: normal 700 4em/1 'Nimbus Sans Nova', sans-serif;
    text-align: center;
    color: #2dccd3;
}

.b-longread-promo-details__txt {
    max-width: 680px;
    margin: 0 auto calc(60 / 20 * 1em);
    font: normal 400 2em/1.2 'Nimbus Sans Nova', sans-serif;
    text-align: center;
}

.b-longread-promo-details__txt p + p {
    margin-top: calc(25 / 20 * 1em);
}

.b-longread-promo-details__txt p strong {
    font-weight: 700;
    color: #2dccd3;
}

.b-longread-promo-details__link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(260 / 22 * 1em);
    height: calc(50 / 22 * 1em);
    margin: 0 auto;
    font: normal 400 2.2em/1 'Nimbus Sans Nova', sans-serif;
    text-transform: uppercase;
    color: #fff;
    background: #2dccd3;
    transition: all 0.3s;
}

.b-longread-promo-details__link:hover {
    background: #2897a0;
}

/* Placeholder */
.b-longread-placeholder {
    display: flex;
    align-items: flex-start;
    max-width: 100%;
}

.b-longread-placeholder__spacing {
    content: '';
    width: 1px;
    margin: 0 0 0 -1px;
}

.b-longread-placeholder__content {
    display: block;
    max-width: 100%;
    height: auto;
}