/* =========================================================
   PROMOTIONS PAGE
========================================================= */

/* Hero */

.promo-hero{
    position:relative;
    height:420px;
    background:url("images/promotions-banner.jpg") center/cover no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    overflow:hidden;
}

.promo-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(rgba(26,42,41,.88),rgba(26,42,41,.88));
}

.promo-content{
    position:relative;
    z-index:2;
    color:white;
    width:90%;
    max-width:900px;
}

.promo-label{
    color:#D9C8A1;
    letter-spacing:4px;
    font-size:14px;
    font-weight:600;
    margin-bottom:18px;
}

.promo-content h1{
    font-size:58px;
    margin-bottom:25px;
    font-weight:700;
}

.promo-content p{
    font-size:22px;
    line-height:1.8;
    color:#F2F2F2;
}

/* Section Title */

.promo-title{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:25px;
    padding:70px 0 50px;
    background:#F7F4ED;
}

.promo-title span{
    width:140px;
    height:2px;
    background:#D7C9A5;
}

.promo-title h2{
    color:#2a5336;
    font-size:34px;
    letter-spacing:2px;
}

/* Grid */

.promotion-grid{
    width:90%;
    max-width:1400px;
    margin:auto;

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:35px;

    padding-bottom:60px;
}

/* Card */

.promotion-card{

    background:#fff;

    border-radius:14px;

    overflow:hidden;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    transition:.35s;
}

.promotion-card:hover{

    transform:translateY(-12px);

    box-shadow:0 18px 45px rgba(0,0,0,.18);

}

/* Image */

.promotion-image{

    height:240px;

    background:#ddd;

    background-size:cover;

    background-position:center;

}

/* Replace later with your own images */

.promotion-card:nth-child(1) .promotion-image{
background-image:url("images/promo1.jpg");
}

.promotion-card:nth-child(2) .promotion-image{
background-image:url("images/promo2.jpg");
}

.promotion-card:nth-child(3) .promotion-image{
background-image:url("images/promo3.jpg");
}

.promotion-card:nth-child(4) .promotion-image{
background-image:url("images/promo4.jpg");
}

.promotion-card:nth-child(5) .promotion-image{
background-image:url("images/promo5.jpg");
}

.promotion-card:nth-child(6) .promotion-image{
background-image:url("images/promo6.jpg");
}

.promotion-card:nth-child(7) .promotion-image{
background-image:url("images/promo7.jpg");
}

.promotion-card:nth-child(8) .promotion-image{
background-image:url("images/promo8.jpg");
}

/* Text */

.promotion-card h3{

    color:#1A2A29;

    font-size:30px;

    margin-top:30px;

    text-align:center;
}

.promotion-card h4{

    font-size:22px;

    margin-top:10px;

    color:#222;

    text-align:center;
}

.promotion-card p{

    padding:25px 30px;

    color:#666;

    line-height:1.8;

    min-height:120px;

    text-align:center;
}

/* Button */

.promotion-card a{

    display:block;

    width:190px;

    margin:0 auto 35px;

    padding:16px;

    text-align:center;

    border-radius:8px;

    background:#1A2A29;

    color:white;

    font-weight:bold;

    transition:.3s;

}

.promotion-card a:hover{

    background:#D9C8A1;

    color:#1A2A29;

}

/* Bottom Button */

.promotion-button{

    text-align:center;

    padding-bottom:80px;

    background:#F7F4ED;
}

.promotion-button a{

    display:inline-block;

    background:#1A2A29;

    color:white;

    padding:20px 60px;

    font-size:18px;

    border-radius:8px;

    transition:.3s;
}

.promotion-button a:hover{

    background:#D9C8A1;

    color:#1A2A29;

}

/* Responsive */

@media(max-width:1200px){

.promotion-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.promo-content h1{

font-size:42px;

}

.promo-content p{

font-size:18px;

}

.promo-title{

flex-direction:column;

gap:15px;

}

.promo-title span{

width:70px;

}

.promotion-grid{

grid-template-columns:1fr;

}

}












/* WEEKLY PROMOTIONS SECTION 

.catalogue-section {
  background: #f7f4ed;
  padding: 60px 5% 80px;
}*/

