@font-face {
  font-family: 'antic';
  src: url("../fonts/AnticDidone-Regular.ttf") format("truetype"); }
p, h1, h2, h3, h4, h5, button, a, span {
  font-family: "antic" !important; }

.text-gold {
  color: #C36333; }

.selected-type {
  border-left: 2px solid black;
  padding-left: 8px; }

.cart-hover {
  position: relative; }

.cart-hover .cart-box {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.15);
  cursor: pointer; }

.cart-hover:hover .cart-box {
  display: flex; }

/* --- Layout Container --- */
.store-browser-container {
  width: 100%;
  margin: 0 auto; }

/* --- Heading Style --- */
.section-heading {
  /* Mimicking the elegant, spaced font from the screenshot */
  font-family: 'antic'; }

/* --- Category Grid (Responsive Flexbox) --- */
.category-grid {
  display: flex;
  flex-wrap: wrap;
  /* Allows items to stack on small screens */ }

.category-item {
  flex: 1 1 45%;
  /* Flex-grow, flex-shrink, flex-basis. Allows two items per row */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center; }

/* Adjust for mobile: make items full width */
@media (max-width: 768px) {
  .category-item {
    flex-basis: 100%;
    /* Items take full width on smaller screens */ } }
/* --- Image and Link Styles --- */
.image-link {
  display: block;
  width: 100%;
  overflow: hidden;
  margin-bottom: 24px;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
  /* Subtle shadow */
  transition: box-shadow 0.3s ease; }

.image-link:hover {
  box-shadow: 0 15px 20px rgba(0, 0, 0, 0.15); }

.category-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Ensures image covers the area without distortion */
  transition: transform 0.3s ease;
  /* Transition for hover effect */ }

/* Subtle Zoom effect on hover */
.image-link:hover .category-image {
  transform: scale(1.03); }

/* --- Caption Text Styles --- */
.category-caption {
  font-family: 'antic';
  color: #555;
  text-decoration: none;
  transition: color 0.2s ease; }

.category-caption:hover {
  color: #000; }

.jewels-section {
  padding-bottom: 100px;
  /* Vertical padding for the section */ }

.jewels-container {
  margin: 0 auto;
  padding: 0 0;
  /* Horizontal padding */
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  /* Space between columns */
  align-items: end; }

/* --- Image Styles --- */
.jewels-image-left,
.jewels-image-right {
  flex: 0 0 30%;
  /* Fixed width for images on desktop, adjust as needed */
  max-width: 30%;
  /* Ensures they don't grow too large */
  height: 600px;
  /* Fixed height for image containers */
  overflow: hidden; }

.jewels-image-right {
  height: 500px !important; }

.responsive-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Ensures image covers the area without distortion */
  display: block;
  /* Removes extra space below images */ }

/* --- Content Styles --- */
.jewels-content {
  flex: 1;
  /* Allows content to take remaining space */
  max-width: 40%;
  /* Limits content width on desktop */
  text-align: center; }

.jewels-heading {
  font-family: 'antic';
  font-size: 60px;
  /* Large heading size */
  font-weight: 400;
  margin-bottom: 30px;
  color: #333; }

.jewels-description {
  font-size: 16px;
  line-height: 1.6;
  color: #555;
  max-width: 500px;
  /* Limit paragraph width for readability */
  margin: 0 auto; }

/* --- Responsive Adjustments --- */
@media (max-width: 1024px) {
  .jewels-container {
    flex-direction: column;
    /* Stack columns on smaller screens */
    gap: 60px;
    /* More space when stacked */ }

  .jewels-image-left,
  .jewels-image-right {
    flex: 0 0 auto;
    /* Allow images to take natural width */
    max-width: 80%;
    /* Limit width of stacked images */
    height: auto;
    /* Allow height to adjust naturally */ }

  .jewels-content {
    max-width: 80%;
    /* Allow content to take more width */ }

  .jewels-heading {
    font-size: 48px;
    /* Adjust heading size for tablets */ } }
@media (max-width: 768px) {
  .jewels-section {
    padding: 60px 0; }

  .jewels-image-left,
  .jewels-image-right,
  .jewels-content {
    max-width: 100%;
    /* Full width on mobile */ }

  .jewels-heading {
    font-size: 40px;
    /* Adjust heading size for mobile */
    margin-bottom: 20px; }

  .jewels-description {
    font-size: 15px; } }
/* --- Banner Styling --- */
.banner-wrapper {
  padding: 50px 0;
  display: flex;
  justify-content: center; }

.signup-banner {
  width: 100%;
  background-color: #f5eee8;
  /* Pale, off-white background color */
  padding: 20px 30px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  /* Slight rounding, though the screenshot looks almost square */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  /* Subtle shadow */ }

.banner-content {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;
  /* Allows the content to take up the space */
  margin-right: 20px;
  column-gap: 2rem; }

.user-icon {
  width: 24px;
  height: 24px;
  color: #444;
  /* Dark gray color for the icon */
  margin-right: 15px;
  flex-shrink: 0;
  /* Prevents icon from shrinking */ }

.banner-text {
  font-size: 16px;
  color: #444;
  margin: 0;
  line-height: 1.5;
  display: flex; }

/* --- Button Styling --- */
.signup-button {
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  color: #444;
  background-color: transparent;
  padding: 10px 20px;
  border: 1px solid #999;
  /* Light gray border */
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
  flex-shrink: 0;
  /* Prevents button from shrinking */ }

.signup-button:hover {
  background-color: #ebe4df;
  /* Slightly darker on hover */
  border-color: #777; }

/* --- Responsive Adjustments --- */
@media (max-width: 768px) {
  .signup-banner {
    flex-direction: column;
    align-items: stretch;
    padding: 20px; }

  .banner-content {
    margin-bottom: 15px;
    margin-right: 0; }

  .signup-button {
    width: 100%; } }

/*# sourceMappingURL=style_web.css.map */