.site-main--home {
  padding-bottom: 0;
}

.hero {
  position: relative;
  min-height: clamp(600px, 90vh, 100vh);
  background-color: #002147;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

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

.hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.65s ease, visibility 0.65s ease;
}

.hero__slide--active {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}

.hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hero__shade {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.1);
}

.hero__inner {
  position: relative;
  z-index: 3;
  width: min(900px, 92vw);
  padding: 3rem 1rem;
}

.hero__brand {
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2.8rem, 8vw, 4rem);
  color: #ffffff;
  margin: 0 0 0.5rem;
  text-shadow: 0 3px 12px rgba(0, 0, 0, 0.8), 0 2px 6px rgba(0, 0, 0, 0.6);
}

.hero__tagline {
  margin: 0;
  font-size: clamp(1.2rem, 3.5vw, 1.75rem);
  color: #f2f4f8;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7), 0 1px 4px rgba(0, 0, 0, 0.5);
}

.hero__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  cursor: pointer;
  color: transparent;
}

.hero__nav::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 auto;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
}

.hero__nav--prev {
  left: 1rem;
}

.hero__nav--prev::after {
  transform: rotate(45deg);
}

.hero__nav--next {
  right: 1rem;
}

.hero__nav--next::after {
  transform: rotate(-135deg);
}

.welcome-block {
  padding: 3rem 0 2rem;
  text-align: center;
  background-color: #ffffff;
}

.welcome-block__title {
  font-family: "Open Sans", sans-serif;
  font-size: clamp(1.5rem, 4vw, 1.85rem);
  color: #c82333;
  margin: 0 0 1rem;
  text-transform: uppercase;
}

.welcome-block__text {
  max-width: 860px;
  margin: 0 auto;
  color: #5c626d;
}

.category-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  padding: 3rem 0;
  background-color: #f0f2f5;
}

.category-card {
  position: relative;
  min-height: 420px;
  border-radius: 4px;
  overflow: hidden;
  display: block;
  padding: 0;
  color: #ffffff;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.category-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 0 0 3px #ffffff,
    0 0 0 7px #ffb020,
    0 20px 44px rgba(0, 33, 71, 0.38);
}

.category-card__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
  transition: transform 0.45s ease;
}

.category-card:hover .category-card__bg {
  transform: scale(1.04);
}

.category-card__gradient {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 48%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg,
      rgba(0, 33, 71, 0.92) 0%,
      rgba(120, 35, 55, 0.82) 52%,
      rgba(200, 35, 51, 0.9) 100%);
  -webkit-mask-image: linear-gradient(to top, #000 0%, #000 42%, transparent 100%);
  mask-image: linear-gradient(to top, #000 0%, #000 42%, transparent 100%);
}

.category-card__title {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  margin: 0;
  padding: 1.35rem 1.35rem 1rem;
  max-width: 85%;
  font-weight: 700;
  font-size: clamp(1.15rem, 2.6vw, 1.55rem);
  line-height: 1.25;
  text-align: left;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.55);
}

.category-card__stack {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.35rem;
  pointer-events: none;
}

.category-card__stack .category-card__title {
  position: static;
  padding: 0;
  max-width: 100%;
}

.category-card__details {
  list-style: none;
  margin: 0;
  padding: 0 0 0.15rem;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0.02em;
  text-align: left;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.65);
}

.category-card__details li {
  position: relative;
  margin-bottom: 0.35rem;
  padding-left: 1.1rem;
}

.category-card__details li:last-child {
  margin-bottom: 0;
}

.category-card__details li::before {
  content: "▸";
  position: absolute;
  left: 0;
  opacity: 0.95;
}

.category-card--grad .category-card__bg {
  background-image: url("../assets/home/top1.jpg");
}

.category-card--caps .category-card__bg {
  background-image: url("../assets/home/top2.jpg");
}

.category-card--coll .category-card__bg {
  background-image: url("../assets/home/top3.jpg");
}