/* Top decorative heading 
.catalogue-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  margin-bottom: 110px;
}

.catalogue-heading::before,
.catalogue-heading::after {
  content: "";
  width: 150px;
  height: 2px;
  background: #d8cba9;
}

.catalogue-heading h1 {
  color: #1A2A29;
  font-size: 38px;
  font-weight: 800;
  letter-spacing: 2px;
  text-align: center;
  margin: 0;
} */

/* Section introduction 
.catalogue-intro {
  text-align: center;
  margin: 0 auto 50px;
}

.catalogue-intro h2 {
  color: #1A2A29;
  font-size: 32px;
  margin-bottom: 15px;
}

.catalogue-intro p {
  color: #1A2A29;
  font-size: 17px;
  line-height: 1.6;
}*/

/* Main catalogue card 
.catalogue-card {
  max-width: 1060px;
  margin: 0 auto;
  padding: 35px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.07);

  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  align-items: center;
  gap: 45px;
}*/

/* Catalogue cover 
.catalogue-image-box {
  width: 100%;
}

.catalogue-cover {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center;
  border-radius: 8px;
}*/

/* Catalogue information 
.catalogue-info {
  color: #1A2A29;
}

.catalogue-info h2 {
  font-size: 32px;
  line-height: 1.3;
  margin: 0 0 20px;
}

.catalogue-info p {
  font-size: 18px;
  line-height: 1.7;
  margin: 0 0 30px;
}*/

/* View catalogue button 
.catalogue-button {
  display: inline-block;
  background: #1A2A29;
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 700;
  padding: 20px 35px;
  border-radius: 6px;
  transition: background 0.2s ease;
}

.catalogue-button:hover {
  background: #304744;
}*/

/* Download link 
.catalogue-download {
  display: block;
  width: fit-content;
  margin-top: 18px;
  color: #1A2A29;
  font-size: 16px;
  text-decoration: underline;
}*/

/* TABLET 
@media (max-width: 1024px) {
  .catalogue-section {
    padding: 50px 5% 65px;
  }

  .catalogue-heading {
    margin-bottom: 75px;
    gap: 20px;
  }

  .catalogue-heading h1 {
    font-size: 30px;
  }

  .catalogue-heading::before,
  .catalogue-heading::after {
    width: 80px;
  }

  .catalogue-card {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 30px;
    padding: 25px;
  }

  .catalogue-info h2 {
    font-size: 27px;
  }

  .catalogue-info p {
    font-size: 16px;
  }
}*/

/* MOBILE 
@media (max-width: 600px) {
  .catalogue-section {
    padding: 35px 18px 50px;
  }

  .catalogue-heading {
    gap: 10px;
    margin-bottom: 55px;
  }

  .catalogue-heading h1 {
    font-size: 21px;
    letter-spacing: 1px;
  }

  .catalogue-heading::before,
  .catalogue-heading::after {
    width: 25px;
  }

  .catalogue-intro {
    margin-bottom: 30px;
  }

  .catalogue-intro h2 {
    font-size: 26px;
  }

  .catalogue-intro p {
    font-size: 15px;
  }

  .catalogue-card {
    grid-template-columns: 1fr;
    gap: 25px;
    padding: 20px;
    text-align: center;
  }

  .catalogue-image-box {
    max-width: 280px;
    margin: 0 auto;
  }

  .catalogue-info h2 {
    font-size: 25px;
  }

  .catalogue-info p {
    font-size: 15px;
  }

  .catalogue-button {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 17px 15px;
  }

  .catalogue-download {
    margin: 18px auto 0;
  }
}*/


/* WEEKLY PROMOTIONS */

.weekly-promotions {
  background: #f7f4ed;
  border-radius: 18px;
  padding: 25px 20px 20px;
  text-align: center;
  color: #1A2A29;
}

/* Green label */

.promotion-label {
  display: inline-block;
  background: #e0ead9;
  color: #397e40;
  padding: 8px 15px;
  border-radius: 25px;
  font-size: 16px;
  letter-spacing: 0.5px;
  margin-bottom: 22px;
}

/* Main heading */

