@media (max-width: 1200px) {

    .botCinemaHeroBackground {
        gap: 20px;
    }

    .botCinemaForumCard {
        flex-basis: 292px;
        width: 292px;
    }

    .botCinemaForumGallery {
        grid-template-rows: 94px 94px;
    }

    .botCinemaHeroContent {
        width: min(100% - 48px, 1040px);
    }

    .botCinemaHeroContent h1 {
        max-width: 860px;
    }

}

@media (max-width: 900px) {

    .botCinemaHero {
        min-height: calc(100svh - 90px);

        border-radius: 0 0 32px 32px;
    }

    .botCinemaHeroBackground {
        gap: 18px;

        transform: rotate(-1deg) scale(1.06);

        opacity: .66;
    }

    .botCinemaForumCard {
        flex-basis: 260px;
        width: 260px;

        padding: 12px;

        border-radius: 14px;
    }

    .botCinemaForumGallery {
        grid-template-rows: 84px 84px;
    }

    .botCinemaForumTitle {
        font-size: 14px;
    }

    .botCinemaHeroWash {
        background:
            linear-gradient(
                180deg,
                rgba(248, 245, 242, .88) 0%,
                rgba(248, 245, 242, .68) 34%,
                rgba(248, 245, 242, .72) 70%,
                rgba(248, 245, 242, .90) 100%
            );
    }

    .botCinemaHeroContent {
        width: calc(100% - 40px);

        padding: 120px 0 80px;
    }

    .botCinemaHeroContent .page-breadcrumb {
        margin-bottom: 42px;
    }

    .botCinemaHeroContent h1 {
        max-width: 720px;

        font-size: clamp(54px, 10vw, 78px);
    }

    .botCinemaHeroContent .hero-description {
        max-width: 620px;

        font-size: 18px;
    }

}

@media (max-width: 640px) {

    .botCinemaHero {
        min-height: calc(100svh - 76px);

        align-items: flex-end;

        border-radius: 0 0 26px 26px;
    }

    .botCinemaHeroBackground {
        justify-content: center;
        gap: 14px;

        transform: rotate(-1deg) scale(1.09);

        opacity: .52;
    }

    .botCinemaMarqueeSet {
        gap: 12px;
        padding-right: 12px;
    }

    .botCinemaMarqueeRowNow .botCinemaMarqueeTrack {
        animation-duration: 82s;
    }

    .botCinemaMarqueeRowComing .botCinemaMarqueeTrack {
        animation-duration: 96s;
    }

    .botCinemaForumCard {
        flex-basis: 224px;
        width: 224px;

        padding: 10px;

        border-radius: 13px;
    }

    .botCinemaForumMeta {
        margin-bottom: 5px;

        font-size: 9px;
    }

    .botCinemaForumMeta span:last-child {
        display: none;
    }

    .botCinemaForumTitle {
        margin-bottom: 7px;

        font-size: 13px;
    }

    .botCinemaForumGallery {
        grid-template-rows: 70px 70px;
        gap: 3px;

        border-radius: 8px;
    }

    .botCinemaForumTags {
        left: 5px;
        right: 5px;
        bottom: 5px;

        gap: 3px;
    }

    .botCinemaForumTags span {
        padding: 4px 6px;

        font-size: 8px;
    }

    .botCinemaForumTags span:nth-child(n + 3) {
        display: none;
    }

    .botCinemaForumComments {
        margin-top: 7px;

        font-size: 10px;
    }

    .botCinemaHeroWash {
        background:
            linear-gradient(
                180deg,
                rgba(248, 245, 242, .90) 0%,
                rgba(248, 245, 242, .64) 28%,
                rgba(248, 245, 242, .74) 62%,
                rgba(248, 245, 242, .97) 100%
            );
    }

    .botCinemaHero::before,
    .botCinemaHero::after {
        width: 9%;
    }

    .botCinemaHeroContent {
        width: calc(100% - 32px);

        padding: 105px 0 54px;
    }

    .botCinemaHeroContent .page-breadcrumb {
        margin-bottom: 34px;
    }

    .botCinemaHeroContent .commonEyebrow {
        margin-bottom: 15px;
    }

    .botCinemaHeroContent h1 {
        max-width: none;

        font-size: clamp(46px, 14vw, 64px);
        letter-spacing: -.07em;
        line-height: .96;
    }

    .botCinemaHeroContent .hero-description {
        margin-top: 28px;

        font-size: 16px;
        line-height: 1.65;
    }

    .botCinemaHeroContent .hero-actions {
        width: 100%;

        margin-top: 30px;
    }

    .botCinemaHeroContent .hero-button {
        width: 100%;

        justify-content: center;
    }

}

