/* Offers page — clean link-in-bio layout (hidden URL, not in main nav) */

.offers-page {
  min-height: 100vh;
  margin: 0;
  background: var(--cream);
  color: var(--charcoal);
}

.offers-main {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 1.25rem 3.5rem;
}

.offers-container {
  width: 100%;
  max-width: 440px;
  margin: 0 auto;
}

.offers-profile {
  text-align: center;
  margin-bottom: 2rem;
}

.offers-avatar-link {
  display: block;
  width: fit-content;
  margin: 0 auto 1.5rem;
  border-radius: 50%;
  transition: transform 0.25s ease;
}

.offers-avatar-link:hover {
  transform: scale(1.04);
}

.offers-avatar-link:focus-visible {
  outline: 2px solid var(--yellow-dark);
  outline-offset: 6px;
}

.offers-avatar {
  display: block;
  width: 168px;
  height: 168px;
  margin: 0 auto 1.5rem;
  border-radius: 50%;
  object-fit: cover;
  object-position: center 18%;
  border: 4px solid rgba(255, 255, 255, 0.9);
  box-shadow:
    0 8px 28px rgba(74, 74, 74, 0.12),
    0 0 0 1px rgba(250, 210, 218, 0.6);
}

.offers-title {
  font-family: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  font-style: italic;
  font-size: clamp(2.05rem, 5.5vw, 2.45rem);
  font-weight: 600;
  line-height: 1.15;
  margin: 0 0 0.65rem;
  letter-spacing: -0.02em;
  color: var(--charcoal);
}

.offers-subtitle {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.55;
  color: rgba(74, 74, 74, 0.78);
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}

.offers-links {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* Offers hub cards reuse the shared .photo-card component (styles.css).
   A more square box (4:5) than the photos' own ~2:3 portrait ratio.
   Fills the box completely (cover, same zoom level everywhere, no
   letterbox bars), positioned per-photo below so the crop favors keeping
   her face and most of her body in frame instead of a flat center crop. */
.offers-photo-card {
  aspect-ratio: 4 / 5;
  min-height: 0;
}

.offers-photo-card .photo-card-img {
  object-fit: cover;
}

.offers-photo-card .photo-card-content {
  padding: 1.35rem 1.25rem;
}

.offers-photo-card .photo-card-title {
  font-size: 1.1rem;
}

.offers-site-footer {
  padding: 1.25rem 0 2rem;
  text-align: center;
  font-size: 0.82rem;
  color: rgba(74, 74, 74, 0.65);
}

.offers-site-footer p {
  margin: 0;
}

.offers-site-footer .site-legal-footer {
  margin-top: 1rem;
}

@media (max-width: 620px) {
  .offers-container {
    width: 85%;
  }
}

@media (min-width: 720px) {
  .offers-container {
    max-width: 720px;
  }

  .offers-avatar {
    width: 192px;
    height: 192px;
  }

  .offers-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    align-items: start;
  }
}
