* {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
     }

     body {
         font-family: 'Georgia', serif;
         line-height: 1.6;
         background: #0c0c0c;
         color: #eaeaea;
     }

     header {
         width: 100%;
         background: #111;
         color: #eaeaea;
         padding: 1rem 2rem;
         position: fixed;
         top: 0;
         left: 0;
         z-index: 1000;
         display: flex;
         justify-content: space-between;
         align-items: center;
     }

     header h1 {
         font-size: 1.5rem;
         color: #c92c2c;
         letter-spacing: 2px;
     }

     nav a {
         color: #eaeaea;
         margin-left: 2rem;
         text-decoration: none;
         font-weight: bold;
         transition: color 0.3s;
     }

     nav a:hover {
         color: #c92c2c;
     }

     a:link {
         color: #eaeaea;
     }

     a:hover {
         color: #c92c2c;
     }

     .slider {
         margin-top: 70px;
         position: relative;
         width: 100%;
         height: 500px;
         overflow: hidden;
     }

     .slides {
         display: flex;
         width: 100%;
         height: 100%;
         transition: transform 0.8s ease-in-out;
     }

     .slide {
         width: 100%;
         flex: 0 0 100%;
         position: relative;
     }

     .slide picture,
     .slide img {
         width: 100%;
         height: 100%;
         object-fit: contain;
         filter: brightness(0.9);
     }

     .slide h2 {
         position: absolute;
         bottom: 20%;
         left: 10%;
         color: #fff;
         font-size: 2.5rem;
         background: rgba(0, 0, 0, 0.5);
         padding: 1rem 2rem;
         border-radius: 5px;
     }

     .dots {
         position: absolute;
         bottom: 20px;
         left: 50%;
         transform: translateX(-50%);
         display: flex;
         gap: 10px;
     }

     .dot {
         width: 12px;
         height: 12px;
         border-radius: 50%;
         background: #777;
         cursor: pointer;
         transition: background 0.3s;
     }

     .dot.active {
         background: #c92c2c;
     }

     .content-section {
         display: flex;
         padding: 4rem 2rem;
         align-items: center;
         gap: 2rem;
         border-bottom: 1px solid #333;
     }

     .content-section:nth-child(even) {
         flex-direction: row-reverse;
     }

     .content-section img {
         width: 250px;
         height: auto;
         object-fit: cover;
         box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
     }

     .content-section .desc {
         flex: 1;
     }

     .content-section h2 {
         color: #c92c2c;
         margin-bottom: 1rem;
     }

     /* Icons */

     ul.icons {
         cursor: default;
         list-style: none;
         padding-left: 0;
         margin: -1em 0 2em -1em;
     }

     ul.icons li {
         display: inline-block;
         padding: 1em 0 0 1em;
     }

     @media (max-width: 768px) {
         .slider {
             height: 300px;
         }

         .content-section {
             flex-direction: column;
             text-align: center;
         }

         .content-section:nth-child(even) {
             flex-direction: column;
         }

         .content-section img {
             margin-bottom: 1rem;
             width: 100%;
             max-width: 300px;
         }

         .slide h2 {
             font-size: 1.5rem;
             bottom: 10%;
         }
     }