.blog-image-credit {
  display: block;
  margin: 0;
  padding: .55rem 1.4rem;
  border-bottom: 1px solid rgba(181, 132, 52, .18);
  background: #f5f0e7;
  color: #7a6b57;
  font-size: .62rem;
  letter-spacing: .04em;
  line-height: 1.4;
}

.brand-with-official-logo {
  display: inline-flex;
  line-height: 0;
}

.site-header {
  height: 96px;
}

.official-logo {
  display: block;
  width: 190px;
  height: 90px;
  object-fit: contain;
}

.official-logo-footer {
  width: min(290px, 70vw);
  height: auto;
}

.packs {
  background:
    radial-gradient(circle at 8% 12%, rgba(181, 132, 52, .12), transparent 27rem),
    linear-gradient(180deg, #f8f5ee 0%, #fff 42%, #f4efe4 100%);
  color: #061b2d;
  padding-top: clamp(5rem, 9vw, 8rem);
  padding-bottom: clamp(5rem, 9vw, 8rem);
}

.packs-intro {
  width: min(760px, calc(100% - 2rem));
  margin: 0 auto clamp(3rem, 6vw, 5rem);
  text-align: center;
}

.packs-intro h2 {
  margin: .5rem 0 1rem;
  font-family: "Playfair Display", serif;
  font-size: clamp(2.6rem, 6vw, 4.8rem);
  font-weight: 500;
  line-height: 1;
}

.packs-intro > p:last-of-type {
  color: #53606a;
  font-size: clamp(1rem, 2vw, 1.15rem);
  line-height: 1.75;
}

.packs-price-note {
  display: inline-flex;
  margin-top: 1.3rem;
  padding: .55rem 1rem;
  border: 1px solid rgba(181, 132, 52, .38);
  border-radius: 999px;
  color: #8e6626;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.packs-grid {
  width: min(1240px, calc(100% - 2rem));
  margin: 0 auto;
  display: grid;
  gap: clamp(1.5rem, 4vw, 3rem);
}

.pack-card {
  overflow: hidden;
  border: 1px solid rgba(181, 132, 52, .3);
  border-radius: 4px;
  background: rgba(255, 255, 255, .93);
  box-shadow: 0 24px 70px rgba(6, 27, 45, .1);
}

.pack-card-featured {
  border-color: #b58434;
  box-shadow: 0 28px 80px rgba(6, 27, 45, .16);
}

.pack-content {
  padding: clamp(1.5rem, 4vw, 3rem);
}

.pack-heading {
  position: relative;
  padding-right: 6rem;
  border-bottom: 1px solid rgba(181, 132, 52, .28);
}

.pack-order {
  position: absolute;
  top: -.15rem;
  right: 0;
  color: rgba(181, 132, 52, .23);
  font-family: "Playfair Display", serif;
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  line-height: 1;
}

.pack-badge {
  display: inline-flex;
  margin-bottom: .75rem;
  padding: .38rem .7rem;
  border-radius: 999px;
  background: #b58434;
  color: #fff;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.pack-heading h3 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.9rem, 4vw, 3.2rem);
  font-weight: 500;
  line-height: 1.05;
}

.pack-tagline {
  margin: .6rem 0 .8rem;
  color: #8e6626;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  font-style: italic;
}

.pack-price {
  margin: 0 0 1.25rem;
  color: #061b2d;
  font-size: clamp(1.7rem, 4vw, 2.7rem);
  font-weight: 500;
}

.pack-price small {
  color: #8e6626;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
}

.pack-description {
  margin: 1.35rem 0 1.5rem;
  color: #52606a;
  line-height: 1.7;
}

.pack-details {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, .8fr);
  gap: 1.25rem;
}

.pack-list,
.pack-ideal {
  padding: 1.15rem;
  border: 1px solid #e5ddcf;
  background: #fbfaf7;
}

.pack-list h4 {
  margin: 0 0 .9rem;
  color: #061b2d;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.pack-list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.pack-list li {
  position: relative;
  margin-top: .58rem;
  padding-left: 1.3rem;
  color: #4e5a63;
  font-size: .88rem;
  line-height: 1.45;
}

.pack-list li::before {
  position: absolute;
  left: 0;
  color: #a8792d;
  content: "✓";
  font-weight: 600;
}

.pack-excluded {
  background: #f8f3ee;
}

.pack-excluded li::before {
  color: #8d493c;
  content: "×";
}

.pack-options {
  margin-top: 1rem;
  border-color: rgba(181, 132, 52, .45);
  background: #f7f0df;
}

.pack-options li::before {
  content: "+";
}

.pack-ideal {
  display: grid;
  gap: .35rem;
  margin-top: 1rem;
  border-color: #0b493f;
  background: #0b493f;
  color: #fff;
}

.pack-ideal strong {
  color: #d8b36f;
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.pack-ideal span {
  font-size: .87rem;
  line-height: 1.5;
}

.pack-cta {
  display: inline-flex;
  margin-top: 1.5rem;
}

@media (max-width: 650px) {
  .site-header {
    height: 84px;
  }

  .official-logo {
    width: 150px;
    height: 78px;
  }

  .official-logo-footer {
    width: min(250px, 76vw);
    height: auto;
  }

  .packs-grid,
  .packs-intro {
    width: min(100% - 1.25rem, 1240px);
  }

  .pack-content {
    padding: 1.35rem 1rem 1.5rem;
  }

  .pack-heading {
    padding-right: 3.8rem;
  }

  .pack-details {
    grid-template-columns: 1fr;
  }

  .pack-cta {
    width: 100%;
    justify-content: center;
  }
}