.hero-meta-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;

  color: white;
  padding: 0.5rem 1rem;

  font-size: 0.8rem;
  line-height: 1;
}

.hero-meta-left .schedule-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.meta-icon {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
}

.schedule-text {
  display: flex;
  gap: 0.4rem;
  color: white;
  font-size: 0.9rem;
}

.hero-meta-right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
}

.social-link img {
  width: 30px;
  height: 30px;
  display: block;
  opacity: 0.9;
  transition: opacity 150ms ease, transform 150ms ease;
}

.social-link:hover img {
  opacity: 1;
  transform: translateY(-1px);
}


/*THE NEW HERO IMAGE LOGIC, USING DOM CLASS PICTURE*/
.hero {
  position: relative;
  min-height: 75vh;
  width: 100%;

  display: flex;
  align-items: center;

  background: black;
  overflow: hidden;

  color: white;
}

/* New real image layer */
.hero-image img {
  position: absolute;

  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  width: 100%;
  height: 100%;

  inset: 0;

  object-fit: contain;          /* same visual logic as before */
  object-position: center center;
  pointer-events: none;
  user-select: none;

  z-index: 1;
}

/*MEDIA QUERY - TABLETS- PORTAIT*/
@media (min-width: 650px) {
  .hero {
    position: relative;
    width: 100%;
    overflow: visible;
    background: black;
    display: flex;
    align-items: center;
    min-height: 63vh;          /* key control */
         
  }

  .hero-image img {
    position: relative;
    inset: 0;

    width: 100%;
    height: auto;        /* key change */

    object-fit: contain; /* keep full image visible */
    object-position: center;

    z-index: 1;
    pointer-events: none;
    user-select: none;
  }

}

.hero-content-container {
  position: absolute;

  top: 11vh;
  left: 8vw;

  width: 40%;
  max-width: 600px;

  display: flex;
  flex-direction: column;
  gap: 1rem;
  /*FOR THE NEW PICTURE TIME HERO IMAGE*/ z-index: 2;
}

.location-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
}

.map-pin img {
  height: 2rem;
  width: auto;
  display: block;

  filter: brightness(0) invert(1);
}

.location-address,
.location-city {
  text-align: center;
}

.hero-CTA-text {
  font-size: 2rem;
  font-weight: 700;       
  text-align: center;
  margin:0;
  
}
.renuMEAT-font{
  font-family: "renuMEAT-logo-font";
}

.hero-content-text{
  font-size: 1rem;
  font-weight: 700;       
  text-align: center;
  margin:0;
}

.hero-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;

  width: 100%;
}

.button-link {
  display: block;
  width: 120px;
  background-color:rgb(207, 17, 17);
  /*background-color: #fd8802;*/
  color: rgb(243, 238, 238);
  text-decoration: none;

  font-size: 1.1rem;
  font-weight: 700;

  padding: 10px;
  border-radius: 5px;

  text-align: center;

  transition: background-color 0.05s ease, color 0.05s ease;
}

.button-link:hover {
  background-color: rgb(243, 238, 238);
  /*color: #fd8802;*/
  color:rgb(207, 17, 17);
}

.regular-content-section {
  padding: 0px 10px;
}

.regular-content-container {
  max-width: 98%;
  margin: 0;
  padding-left: 10px;
  color: white;
  text-align: left;
}

/* Title */
.regular-content-title {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 16px 0;
  color: white;
}

/* Body text */
.regular-content-text {
  font-size: 1.3rem;
  line-height: 1.7;
  margin: 0 0 18px 0;
  color: white;
  max-width: 98%;
}

.maps-section {
  padding: 60px 0;
  color: white;
}

/* Title styled to match your regular-content-title */
.maps-section-title {
  max-width: 98%;
  margin: 0 0 20px 0;
  padding-left: 20px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.2;
  color: white;
  text-align: left;
}

/* Centered image wrapper */
.maps-container {
  width: calc(100% - 20px);
  max-width: 680px;
  height: 230px;
  margin: 0 auto;
  border-radius: 18px;
  overflow: hidden;
}

/* Image behavior */
.maps-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  
}

.maps-button-wrapper {
  width: calc(100% - 20px);
  max-width: 680px;

  margin: 50px auto 0px;

  display: flex;
  justify-content: center;
}

.review-section {
  padding: 25px 0;
  color: white;
}

/* Title aligned like maps-section-title */
.review-title {
  max-width: 98%;
  margin: 0 0 20px 0;
  padding-left: 20px;

  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.2;

  text-align: left;
}

/* optional subtitle text */
.review-text {
  max-width: 98%;
  margin: 0 0 30px 0;
  padding-left: 20px;

  font-size: 1.3rem;
  line-height: 1.7;

  text-align: left;
}

