/* ============================================================
   LIZABEELA Home Page
   Hero, Collections, Featured, Bulk Pricing,
   New Arrivals, Testimonials, Brand Story, Blog
   ============================================================ */

/* ── Hero Section ── */

.lzb-hero {
  position: relative;
  min-height: 600px;
  height: 813px;
  display: flex;
  align-items: center;
  overflow: hidden;
  /* Fallback gradient when no image is set */
  background: linear-gradient(
    135deg,
    #2e2e2e 0%,
    #3d3733 30%,
    #5c4a45 60%,
    #2e2e2e 100%
  );
}

.lzb-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.lzb-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lzb-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    var(--color-overlay) 0%,
    var(--color-overlay-light) 60%,
    rgba(0, 0, 0, 0) 100%
  );
}

.lzb-hero__content {
  position: relative;
  z-index: 1;
  max-width: var(--container-wide);
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--space-2xl);
  padding-top: 118px; /* Account for header offset */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.lzb-hero__label {
  font-family: var(--font-body);
  font-size: var(--fs-label);
  font-weight: var(--fw-normal);
  text-transform: uppercase;
  letter-spacing: var(--ls-label-wide);
  color: rgba(255, 253, 251, 0.65);
  margin-bottom: var(--space-lg);
}

.lzb-hero__heading {
  max-width: 576px;
  margin-bottom: var(--space-lg);
}

.lzb-hero__heading h1 {
  font-family: var(--font-heading);
  font-size: var(--fs-h1);
  font-weight: var(--fw-normal);
  line-height: 1.08;
  color: var(--color-text-on-dark);
}

.lzb-hero__heading h1 em,
.lzb-hero__heading h1 i {
  font-style: italic;
}

.lzb-hero__desc {
  max-width: 384px;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-light);
  line-height: var(--lh-body);
  color: rgba(255, 253, 251, 0.75);
  margin-bottom: var(--space-xl);
}

.lzb-hero__actions {
  display: flex;
  gap: var(--space-md);
  flex-wrap: wrap;
}

.lzb-hero__scroll {
  position: absolute;
  bottom: var(--space-xl);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  opacity: 0.5;
  z-index: 1;
}

.lzb-hero__scroll-line {
  width: 1px;
  height: 48px;
  background-color: var(--color-text-on-dark);
  opacity: 0.78;
}

.lzb-hero__scroll-text {
  font-size: var(--fs-label);
  text-transform: uppercase;
  letter-spacing: var(--ls-label);
  color: var(--color-text-on-dark);
}

/* ── Collections Grid ── */

.lzb-home-collections {
  padding-block: var(--section-padding-y);
}

.lzb-home-collections__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-lg);
  padding-top: var(--space-2xl);
}

@media (min-width: 768px) {
  .lzb-home-collections__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .lzb-home-collections__grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* ── Featured Pieces ── */

.lzb-home-featured {
  background-color: var(--color-secondary-bg);
  padding-block: var(--section-padding-y);
}

.lzb-home-featured__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
  padding-top: var(--space-2xl);
}

@media (min-width: 768px) {
  .lzb-home-featured__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .lzb-home-featured__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ── Bulk Pricing Bar ── */

.lzb-home-pricing {
  background-color: var(--color-secondary-bg);
  padding-top: var(--space-2xl);
}

.lzb-home-pricing__bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xl);
  background-color: var(--color-primary-white);
  padding: var(--space-xl);
  flex-wrap: wrap;
}

.lzb-home-pricing__tier {
  text-align: center;
}

.lzb-home-pricing__tier-label {
  font-size: var(--fs-label);
  font-weight: var(--fw-normal);
  text-transform: uppercase;
  letter-spacing: var(--ls-label);
  color: var(--color-muted-taupe);
  margin-bottom: var(--space-2xs);
}

.lzb-home-pricing__tier-price {
  font-family: var(--font-heading);
  font-size: var(--fs-price-lg);
  font-weight: var(--fw-normal);
  line-height: 1.33;
  color: var(--color-text-primary);
}

.lzb-home-pricing__tier-save {
  font-size: var(--fs-label);
  font-weight: var(--fw-normal);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--color-accent);
  margin-top: var(--space-2xs);
}

.lzb-home-pricing__divider {
  width: 1px;
  height: 48px;
  background-color: rgba(46, 46, 46, 0.1);
}

/* ── New Arrivals ── */

.lzb-home-new {
  padding-block: var(--section-padding-y);
}

.lzb-home-new__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
  padding-top: var(--space-2xl);
}

@media (min-width: 768px) {
  .lzb-home-new__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .lzb-home-new__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.lzb-home-new__card-image {
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background-color: var(--color-secondary-bg);
  position: relative;
}

.lzb-home-new__card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lzb-home-new__card-badge {
  position: absolute;
  top: var(--space-md);
  left: var(--space-md);
}

.lzb-home-new__card-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h3-alt);
  font-weight: var(--fw-medium);
  line-height: 1.5;
  color: var(--color-text-primary);
  margin-top: var(--space-md);
}

.lzb-home-new__card-price {
  font-size: var(--fs-body-sm);
  color: var(--color-accent);
  margin-top: var(--space-2xs);
}

.lzb-home-new__cta {
  text-align: center;
  padding-top: var(--space-2xl);
}

/* ── Testimonials ── */