@media (prefers-reduced-motion: reduce) {

    .botCinemaMarqueeTrack {
        animation: none !important;
        transform: translateX(-8%);
    }

}
@media (max-width: 900px) {

    .botCinemaReal {
        padding-top: 110px;
        padding-bottom: 110px;
    }

    .botCinemaRealHeading {
        margin-bottom: 52px;
    }

    .botCinemaRealTitle {
        font-size: clamp(52px, 10vw, 76px);
    }

    .botCinemaRealIntro {
        max-width: 620px;

        font-size: 17px;
    }

    .botCinemaRealVisual {
        width: calc(100% - 24px);
    }

    .botCinemaRealPicture {
        border-radius: 24px;
    }

    .botCinemaRealCaption {
        width: calc(100% - 40px);

        margin-top: 34px;

        font-size: 16px;
    }

}

@media (max-width: 560px) {

    .botCinemaReal {
        padding-top: 88px;
        padding-bottom: 88px;
    }

    .botCinemaRealHeading {
        width: calc(100% - 32px);

        margin-bottom: 38px;
    }

    .botCinemaRealTitle {
        font-size: clamp(44px, 14vw, 60px);
        line-height: .98;
    }

    .botCinemaRealIntro {
        margin-top: 24px;

        font-size: 16px;
        line-height: 1.65;
    }

    .botCinemaRealVisual {
        width: calc(100% - 20px);
    }

    .botCinemaRealPicture {
        border-radius: 20px;

        box-shadow:
            0 24px 60px rgba(47, 61, 69, .12),
            0 4px 16px rgba(47, 61, 69, .06);
    }

    .botCinemaRealGlow {
        inset: 5% 2% -4%;

        filter: blur(34px);
    }

    .botCinemaRealCaption {
        width: calc(100% - 34px);

        margin-top: 28px;

        font-size: 15px;
    }

}
@media (max-width: 1000px) {

    .botCinemaThread {
        padding-top: 110px;
        padding-bottom: 110px;
    }

    .botCinemaThreadLayout {
        width: calc(100% - 48px);

        grid-template-columns: 1fr;
        gap: 64px;
    }

    .botCinemaThreadContent {
        max-width: 760px;
    }

    .botCinemaThreadTitle {
        max-width: 760px;

        font-size: clamp(52px, 8.5vw, 78px);
    }

    .botCinemaThreadText {
        max-width: 680px;
    }

    .botCinemaThreadVisual {
        width: min(100%, 560px);

        justify-self: center;
    }

}

