/*OVERRIDE*/

  /* Overides of styles.css gives more space on asset page for images*/

  .container {

      max-width: 1920px;

  }



  /*OVERRIDE*/

  /*reduced by 40px to accomodate for padding when container is extended from above style*/

  .header-container {

      max-width: 1400px;

  }



  .portfolio-column-container {

      /*max-width: 1920px;*/

      width: 100%;

      margin: 0 auto;

      display: flex;

      flex-direction: column;

      gap: 20px;

      margin-top: 25px;

      /*I ADDED*/

  }



  .portfolio-column-item-split-column {

      width: 100%;

      display: flex;

      gap: 20px;

  }



  .portfolio-column-item-split-column.single {

      justify-content: center;

  }



  .portfolio-column-item-split-column.double {

      justify-content: center;

  }



  /* Image styling with aspect ratio scaling */

  .portfolio-column-image {

      border-radius: 6px;

      /*I EDITED*/

      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);

      /*I EDITED*/

      transition: transform 0.3s ease, box-shadow 0.3s ease;

      object-fit: cover;



      /* KEY: Force width and maintain aspect ratio */

      /*aspect-ratio: 16/9;*/

      display: block;

      /* Removes any inline spacing issues */

  }



  /* Single image takes full width */

  .single .portfolio-column-image {

      width: 100%;

  }



  /* Double images split the width equally */

  .double .portfolio-column-image {

      width: calc(50% - 10px);

      /* Account for 20px gap between images */

  }



  /* Mobile: Stack double images vertically */

  @media (max-width: 714px) {

      body {

          padding: 20px;

      }



      footer {

          padding-bottom: 30px;

      }



      .portfolio-column-container {

          gap: 15px;

      }



      .portfolio-column-item-split-column.double {

          flex-direction: column !important;

          gap: 15px;

      }



      .portfolio-column-item-split-column.double .portfolio-column-image {

          width: 100% !important;

          /* Full width when stacked */

      }

  }