.aniston-av-banner {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.aniston-av-slideshow {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 35%;
  min-height: 200px;
}
.aniston-av-slide {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}
.aniston-av-slide.active {
  opacity: 1;
  z-index: 1;
}
.aniston-av-slide img {
  width: 100%;
  object-fit: cover;
}
.aniston-av-slide-content {
  position: absolute;
  bottom: 10%;
  left: 5%;
  width: 50%;
  color: black;
  text-align: left;
}
.aniston-av-slide-content p {
  margin: 0 0 15px;
  font-size: 2rem;
  font-weight: 300;
}
.aniston-av-button {
  background-color: black;
  color: white;
  border: 2px solid black;
  padding: 10px 20px;
  font-size: 1rem;
  cursor: pointer;
  border-radius: 20px;
  text-decoration: none;
  transition: all 0.3s ease;
  display: inline-block;
}
.aniston-av-button:hover {
  background-color: transparent;
  color: black;
}

.anistonproducts-product-grid {
  display: grid;
  grid-template-columns: repeat(
    auto-fit,
    minmax(250px, 1fr)
  ); /* Default grid layout */
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
}
.anistonproducts-product-card {
  background-color: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.anistonproducts-product-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}
.anistonproducts-product-card img {
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}
.anistonproducts-product-card:hover img {
  transform: scale(1.1);
}
.anistonproducts-badge {
  position: absolute;
  background-color: black;
  color: white;
  padding: 5px 10px;
  font-size: 0.8rem;
  top: 10px;
  left: 10px;
  border-radius: 4px;
  z-index: 10;
}
.anistonproducts-product-info {
  padding: 15px;
  text-align: center;
}
.anistonproducts-product-info h3 {
  all: unset;

  color: #333;
  font-size: 1.3rem;
  margin: 0;
}
.anistonproducts-product-info p {
  margin: 10px 0 0;
  font-size: 0.8rem;
}
.anistonproducts-original-price {
  text-decoration: line-through;
  color: #888;
  font-size: 0.8rem;
}
.anistonproducts-discount-price {
  color: #e60023;
  font-weight: bold;
  font-size: 1rem;
}

/* Section styling */
.anistonavcompany-media-section {
  display: flex;
  width: 100%;
  height:100vh;
  max-height: 600px; 
  margin: 0 auto; /* Center the section horizontally */
  gap: 10px;
  /* box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); */
  position: relative;
  overflow: hidden;
  justify-content: space-between; /* Distribute space evenly between left and right */
  padding-right: 10px;
  padding-left: 10px;
}
/* Left container */
.anistonavcompany-left-container,
.anistonavcompany-right-container {
  flex: 1;
  display: flex;
  align-items: center; /* Center the content vertically */
  justify-content: center; /* Center the content horizontally */
  position: relative;
  padding: 20px;
}
/* Left container specific */
.anistonavcompany-left-container {
  background: #fff;
}
/* Video styles */
.anistonavcompany-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 5px;
}
/* Right container */
.anistonavcompany-right-container {
  background-color: #fff;
}
/* Image styles */
.anistonavcompany-right-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 5px;
}
.anistonavcompany-overlay-text {
  position: absolute; /* Ensure it's positioned relative to its container */
  bottom: 0; /* Align to the top */
  left: 0; /* Align to the left */
  color: #fff;
  text-align: left;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start; /* Align items at the start (top) */
  align-items: flex-start; /* Align items to the left */
  padding: 20px; /* Optional: Add padding for some space around the text */
  gap: 5px;
}
/* Text and button styling */
.anistonavcompany-overlay-text p.anistonavcompany-paragraph {
  font-weight: 100;
  font-family: "Avenir55Roman", sans-serif;
}
.anistonavcompany-overlay-text h2.anistonavcompany-heading {
  font-size: 1.5rem;
  font-weight: 100;
  font-family: "Avenir55Roman", sans-serif;
}
.anistonavcompany-overlay-text a.anistonavcompany-btn {
  display: inline-block;
  padding: 10px 20px;
  font-size: 1rem;
  font-weight: 100;
  color: #000;
  background-color: #fff;
  text-decoration: none;
  border-radius: 20px;
  transition: all 0.3s ease;
  font-weight: 100;
  font-family: "Avenir55Roman", sans-serif;
}
.anistonavcompany-overlay-text a.anistonavcompany-btn:hover {
  background-color: #000;
  color: #fff;
}
.anistonavcompany-left-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25); /* Black with transparency */
  z-index: 1;
  border-radius: 5px;
}
.anistonavcompany-right-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25); /* Black with transparency */
  z-index: 1;
  border-radius: 5px;
}
.aniston-home-category {
  display: block; /* Ensures the whole box is clickable */
  text-decoration: none; /* Removes underline from links */
}
.aniston-home-section {
  text-align: center;
  padding: 50px 20px;
}
.aniston-home-section h1 {
  font-size: 36px;
  font-weight: 100;
  margin-bottom: 40px;
  color: #000;
  text-transform: none; /* Ensure text is displayed as written */
  font-family: "Avenir55Roman", sans-serif;
}
.anistonproducts-popular-products {
  padding: 20px;
  text-align: center;
  margin-top: 40px;
}

