Почему container имеет полную ширину, хотя стоит width: auto

Всем привет!

Делаю сейчас сайт и мне кажется, что столкнулся с какой-то очевидной проблемой, мне нужно чтобы width был по величине контента который находится в контейнерах, но он почему-то полностью занимается всё место.

Вот видно на скриншоте:

styles.sass:

@media screen and  (min-width: 1200px)

*

    body
        width: 100%
        height: auto

        .last-screen
            width: 100%
            height: auto
            margin-top: $m128

            .container
                display: none

            .container-box-c
                width: $container
                height: auto
                display: flex
                flex-direction: column
                margin: auto
                align-items: center

                .additional-text
                    display: flex
                    align-items: center
                    margin: auto

                    .mini-text
                        color: $brightBlue
                        font-family: Raleway
                        font-size: $f21
                        font-style: normal
                        font-weight: 600
                        line-height: normal
                        margin-left: $m16

                    .line
                        width: clamp(1.5px,0.15624vw,6px)
                        height: clamp(27px,2.81232vw,108px)
                        background-color: $brightBlue

                .heading
                    width: 60%
                    margin: auto
                    color: $darkGray
                    text-align: center
                    font-family: Raleway
                    font-size: $f36
                    font-style: normal
                    font-weight: 800
                    line-height: 140.4%
                    text-transform: uppercase
                    margin-top: $m32

                .screen-1
                    width: auto !important
                    height: auto
                    margin: auto
                    display: flex
                    flex-direction: row
                    justify-content: center
                    margin-top: $m64
                    border: 2px solid red
                    flex-shrink: 0 !important

                    .content
                        width: auto
                        display: flex
                        border: 2px solid green
                        flex-shrink: 0

                        .illustration-one

                        .text-container
                            // width: 40%
                            display: flex
                            flex-direction: column
                            margin-left: $m64
                            flex-shrink: 0 !important

                            .star
                                width: clamp(17.5px,1.8228vw,70px)
                                height: clamp(17.5px,1.8228vw,70px)

                            .text-tab
                                display: flex
                                align-items: center
                                margin-top: $m32
                                flex-shrink: 0 !important

                                .paragraph-text
                                    width: 40%
                                    border: 2px solid yellow
                                    margin-left: $m16
                                    margin-top: $m16
                                    flex-shrink: 0 !importan

LastScreen.tsx:

    import React from "react";

import illustrationOne from "../assets/taxesMonitoring.svg";
import illustrationTwo from "../assets/statsIllustration.svg";
import star from "../assets/star.svg";

import "../styles/last/last-styles.css";

const Fade = require("react-reveal/Fade");

const LastScreen = () => {
  return (
    <div className="last-screen" id="last">
      <div className="container">
        <Fade bottom>
          <div className="additional-text">
            <p className="mini-text">Результаты</p>
            <figure className="line"></figure>
          </div>
        </Fade>
        <Fade bottom>
          <h2 className="heading">
            Результаты внедрения решения <span>по налоговому мониторингу</span>
          </h2>
        </Fade>
        <div className="taxes-monitoring-one">
          <Fade bottom>
            <div className="star-container">
              <img className="star" src={star} alt="star"></img>
              <p className="star-text">
                Индикатор высокого уровня автоматизации учетных процессов и
                прозрачности бизнеса с налоговой точки зрения
              </p>
            </div>
          </Fade>
          <Fade bottom>
            <div className="star-container">
              <img className="star" src={star} alt="star"></img>
              <p className="star-text">
                Уникальное на рынке РФ решение, встраиваемое в текущие ИС
                компании и не зависящее от внешнего поставщика ПО
              </p>
            </div>
          </Fade>
          <Fade bottom>
            <div className="star-container">
              <img className="star" src={star} alt="star"></img>
              <p className="star-text">
                Структурированное хранение первичных документов и договоров
              </p>
            </div>
          </Fade>
          <Fade bottom>
            <img
              src={illustrationOne}
              alt="illustration"
              className="illustration-one"
            />
          </Fade>
        </div>
        <Fade bottom>
          <figure className="line-2"></figure>
        </Fade>

        <div className="taxes-monitoring-two">
          <div className="star-container">
            <Fade bottom>
              <img src={star} alt="star" className="star" />
              <p className="star-text">
                База для совершенствования зависимых и кросс-зависимых процессов
                и процедур в Группе
              </p>
            </Fade>
          </div>
          <div className="star-container">
            <Fade bottom>
              <img src={star} alt="star" className="star" />
              <p className="star-text">
                Лидерские позиции среди крупнейших компаний по внедрению данного
                формата взаимодействия с налоговыми органами РФ
              </p>
            </Fade>
          </div>
          <div className="star-container">
            <Fade bottom>
              <img src={star} alt="star" className="star" />
              <p className="star-text">
                Консистентные, сопоставимые и неизменные учетные данные
              </p>
            </Fade>
          </div>
          <Fade bottom>
            <img
              src={illustrationTwo}
              alt="illustration"
              className="illustration-two"
            />
          </Fade>
        </div>
      </div>
      <div className="container-box-c">
        <div className="additional-text">
          <figure className="line"></figure>
          <p className="mini-text">Результаты</p>
        </div>
        <h2 className="heading">
          Результаты внедрения решения по <span>налоговому мониторингу</span>
        </h2>
        <div className="screen-1">
          <div className="content">
            <img
              src={illustrationOne}
              alt="illustration-one"
              className="illustration-one"
            />
            <div className="text-container">
              <div className="text-tab">
                <img src={star} alt="star" className="star" />
                <p className="paragraph-text">
                  Индикатор высокого уровня автоматизации учетных процессов и
                  прозрачности бизнеса с налоговой точки зрения
                </p>
              </div>
              <div className="text-tab">
                <img src={star} alt="star" className="star" />
                <p className="paragraph-text">
                  Уникальное на рынке РФ решение, встраиваемое в текущие ИС
                  компании и не зависящее от внешнего поставщика ПО
                </p>
              </div>
              <div className="text-tab">
                <img src={star} alt="star" className="star" />
                <p className="paragraph-text">
                  Структурированное хранение первичных документов и договоров
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
};

export default LastScreen;