.features-strip {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.features-strip::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-color: #eceef2;
  background-image: url("../assets/about/bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.features-strip::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(165deg,
      rgba(255, 255, 255, 0.38) 0%,
      rgba(248, 249, 251, 0.22) 45%,
      rgba(255, 255, 255, 0.32) 100%);
}

.features-strip .feature-item__title {
  text-shadow:
    0 0 12px rgba(255, 255, 255, 0.95),
    0 1px 2px rgba(255, 255, 255, 0.85);
}

.features-strip .feature-item__text {
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.9);
}

.features-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  padding: 3rem 0;
}

.feature-item {
  text-align: center;
  padding: 0 0.5rem;
}

.feature-item__icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  background: #002147;
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature-item__icon span {
  width: 34px;
  height: 34px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.feature-item__icon--bag span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M7 7h14l-2 14H9L7 7zm5-4a3 3 0 013 3H9a3 3 0 013-3z'/%3E%3C/svg%3E");
}

.feature-item__icon--tag span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M21 12l-9 9-7-7 9-9 7 7zm-11 4l6-6-2-2-6 6 2 2z'/%3E%3C/svg%3E");
}

.feature-item__icon--basket span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M7 18c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm10 0c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zM7.2 14h9.75l2.85-10H5.25L4.8 8H3v2h1.5l2.5 10z'/%3E%3C/svg%3E");
}

.feature-item__icon--truck span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M20 8h-3V4H4v13h2c0 1.66 1.34 3 3 3s3-1.34 3-3h6c0 1.66 1.34 3 3 3s3-1.34 3-3h2v-5l-3-4zM7 18c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm12 0c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zM17 12V9.5h3.5l2 2.5H17z'/%3E%3C/svg%3E");
}

.feature-item__title {
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  color: #002147;
  margin: 0 0 0.65rem;
}

.feature-item__text {
  margin: 0;
  font-size: 0.875rem;
  color: #5c626d;
}

/* ── Product Sections ─────────────────────────────────── */
.products-strip {
  padding: 3.5rem 0;
  background-color: #ffffff;
}

.products-strip+.cta-banner+.products-strip {
  background-color: #f8f9fb;
}

.products-strip__head {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2rem;
  text-align: center;
}

.products-strip__title {
  margin: 0;
  font-family: "Lora", Georgia, serif;
  font-size: 1.65rem;
  font-weight: 700;
  color: #002147;
  position: relative;
  display: inline-block;
  padding-bottom: 0.6rem;
  text-transform: uppercase;
}

.products-strip__title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, #c82333, #e8475f);
}

.product-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 1.5rem;
}

.product-card {
  background: #ffffff;
  border: none;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 12px rgba(0, 33, 71, 0.08);
  transition: transform 0.35s cubic-bezier(.4, 0, .2, 1), box-shadow 0.35s cubic-bezier(.4, 0, .2, 1);
}

.product-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(0, 33, 71, 0.15);
}

.product-card__link {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.product-card__media {
  position: relative;
  aspect-ratio: 4 / 5;
  background: #eef1f5;
  overflow: hidden;
}

.product-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s cubic-bezier(.4, 0, .2, 1);
}

.product-card:hover .product-card__media img {
  transform: scale(1.06);
}

.product-card__body {
  padding: 1rem 1rem 1.15rem;
  text-align: center;
}

.product-card__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: #1a2a40;
  letter-spacing: 0.01em;
  transition: color 0.25s ease;
}

.product-card:hover .product-card__title {
  color: #c82333;
}

.cta-banner {
  background-color: #c9b4a8;
  padding: 3rem 0;
  margin: 0;
}

.cta-banner__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: center;
}

.cta-banner__lead {
  margin: 0;
  font-size: 1.5rem;
  color: #ffffff;
}

.cta-banner__sub {
  margin: 0.35rem 0 0;
  font-size: 0.95rem;
  color: #ffffff;
}

