body {
            margin: 0px;
        }

        p {
            margin: 0px;
        }

        .main {
            display: flex;
            flex-direction: column;
            align-items: center;
            min-height: 100vh;
             justify-content: center;
        }

        @font-face {
	font-family: 'FuturaLightC-Italic';
	src: url('../fonts/futuralightc-italic.eot'); /* IE 9 Compatibility Mode */
	src: url('../fonts/futuralightc-italic.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('../fonts/futuralightc-italic.woff2') format('woff2'), /* Super Modern Browsers */
		url('../fonts/futuralightc-italic.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('../fonts/futuralightc-italic.ttf') format('truetype'), /* Safari, Android, iOS */
		url('../fonts/futuralightc-italic.svg#futuralightc-italic') format('svg'); /* Chrome < 4, Legacy iOS */
}
        cover-with-image {
             background-image: url(./бетон.jpg) !important;

        }
        
         .cover {
            position: fixed;
            top: 0;
            left: 0;
            background-size: cover;
            background-position: center;
            background-position-y: top;
            height: 100%;
            width: 100%;
            z-index: -1;
        }
        .cover-color{
             background-image: url(images/рулон.jpg);
        }


        .text-logo {
            font-family: 'FuturaLightC-Italic';
            margin-top: 20px;
            color:#1C2A39;
            font-size: 40px;
            letter-spacing: 6px;
             background: rgba(255, 255, 255, 0.05); /* Едва заметный белый фон */
    backdrop-filter: blur(10px);           /* Размытие того, что за карточкой */
    border: 1px solid rgba(255, 255, 255, 0.2); /* Тонкая светлая рамка */
          border-radius: 30px;
          padding: 10px;
        }

        .link-item {
            font-family: 'FuturaLightC-Italic';
            color: #1C2A39;
                width: 140px;
                font-size: 14px;
                padding: 15px;
                margin-top: 15px;
                margin-right: 20px;
             font-weight: bold;
            box-shadow: 0px 0px 4px 1px #D97D24;
            transition: box-shadow .5s;
            cursor: pointer;
            text-decoration: none;
            display: flex;
            justify-content: center;
            background: rgba(255, 255, 255, 0.05); /* Едва заметный белый фон */
    backdrop-filter: blur(10px);           /* Размытие того, что за карточкой */
    border: 1px solid rgba(255, 255, 255, 0.2); /* Тонкая светлая рамка */
          border-radius: 30px;
        }

        .links {
            display: flex;
        }

        .link-item:hover {
            box-shadow: 0px 0px 4px 1px rgba(255, 255, 255, 0.7);
        }

        .workshop {
            margin-top: 48px;
            padding: 0 20%;
        }

        .yamamoto {
            border-left: 2px solid #1C2A39;;
            padding: 10px;
            padding-left: 32px;
            box-shadow: #5B675A;
          border-radius: 30px;
           font-weight: bold;
        }

        .yamamoto-name {
            text-align: end;
            margin: 12px;
            font-size: 20px;
            background: rgba(255, 255, 255, 0.1); /* Едва заметный белый фон */
    backdrop-filter: blur(10px);           /* Размытие того, что за карточкой */
    border: 1px solid rgba(255, 255, 255, 0.2); /* Тонкая светлая рамка */
          border-radius: 30px;
          padding: 15px;
           font-weight: bold;
        }

        h2.yamamoto {
            color: #8C4F3E;
        }

        .text {
            color: #1C2A39;;
            font-family: 'FuturaLightC-Italic';
            font-size: 24px;
            font-weight: bold;
            background: rgba(255, 255, 255, 0.2); /* Едва заметный белый фон */
    backdrop-filter: blur(10px);           /* Размытие того, что за карточкой */
    border: 1px solid rgba(255, 255, 255, 0.2); /* Тонкая светлая рамка */
          border-radius: 30px;
          padding: 15px;
        }

        .content-wrapper {
            margin-top: 80px;
            padding-bottom: 100px;
            display: flex;
        }

        .content-image {
            height: 750px;
            width: 450px;
            object-fit: cover;
            border: 2px solid #D97D24;
            border-radius: 20px;
            margin-right: 32px;
        }

        .gutter-top1 {
            margin-top: 16px;
            color: #1f2937;
           
        }
        .gutter-top2 {
            margin-top: 16px;
            color: #1C2A39;
        }
        .gutter-top3 {
            margin-top: 16px;
        }
        .gutter-top4 {
            margin-top: 16px;
        }
        .gutter-top5 {
            margin-top: 16px;
        }

        .footer {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
            bottom: 0px;
        }

        .socials-wrapper {
           position: absolute;
            bottom: -210px;
            display: flex;
            filter: invert(1);
        }

        .social {
            height:40px;
            width:40px;
            display:flex;
            padding:8px;
            border-radius:100%;
            background-color: rgba(255, 255, 255, 0.1);
            transition: background-color .5s;
             filter: invert(1);
             margin-bottom: 15px;
        }

        .social-icon {
            filter: brightness(0) invert(1);
        }

        .social:hover {
            background-color: rgba(255, 255, 255, 0.2);
        }

        .social:not(:last-child) {
            margin-right: 12px;
        }

        .logo-wrapper {
            position: absolute;
            bottom: -120px;
            
        }

        .logo {
            width: 80px;
            filter: invert(1);
           
        }
        footer {
    text-align: center;
    padding: 40px 0;
    border-top: 1px solid #1f2937;
    color: darkgray; /* ИСПРАВЛЕНО: Удален знак # перед названием цвета */
    background-color: #8C4F3E;
        }

        @media (max-width: 480px) {
   
         .cover {
            position: fixed;
            top: 0;
            left: 0;
            background-size: cover;
            background-position: center;
            background-position-y: top;
            height: 100%;
            width: 100%;
            z-index: -1;
        }
        .cover-color{
   
   
   
            background-color: #5B675A;
        }
         .links{
                text-align: center;
                flex-direction: column;
                margin-bottom: 10px;
            }


            .link-item {
                  width: 140px;
                font-size: 14px;
                padding: 12px 30px;
                margin-top: 15px;
            }
            .text-logo {
                font-size: 30px;
                margin-left:20px;
                margin-bottom:20px;
            }
            .content-wrapper {
              flex-direction: column;
            }
            .content-image { 
                margin-right: 0px; 
                width: 350px; 
                height: auto; 
                margin-bottom: 24px;
}

        }
         @media (max-width: 750px) {
            cover-with-image {
            background-image: url(./сумка1.jpg)

        }
         .cover {
            position: fixed;
            top: 0;
            left: 0;
            background-size: cover;
            background-position: center;
            background-position-y: top;
            height: 100%;
            width: 100%;
            z-index: -1;
        }
        .cover-color{
    
            background-color: #5B675A;
        }
         .links{
                text-align: center;
                flex-direction: column;
                margin-bottom: 10px;
            }


            .link-item {
               width: 140px;
                font-size: 14px;
                padding: 12px 30px;
                margin-top: 15px;
            }
            .text-logo {
                font-size: 30px;
                margin-left:20px;
                margin-bottom:20px;
            }
            .content-wrapper {
              flex-direction: column;
            }
            .content-image { 
                margin-right: 0px; 
                width: 350px; 
                height: auto; 
                margin-bottom: 24px;
}
         }
           

         @media (max-width: 950px) {
            .link-item {
                 width: 140px;
                font-size: 14px;
                padding: 12px 30px;
                margin-top: 15px;
            }
             .links{
                text-align: center;
                flex-direction: column;
                margin-bottom: 10px;
            }

            .text-logo {
                font-size: 30px;
                margin-left:20px;
                margin-bottom:20px;
            }
            .content-wrapper {
              flex-direction: column;
            }
            .content-image { 
                margin-right: 0px; 
                width: 350px; 
                height: auto; 
                margin-bottom: 24px;
            }
}