/* button centered like maps container */
.review-button-wrapper {
  width: calc(100% - 20px);
  max-width: 680px;

  margin: 0 auto 50px;

  display: flex;
  justify-content: center;
}


/*MEDIA QUERY - HERO CONTENT - IPHONE SE*/

@media (max-width: 375px){

  .hero-CTA-text{
    font-size: 1.7rem;
  }

  .hero-content-container{
    top:8vh;
  }
}

/*MEDIA QUERY - HERO CONTENT - IPHONE SE LANDSCAPE*/

@media (min-width: 650px) and (max-height: 390px){

  .hero-content-container{
    top: 17vh;
  }

  .hero-CTA-text{
    font-size: 2.5rem;
  }

  .location-address,
  .location-city{
    font-size:1.4rem;
  }

  .button-link{
    width:150px;
    font-size:1.4rem;
  }
}

/* HERO CONTENT - TABLETS PORTAIT*/
@media (min-width: 650px) and (min-height: 950px){

  .hero-CTA-text{
    font-size: 3.3rem;
  }

  .hero-content-container{
    top: 5vh;
    width: 35%;
    padding-left: 25px;
  }

  .hero-content-text{
    font-size: 1.6rem;
  }

  .button-link{
    width:150px;
    font-size:1.4rem;
  }

}

/* HERO CONTENT - PHONE LANDSCAPE*/

@media (min-width: 650px) and (min-height: 390px) and (max-height: 500px){

  .hero-CTA-text{
    font-size: 3.3rem;
  }

  .hero-content-container{
    top: 10vh;
    width: 35%;
    padding-left: 25px;
  }

  .hero-content-text{
    font-size: 1.6rem;
  }

  .button-link{
    width:150px;
    font-size:1.4rem;
  }

}

/* HERO CONTENT - TABLET LANDSCAPE - TEMPORARY REMOVED, KEPT AS BACKUP

@media (min-width: 950px) and (max-height: 800px) {

  .hero-CTA-text{
    font-size: 2.5rem;
  }

  .location-address,
  .location-city{
    font-size:1.8rem;
  }

  .hero-content-container{
    top: 5vh;
    width: 30%;
    padding-left: 25px;
  }

  .hero-content-text{
    font-size: 1.6rem;
  }

  .button-link{
    width:180px;
    font-size:1.8rem;
  }

}
*/

/* HERO CONTENT - DESKTOP*/

@media (min-width: 950px) and (min-height: 700px){

  .hero-meta-bar {
    padding: 0.5rem 2rem;

    justify-content: space-between;

    max-width: 1800px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
  }

   .hero {
    display: flex;
    justify-content: center;
    align-items: center;

    overflow: hidden;

    background: black;

    padding: 2rem 0;
    position: relative;
  }

  .hero-image {
    width: min(99vw, 1800px);

    display: flex;
    justify-content: center;
    margin: 0 auto;
  }

  .hero-image img {
    width: 100%;
    height: auto;

    aspect-ratio: 2 / 1;

    max-height: 85vh;

    object-fit: contain;

    display: block;
  }

  .hero-content-container {
    position: absolute;
    top: 10vh;

    left: 50%;

    transform:
      translateX(-50%)
      translateX(clamp(-22rem, -18vw, -6rem));

    width: 30%;
  }

  .button-link{
    width:180px;
    font-size:1.8rem;
  }

.regular-content-section {
    padding: 5rem 2rem;
  }

  .regular-content-container {
    width: min(88vw, 1800px);
    margin: 0 auto;
    padding: 0;
    text-align: left;
  }

  .regular-content-title {
    font-size: 2.5rem;
    text-align: center;
    margin: 0 0 2.5rem 0;
    line-height: 1.15;
  }

  .regular-content-text {
    font-size: 1.45rem;
    line-height: 1.8;
    max-width: 75ch;
    margin: 0 auto 4rem auto;
  }

  .maps-section {
    padding: 0rem 2rem;
  }

  .maps-section-title {
    width: min(88vw, 1100px);
    margin: 0 auto 2.5rem auto;
    padding: 0;

    font-size: 2.5rem;
    line-height: 1.15;

    text-align: center;
  }
  
  
  .review-section {
    padding: 5rem 2rem;
  }

  .review-title {
    max-width: 1100px;
    margin: 0 auto 2rem auto;

    padding-left: 0;

    font-size: 2.5rem;
    line-height: 1.15;

    text-align: center;
  }

  .review-text {
    max-width: 75ch;
    margin: 0 auto 2.5rem auto;

    padding-left: 0;

    font-size: 1.45rem;
    line-height: 1.8;

    text-align: center;
  }

  .review-button-wrapper {
    width: min(1100px, 88vw);
    margin: 0 auto;

    display: flex;
    justify-content: center;
  }

}