.cta-banner__lead a,
.cta-banner__sub a {
  color: inherit;
  text-decoration: none;
}

.cta-banner__lead a:hover {
  text-decoration: underline;
}

.media-split {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 1rem;
  padding: 2rem 0 4rem;
}

.media-split__video {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.media-split__iframe {
  display: block;
  border-radius: 4px;
  max-height: 320px;
  width: 100%;
}

.media-split__poster {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 280px;
  padding: 2rem;
  text-decoration: none;
  color: #ffffff;
  font-weight: 700;
  background-color: #002147;
  background-size: cover;
  background-position: center;
}

.media-split__poster:hover {
  color: #ffffff;
  filter: brightness(1.05);
}

.media-split__poster-label {
  max-width: 22rem;
  font-size: 1.05rem;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

.gallery-mini {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.5rem;
}

.gallery-mini__cell {
  min-height: 120px;
  border-radius: 4px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}

.gallery-mini__cell--a {
  background-image: url("https://images.unsplash.com/photo-1571260898934-d06658ca773a?auto=format&fit=crop&w=600&q=80");
}

.gallery-mini__cell--b {
  background-image: url("https://images.unsplash.com/photo-1635927740824-a738fadb5266?auto=format&fit=crop&w=600&q=80");
}

.gallery-mini__cell--c {
  background-image: url("https://images.unsplash.com/photo-1434030216411-0b793f4b4173?auto=format&fit=crop&w=600&q=80");
}

.gallery-mini__cell--d {
  background-image: url("https://images.unsplash.com/photo-1549923746-c502d488b3db?auto=format&fit=crop&w=600&q=80");
}



@media (max-width: 992px) {
  .category-cards {
    grid-template-columns: 1fr;
  }

  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .media-split {
    grid-template-columns: 1fr;
  }

  .cta-banner__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {

  /* -- Welcome -- */
  .welcome-block {
    padding: 2rem 1rem;
  }

  .welcome-block__title {
    font-size: 1.35rem;
  }

  .welcome-block__text {
    font-size: 0.9rem;
  }

  /* -- Category cards -- */
  .category-cards {
    padding: 2rem 0;
    gap: 1.25rem;
  }

  .category-card {
    min-height: 320px;
  }

  .category-card__stack {
    padding: 1.15rem;
  }

  .category-card__details {
    font-size: 0.76rem;
  }

  /* -- Features -- */
  .features-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2rem 0;
  }

  .feature-item {
    text-align: center;
  }

  /* -- Product sections -- */
  .products-strip {
    padding: 2.5rem 0;
  }

  .products-strip__title {
    font-size: 1.35rem;
  }

  .product-cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }

  .product-card__body {
    padding: 0.75rem 0.5rem;
  }

  .product-card__title {
    font-size: 0.9rem;
  }

  /* -- CTA banner -- */
  .cta-banner {
    padding: 2rem 0;
  }

  .cta-banner__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    text-align: center;
  }

  .cta-banner__lead {
    font-size: 1.25rem;
  }

  .cta-banner__sub {
    font-size: 0.85rem;
  }

  /* -- Media split -- */
  .media-split {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 2rem 0 3rem;
  }

  .gallery-mini {
    grid-template-columns: repeat(3, 1fr);
  }

  /* -- Hero -- */
  .hero {
    min-height: clamp(400px, 70vh, 80vh);
  }

  .hero__nav {
    display: none;
  }
}

