* {
              box-sizing: border-box;
            }
        
            .app {
              margin: 0;
              font-family: Arial, sans-serif;
              background-color: #f9f9f9;
            }
        
            .section {
              display: flex;
              flex-direction: row-reverse;
              flex-wrap: wrap;
              align-items: center;
              padding: 40px 20px;
              background-color: #e8eef3;
            }
        
            .image-container {
              flex: 1;
              padding: 20px;
              position: relative;
              text-align: center;
            }
        
            .image-container img {
              max-width: 100%;
              height: auto;
              border-radius: 10px;
              transition: transform 0.3s, opacity 0.3s;
            }
        
            .image-container .secondary {
              position: absolute;
              top: 0;
              left: 0;
              opacity: 0;
              transform: scale(0.9);
            }
        
            .content {
              flex: 1;
              padding: 20px;
            }
        
            .content h1 {
              color: #2dabec;
              font-size: 2rem;
              margin-bottom: 20px;
            }
        
            .content p {
              color: #555;
              font-size: 1rem;
              line-height: 1.6;
              margin-bottom: 20px;
            }
        
            .content a {
              display: inline-block;
              margin: 5px 10px 5px 0;
              color: #38c191;
              text-decoration: none;
              font-weight: bold;
              border-bottom: 1px solid #388e3c;
            }
        
            .content .buttons {
              margin-top: 20px;
            }
        
            .content .buttons button {
              border: 2px solid #7bc7e2f5;
              padding: 10px 20px;
              border-radius: 20px;
              font-size: 1rem;
              cursor: pointer;
              transition: background-color 0.3s, color 0.3s;
              margin-right: 10px;
            }
        
            .content .buttons .view {
              background-color: #fff;
              color: #e67c7cf0;
            }
        
            .content .buttons .explore {
              background-color: #e67c7cf0;
              color: #fff;
            }
        
            @media (max-width: 768px) {
              .section {
                flex-direction: column;
                text-align: center;
              }
        
              .content h1 {
                font-size: 1.5rem;
              }
        
              .content p {
                font-size: 0.95rem;
              }
            }
        
            @media (max-width: 480px) {
              .content h1 {
                font-size: 1.3rem;
              }
        
              .content a {
                font-size: 0.9rem;
              }
        
              .content .buttons button {
                padding: 8px 16px;
                font-size: 0.9rem;
                margin-bottom: 10px;
              }
            }