/* top thin Banner CSS */ 

.promo-banner {
    width: 100%;
    box-sizing: border-box;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

  .promo-inner {
    max-width: 100%;
    margin: 0 auto;
    background: #A81D34;
    color: #ffffff;
    padding: 2px 14px 6px;
    text-align: center;
  }

  .promo-header {
    margin: 0 0 2px;
  }
    
    .promo-header-text {
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 0 2px;
  }

  .promo-subheader {
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    margin: 0 0 0px;
  }

  /* Optional tweak for very small screens */
  @media (max-width: 480px) {
    .promo-header {
      font-size: 1.6rem;
    }
    .promo-subheader {
      font-size: 0.85rem;
    }
  }


/* homepage banner 2 to 1 column CSS */

    .homepage-promo-row {
      display: flex;
      gap: 0px;         /* space between columns */
      background-color: #ac233b;
      margin-bottom: 16px;
    }

    .homepage-promo-column {
      flex: 1;             /* each column takes equal space */
      box-sizing: border-box;
      padding: 0;
      background: #fff;
      border: 0px solid #ddd;
      border-radius: 4px;
      text-align: center;
    }

    /* On small screens, stack into one column */
    @media (max-width: 600px) {
      .homepage-promo-row {
        flex-direction: column;
      }
    }


    /* BLACK FRIDAY CSS Nov 24 2025 */

  .BF-top-promo-banner {
    width: 100%;
    background: #26231f;
    color: #ffffff;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    box-sizing: border-box;
  }

  .BF-top-promo-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
  }

  .BF-promo-col {
    padding: 12px 16px;
    box-sizing: border-box;
  }

  .BF-promo-col + .BF-promo-col {
    border-top: 1px solid rgba(255,255,255,0.15);
  }

  .line1 {
    display: block;
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
  }

  .line2 {
    display: block;
    font-weight: 400;
    font-size: 0.9rem;
    margin-top: 2px;
  }

  .BF-promo-link {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    margin-left: 6px;
  }

  /* Desktop layout */
  @media (min-width: 768px) {
    .BF-top-promo-inner {
      grid-template-columns: 1fr 1fr;
    }

    .BF-promo-col + .BF-promo-col {
      border-top: none;
      border-left: 1px solid rgba(255,255,255,0.15);
    }
  }


  .BF-promo-banner {
    width: 100%;
    margin: 0;
    padding: 0;
    background-image: url("https://www.pennstateind.com/mm5/images/banners/2025-Cyber-Monday-Sale/chevron-bkgrd.webp");
    background-size: 75% auto;
  }

  .BF-promo-banner picture,
  .BF-promo-banner img {
    display: block;
    width: 100%;
    height: auto;
    border: 0;
  }
    
    
     /* On small screens, stack into one column */
    @media (max-width: 768px) {
      .BF-promo-banner {
        background-size: 100% auto;
      }
    }