@media (max-width: 480px) {
  .product-cards {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .gallery-mini {
    grid-template-columns: 1fr 1fr;
    gap: 0.35rem;
  }

  .category-card {
    min-height: 270px;
  }

  .category-card__stack {
    padding: 1rem;
  }

  .category-card__details {
    font-size: 0.72rem;
    line-height: 1.4;
  }

  .category-card__details li {
    margin-bottom: 0.25rem;
  }

  .category-card__title {
    font-size: 1.15rem;
    padding: 1rem 1rem 0.85rem;
  }
}

.product-card__media--special {
  background-image: url("https://images.unsplash.com/photo-1571260898934-d06658ca773a?auto=format&fit=crop&w=600&q=80");
}

.product-card__media--bachelor {
  background-image: url("https://images.unsplash.com/photo-1549923746-c502d488b3db?auto=format&fit=crop&w=600&q=80");
}

.product-card__media--lawyer {
  background-image: url("https://images.unsplash.com/photo-1580584126903-c17d41830433?auto=format&fit=crop&w=600&q=80");
}

.product-card__media--diploma {
  background-image: url("https://images.unsplash.com/photo-1434030216411-0b793f4b4173?auto=format&fit=crop&w=600&q=80");
}

.product-card__media--master {
  background-image: url("https://images.unsplash.com/photo-1587617425953-c2c07190026d?auto=format&fit=crop&w=600&q=80");
}

.product-card__media--thesis {
  background-image: url("https://images.unsplash.com/photo-1535909339351-858527fd429c?auto=format&fit=crop&w=600&q=80");
}

.product-card__media--ceremonial {
  background-image: url("https://images.unsplash.com/photo-1549923746-c502d488b3db?auto=format&fit=crop&w=600&q=80");
}

/* Featured Products Section */
.featured-products-section {
  background-color: #f5f5f5 !important;
  padding: 60px 0 !important;
  margin: 3rem 0 !important;
}

.featured-products__header {
  text-align: center !important;
  margin-bottom: 2.5rem !important;
}

.featured-products__title {
  font-size: 2rem !important;
  font-weight: 700 !important;
  color: #002147 !important;
  margin: 0 !important;
}

.featured-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  justify-content: center !important;
  align-items: center !important;
  margin-bottom: 3rem !important;
  padding: 0 1rem !important;
}

.featured-filters__btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.75rem 1rem !important;
  background-color: #fff !important;
  border: 2px solid #e0e0e0 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  color: #333 !important;
  transition: all 0.3s ease !important;
  min-width: 100px !important;
}

.featured-filters__icon {
  font-size: 1.5rem !important;
  opacity: 0.7 !important;
  transition: opacity 0.3s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: inherit !important;
}

.featured-filters__label {
  text-align: center !important;
  word-break: break-word !important;
}

.featured-filters__btn:hover {
  border-color: #FF9800 !important;
  color: #FF9800 !important;
}

.featured-filters__btn:hover .featured-filters__icon {
  opacity: 1 !important;
}

.featured-filters__btn--active {
  background-color: #FF9800 !important;
  border-color: #FF9800 !important;
  color: #fff !important;
}

.featured-filters__btn--active .featured-filters__icon {
  opacity: 1 !important;
  color: #fff !important;
}

.featured-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 1.5rem !important;
  padding: 0 1rem !important;
}

.featured-card {
  background-color: transparent !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
}

.featured-card:hover {
  transform: scale(1.05) !important;
}

.featured-card__media {
  aspect-ratio: 300 / 350 !important;
  background-color: #f0f0f0 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.3s ease !important;
}

.featured-card:hover .featured-card__media {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15) !important;
}

.featured-card--filtered-out {
  display: none !important;
}

.featured-card__img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

.featured-card__title {
  padding: 1rem !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: #333 !important;
  margin: 0 !important;
  text-align: left !important;
  text-transform: capitalize !important;
  display: none !important;
}

.featured-grid__empty {
  grid-column: 1 / -1 !important;
  padding: 2rem 1rem !important;
  text-align: center !important;
  color: #888 !important;
  font-size: 0.95rem !important;
}

@media (max-width: 1024px) {
  .featured-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .featured-grid {
    grid-template-columns: 1fr !important;
  }

  .featured-filters__btn {
    font-size: 0.75rem !important;
  }
}