.aniston-home-categories {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}
.aniston-home-category {
  position: relative;
  overflow: hidden;
  width: calc(100% / 4 - 20px);
  max-width: 300px;
  border-radius: 10px;
  text-align: center;
  background-color: transparent;
  transition: background-image 0.3s ease;
}
.category-image-container {
  position: relative;
  width: 100%;
  height: 400px; /* Set a fixed height */
  overflow: hidden;
  border-radius: 10px;
}
.category-image {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensure the image fits the container without stretching */
  border-radius: 10px;
  transition: opacity 0.3s ease;
}
.aniston-home-category .aniston-home-name {
  margin-top: 10px;
  font-size: 16px;
  color: #000;
  background-color: transparent;
  font-family: "Avenir55Roman", sans-serif;
}
/* Hover effect */
.aniston-home-category:hover .category-image {
  opacity: 0;
}

.anistonsectionnew {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
  height: 100vh; /* Adjust the height for responsiveness */
  margin-top: 40px;
  max-height: 600px;
}
.anistonsectionnew .text-content {
  width: 30%;
  padding-right: 10px;
  margin-top: -60px;
  flex-direction: column;
}
/* Specific styles for h1 */
.anistonsectionnew .text-content h1 {
  font-size: 32px;
  color: #333;
  font-weight: 100;
  font-family: "Avenir55Roman", sans-serif;
}
/* Specific styles for p */
.anistonsectionnew .text-content p {
  margin-top: 20px;
  font-size: 16px;
  color: #555;
  font-weight: 100;
  font-family: "Avenir55Roman", sans-serif;
}
.anistonsectionnew .image-content {
  position: relative;
  width: 55%;
  height: 100%;
}
.anistonsectionnew .image-left {
  width: 80%;
  height: auto;
  border-radius: 10px;
  float: right; /* Aligns the image to the right */
  margin-left: auto; /* Ensures it's on the right side */
  margin-right: 0; /* Optional, ensures no margin on the right */
}
.anistonsectionnew .image-right {
  position: absolute;
  top: 10%;
  left: -20%;
  width: 60%;
  height: auto;
  border-radius: 10px;
  transition: transform 0.3s ease;
}
/* Hover Effect */
.anistonsectionnew .image-content:hover .image-right {
  transform: scale(1.05); /* Slight zoom effect */
}

.aniston-header h2,
.aniston-header p {
  text-align: center;
}

/* About Section Styling */
.aniston-about-section {
  padding: 30px 0;
}
/* Container Layout */
.aniston-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap; 
  padding: 0 15px; 
}
/* Left and Right Content Styling */
.aniston-left-content,
.aniston-right-content {
  width: 48%; /* Ensure each content takes up 48% of the container width */
  margin-bottom: 20px; /* Spacing between content */
}
/* Image Styling */
.aniston-left-content img,
.aniston-right-content img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
  margin: 15px 0; /* Add consistent spacing below images */
}
/* Heading Styling */
.aniston-h2 {
  font-size: 24px;
  font-weight: 100;
  margin-top: 10px;
  font-family: "Avenir55Roman", sans-serif;
  text-transform: none;
}
/* Paragraph Styling */
.aniston-p {
  font-size: 16px;
  color: #666;
  text-align: left;
  line-height: 1.5; /* More consistent line spacing */
}
/* Right Content Heading Adjustments */
.aniston-right-content h2 {
  font-size: 22px;
}