.lzb-home-testimonials {
  background-color: var(--color-testimonial-bg);
  padding-block: var(--section-padding-y);
  color: var(--color-text-on-dark);
}

.lzb-home-testimonials .lzb-section-header .lzb-label {
  color: var(--color-accent);
}

.lzb-home-testimonials .lzb-h2 {
  color: var(--color-text-on-dark);
}

.lzb-home-testimonials__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
  padding-top: var(--space-2xl);
}

@media (min-width: 768px) {
  .lzb-home-testimonials__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .lzb-home-testimonials__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.lzb-testimonial-card {
  border: var(--border-width) solid var(--color-border-on-dark);
  padding: var(--space-xl);
}

.lzb-testimonial-card__stars {
  margin-bottom: var(--space-lg);
}

.lzb-testimonial-card__quote {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: var(--fs-body-sm);
  line-height: 1.625;
  color: rgba(255, 253, 251, 0.75);
  margin-bottom: var(--space-lg);
}

.lzb-testimonial-card__author {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding-top: var(--space-lg);
}

.lzb-testimonial-card__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  background-color: var(--color-muted-taupe);
}

.lzb-testimonial-card__name {
  font-size: var(--fs-body-sm);
  font-weight: var(--fw-normal);
  color: var(--color-text-on-dark);
  line-height: 1.43;
}

.lzb-testimonial-card__location {
  font-size: var(--fs-small);
  color: rgba(255, 253, 251, 0.35);
  line-height: 1.33;
}

.lzb-home-testimonials__cta {
  text-align: center;
  padding-top: var(--space-2xl);
}

/* ── Brand Story Section ── */

.lzb-home-brand {
  padding-block: var(--section-padding-y);
  background-color: var(--color-page-bg);
}

.lzb-home-brand__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2xl);
  align-items: center;
}

@media (min-width: 768px) {
  .lzb-home-brand__grid {
    grid-template-columns: 1fr 1fr;
  }
}

.lzb-home-brand__text {
  max-width: 632px;
}

.lzb-home-brand__label {
  font-size: var(--fs-label);
  font-weight: var(--fw-normal);
  text-transform: uppercase;
  letter-spacing: var(--ls-label-wide);
  color: var(--color-muted-taupe);
  margin-bottom: var(--space-md);
}

.lzb-home-brand__heading {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-normal);
  line-height: 1.17;
  color: var(--color-text-primary);
  margin-bottom: var(--space-lg);
}

.lzb-home-brand__desc {
  font-size: var(--fs-body);
  color: var(--color-muted-taupe);
  line-height: var(--lh-body);
  margin-bottom: var(--space-md);
}

.lzb-home-brand__link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding-top: var(--space-lg);
  font-size: var(--fs-label);
  font-weight: var(--fw-medium);
  text-transform: uppercase;
  letter-spacing: var(--ls-button);
  color: var(--color-text-primary);
  border-bottom: var(--border-width) solid var(--color-text-primary);
  padding-bottom: 5px;
}

.lzb-home-brand__link:hover {
  opacity: 0.7;
}

.lzb-home-brand__image {
  position: relative;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}

.lzb-home-brand__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lzb-home-brand__tag {
  position: absolute;
  bottom: var(--space-lg);
  left: -24px;
  background-color: var(--color-primary-white);
  padding: var(--space-lg);
}

.lzb-home-brand__tag-year {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-normal);
  line-height: 1;
  color: var(--color-text-primary);
}

.lzb-home-brand__tag-subtitle {
  font-size: var(--fs-label);
  font-weight: var(--fw-normal);
  text-transform: uppercase;
  letter-spacing: var(--ls-label);
  color: var(--color-muted-taupe);
  margin-top: var(--space-2xs);
}

/* ── Blog Section ── */

.lzb-home-blog {
  padding-block: var(--section-padding-y);
}

.lzb-home-blog__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
  padding-top: var(--space-2xl);
}

@media (min-width: 768px) {
  .lzb-home-blog__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .lzb-home-blog__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.lzb-blog-card__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background-color: var(--color-secondary-bg);
}

.lzb-blog-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.lzb-blog-card:hover .lzb-blog-card__image img {
  transform: scale(1.05);
}

.lzb-blog-card__category {
  display: inline-block;
  font-size: var(--fs-label);
  font-weight: var(--fw-normal);
  text-transform: uppercase;
  letter-spacing: var(--ls-label);
  color: var(--color-muted-taupe);
  margin-top: var(--space-md);
}

.lzb-blog-card__title {
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: var(--fw-normal);
  line-height: 1.4;
  color: var(--color-text-primary);
  margin-top: var(--space-xs);
}

.lzb-blog-card__date {
  font-size: var(--fs-small);
  color: var(--color-muted-taupe);
  margin-top: var(--space-xs);
}

/* ── Scroll-to-top button ── */

.lzb-scroll-top {
  position: fixed;
  bottom: var(--space-xl);
  right: var(--space-xl);
  z-index: var(--z-sticky);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-primary-dark);
  color: var(--color-text-on-dark);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all var(--transition-base);
  box-shadow: var(--shadow-md);
}

.lzb-scroll-top--visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.lzb-scroll-top:hover {
  background-color: var(--color-text-primary);
}

/* ── Animation utilities ── */

.lzb-animate {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--transition-slow), transform var(--transition-slow);
}

.lzb-animated {
  opacity: 1;
  transform: translateY(0);
}