@media (max-width: 560px) {

    .botCinemaThread {
        padding-top: 88px;
        padding-bottom: 88px;
    }

    .botCinemaThreadLayout {
        width: calc(100% - 32px);

        gap: 44px;
    }

    .botCinemaThreadTitle {
        font-size: clamp(44px, 13vw, 60px);
        line-height: .98;
    }

    .botCinemaThreadText {
        margin-top: 24px;

        font-size: 16px;
        line-height: 1.65;
    }

    .botCinemaThreadFeatures {
        gap: 8px;

        margin-top: 28px;
    }

    .botCinemaThreadFeatures span {
        padding: 9px 11px;

        font-size: 11px;
    }

    .botCinemaThreadFrame {
        border-radius: 21px;

        box-shadow:
            0 24px 62px rgba(47, 61, 69, .13),
            0 4px 16px rgba(47, 61, 69, .06);
    }

    .botCinemaThreadFrameTop {
        min-height: 42px;

        padding: 0 14px;
    }

    .botCinemaThreadFrameTop p {
        font-size: 10px;
    }

    .botCinemaThreadGlow {
        inset: 5% -3% -3%;

        filter: blur(34px);
    }

}
@media (max-width: 900px) {

    .botCinemaBenefits {
        padding-top: 110px;
        padding-bottom: 110px;
    }

    .botCinemaBenefits .commonSectionHeading {
        width: calc(100% - 48px);
        margin-bottom: 52px;
    }

    .botCinemaBenefitsGrid {
        width: calc(100% - 48px);

        grid-template-columns: 1fr;
    }

    .botCinemaBenefitCard,
    .botCinemaBenefitCardLarge {
        grid-row: auto;

        min-height: 430px;
    }

    .botCinemaBenefitCardWide {
        grid-column: auto;
    }

    .botCinemaBenefitWideContent {
        grid-template-columns: 1fr;
        gap: 42px;
    }

}

@media (max-width: 560px) {

    .botCinemaBenefits {
        padding-top: 88px;
        padding-bottom: 88px;
    }

    .botCinemaBenefits .commonSectionHeading,
    .botCinemaBenefitsGrid {
        width: calc(100% - 32px);
    }

    .botCinemaBenefits .commonSectionHeading {
        margin-bottom: 38px;
    }

    .botCinemaBenefitsGrid {
        gap: 15px;
    }

    .botCinemaBenefitCard,
    .botCinemaBenefitCardLarge {
        min-height: 390px;

        padding: 25px;

        border-radius: 24px;
    }

    .botCinemaBenefitCardWide {
        min-height: auto;
    }

    .botCinemaBenefitIcon {
        width: 58px;
        height: 58px;

        margin-bottom: 29px;

        border-radius: 18px;
    }

    .botCinemaBenefitIcon svg {
        width: 36px;
        height: 36px;
    }

    .botCinemaBenefitCard h3 {
        font-size: clamp(31px, 10vw, 42px);
    }

    .botCinemaBenefitCard > p:not(.botCinemaBenefitLabel),
    .botCinemaBenefitWideContent p {
        margin-top: 20px;

        font-size: 15px;
        line-height: 1.65;
    }

    .botCinemaBenefitPreview {
        padding-top: 34px;
    }

    .botCinemaBenefitPreviewFlow {
        align-items: flex-start;
    }

    .botCinemaBenefitPreviewFlow i {
        display: none;
    }

    .botCinemaBenefitWideContent {
        gap: 34px;
    }

}
@media (max-width: 900px) {

    .botCinemaFaq {
        padding-top: 110px;
        padding-bottom: 125px;
    }

    .botCinemaFaq .commonSectionHeading {
        width: calc(100% - 48px);

        margin-bottom: 52px;
    }

    .botCinemaFaqList {
        width: calc(100% - 48px);

        border-radius: 25px;
    }

}

@media (max-width: 560px) {

    .botCinemaFaq {
        padding-top: 88px;
        padding-bottom: 100px;
    }

    .botCinemaFaq .commonSectionHeading,
    .botCinemaFaqList {
        width: calc(100% - 32px);
    }

    .botCinemaFaq .commonSectionHeading {
        margin-bottom: 38px;
    }

    .botCinemaFaqList {
        border-radius: 22px;
    }

    .botCinemaFaqQuestion {
        gap: 20px;

        padding: 22px 20px;

        font-size: 16px;
        line-height: 1.45;
    }

    .botCinemaFaqQuestion svg {
        width: 20px;
        height: 20px;
    }

    .botCinemaFaqAnswerInner {
        padding: 0 52px 24px 20px;
    }

    .botCinemaFaqAnswerInner p {
        font-size: 15px;
        line-height: 1.7;
    }

}

@media (prefers-reduced-motion: reduce) {

    .botCinemaFaqQuestion,
    .botCinemaFaqQuestion svg,
    .botCinemaFaqAnswer {
        transition: none !important;
    }

}