.weekly-promotions h1 {
  font-size: 35px;
  font-weight: 800;
  line-height: 1.15;
  margin: 0 0 25px;
  color: #1A2A29;
}

/* Subtitle */

.promotion-subtitle {
  font-size: 20px;
  line-height: 1.5;
  margin: 0 auto 25px;
  max-width: 850px;
  color: #1A2A29;
}

/* Centered catalogue card */

.catalogue-card {
  width: 100%;
  max-width: 556px;
  margin: 0 auto;
  padding: 20px;
  box-sizing: border-box;
  background: #01250055;
  border-radius: 17px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: center;
}

/* Portrait catalogue cover */

.catalogue-preview {
  width: 100%;
  aspect-ratio: 3 / 4;
  background: #e4dfd2;
  border-radius: 13px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.catalogue-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Description below cover */

.catalogue-description {
  color: #1A2A29;
  font-size: 22px;
  line-height: 1.5;
  margin: 15px 0;
}

/* Main catalogue button */

.catalogue-button {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: #1A2A29;
  color: #ffffff;
  text-decoration: none;
  text-align: center;
  font-size: 23px;
  font-weight: 700;
  letter-spacing: 0.5px;
  padding: 25px 15px;
  border-radius: 13px;
  transition: background 0.2s ease;
}

.catalogue-button:hover {
  background: #2d4541;
}

/* PDF links */

.catalogue-links {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 15px;
  padding-bottom: 0;
  color: #1A2A29;
  font-size: 19px;
}

.catalogue-links a {
  color: #1A2A29;
  text-decoration: underline;
}

.catalogue-links a:hover {
  color: #397e40;
}

.link-dot {
  color: #1A2A29;
}

/* TABLET */

@media (max-width: 1024px) {
  .weekly-promotions {
    padding: 25px 18px 20px;
  }

  .weekly-promotions h1 {
    font-size: 44px;
  }

  .promotion-subtitle {
    font-size: 18px;
  }

  .catalogue-card {
    max-width: 520px;
  }

  .catalogue-description {
    font-size: 20px;
  }

  .catalogue-button {
    font-size: 21px;
    padding: 23px 15px;
  }
}

/* MOBILE */

@media (max-width: 600px) {
  .weekly-promotions {
    padding: 22px 12px 15px;
    border-radius: 12px;
  }

  .promotion-label {
    font-size: 13px;
    padding: 7px 12px;
    margin-bottom: 18px;
  }

  .weekly-promotions h1 {
    font-size: 32px;
    margin-bottom: 15px;
  }

  .promotion-subtitle {
    font-size: 15px;
    margin-bottom: 22px;
  }

  .catalogue-card {
    max-width: 100%;
    padding: 12px;
    border-radius: 14px;
  }

  .catalogue-preview {
    aspect-ratio: 3 / 4;
    border-radius: 10px;
  }

  .catalogue-description {
    font-size: 17px;
    margin: 14px 0;
  }

  .catalogue-button {
    font-size: 19px;
    padding: 20px 12px;
    border-radius: 10px;
  }

  .catalogue-links {
    font-size: 15px;
    gap: 7px;
    margin-top: 13px;
  }
}

/* TOP DECORATIVE TITLE */

.weekly-top-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  margin: 0 auto 35px;
  width: 100%;
}

.weekly-top-title::before,
.weekly-top-title::after {
  content: "";
  height: 2px;
  width: 150px;
  background: #d8cba9;
}

.weekly-top-title span {
  color: #1A2A29;
  font-size: 50px;
  font-weight: 800;
  letter-spacing: 2px;
  text-align: center;
}

/* TABLET */
@media (max-width: 1024px) {
  .weekly-top-title {
    gap: 15px;
    margin-bottom: 30px;
  }

  .weekly-top-title::before,
  .weekly-top-title::after {
    width: 75px;
  }

  .weekly-top-title span {
    font-size: 29px;
  }
}

/* MOBILE */
@media (max-width: 600px) {
  .weekly-top-title {
    gap: 8px;
    margin-bottom: 25px;
  }

  .weekly-top-title::before,
  .weekly-top-title::after {
    width: 20px;
  }

  .weekly-top-title span {
    font-size: 19px;
    letter-spacing: 1px;
  }
}