@media (max-width: 1024px) {
  .anistonsectionnew {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: auto;
  }
  .anistonsectionnew .text-content {
    width: 80%;
    text-align: center;
    margin-bottom: 20px;
  }
  .anistonsectionnew .text-content h1 {
    font-size: 2em;
  }
  .anistonsectionnew .text-content p {
    font-size: 1em;
  }
  .anistonsectionnew .image-content {
    width: 80%;
    text-align: center;
  }
  .anistonsectionnew .image-right {
    position: relative;
    top: 0;
    left: 0;
    width: 60%;
    margin-top: -300px;
    transform: none; /* Remove overlapping effect */
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .aniston-home-section h1 {
    font-size: 28px;
  }

  .aniston-home-category {
    width: calc(100% / 2 - 20px);
  }
  .aniston-av-slide-content p {
    font-size: 1rem;
  }
  .aniston-av-button {
    padding: 6px 12px;
    font-size: 0.8rem;
  }
  .anistonproducts-product-grid {
    grid-template-columns: repeat(2, 1fr); /* Two items per row on mobile */
  }
  
  .anistonavcompany-media-section {
    flex-direction: column; /* Switch to column layout for smaller screens */
    height: 50vh; /* Adjust height based on content */
    margin: 0; /* Remove default margin */
    padding: 0; /* Remove any default padding */
    justify-content: center; /* Center content horizontally */
  }
  .anistonavcompany-left-container,
  .anistonavcompany-right-container {
    padding: 10px; /* Add padding inside the containers */
    margin: 0; /* Ensure no additional margin */
    width: 100%; /* Ensure containers take full width in column layout */
    position: relative; /* Ensure relative positioning for absolute children */
  }

  /* Centering adjustments */
  .anistonavcompany-media-section {
    margin: 0 auto; /* Center the section horizontally */
    padding-left: 10px;
    padding-right: 10px;
  }
  .anistonavcompany-overlay-text p.anistonavcompany-paragraph {
    font-size: 1rem; /* Adjust font size */
  }
  .anistonavcompany-overlay-text h2.anistonavcompany-heading {
    font-size: 1rem; /* Adjust heading size */
    line-height: 2;
    margin: 0;
  }
  .anistonavcompany-overlay-text a.anistonavcompany-btn {
    font-size: 0.8rem; /* Adjust button text size */
    padding: 5px 8px;
  }

  .anistonsectionnew .text-content {
    width: 90%;
    text-align: center;
  }
  .anistonsectionnew .text-content h1 {
    font-size: 1.5em;
  }
  .anistonsectionnew .text-content p {
    font-size: 0.7em;
  }
  .anistonsectionnew .image-content {
    width: 100%;
    text-align: center;
  }
  .anistonsectionnew .image-left,
  .anistonsectionnew .image-right {
    width: 70%;
    margin-top: 20px;
    left: 0;
    right: 0;
    transform: none; /* Remove overlap */
  }
  /* Container Layout Adjustment */
  .aniston-container {
    flex-direction: column;
    padding: 0 10px; 
    justify-content: center; 
    align-items:center;
  }
  /* Left and Right Content Adjustments */
  .aniston-left-content,
  .aniston-right-content {
    width: 100%; 
    margin-bottom: 20px; 
  }
  
  /* Heading Adjustments for Both Left and Right Content */
  .aniston-left-content h4,
  .aniston-right-content h4 {
    font-size:20px;
    margin:0;
  }
 
}

@media (max-width: 480px) {
  .aniston-home-section h1 {
    font-size: 24px;
  }

  .aniston-av-slide-content {
    left: 0;
    text-align: center;
    width: 100%;
  }
  .aniston-av-slide-content p {
    font-size: 1.5rem;
    margin-bottom: 5px;
  }
  .aniston-av-button {
    padding: 6px 10px;
    font-size: 1rem;
  }

  .anistonsectionnew .text-content {
    width: 100%;
    padding-right: 0;
    text-align: center;
  }
  .anistonsectionnew .text-content h1 {
    font-size: 1.5em;
  }
  .anistonsectionnew .text-content p {
    font-size: 0.7em;
  }
  .anistonsectionnew .image-content {
    width: 100%;
    text-align: center;
  }
  .anistonsectionnew .image-left {
    width: 100%;
    height: 50%;
    margin-top: 20px;
    left: 0;
    right: 0;
    transform: none; /* Ensure no overlap on smaller screens */
  }
  .anistonsectionnew .image-right {
    width: 100%;
    margin-top: -180px;
    left: 0;
    right: 0;
    transform: none; /* Ensure no overlap on smaller screens */
  }

  .aniston-home-category {
    width: calc(100% / 2 - 20px);
    height: 260px; /* Increase the height of the category for mobile */
    position: relative; /* Ensure positioning is correct for the text */
  }
  .category-image-container {
    height: 200px; /* Adjust the image container height */
  }
  .category-image {
    height: 100%; /* Ensure the image fits inside the container */
    width: 100%;
  }
  .aniston-home-name {
    font-size: 12px; /* Make the text slightly larger */
    position: absolute; /* Position the text on top of the image */
    bottom: 10px; /* Add space from the bottom */
    left: 0;
    right: 0;
    color: #fff; /* Ensure the text is visible with a contrasting color */
    background-color: rgba(
      0,
      0,
      0,
      0.5
    ); /* Add a dark background for better contrast */
    padding: 5px 0;
    text-align: center;
    font-weight: 100;
  }
}
