/* Page-owned styles for Anniversaires */
.anniversaires-page {
  min-width: 0;
}

/* Introduction */
.anniv-intro__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-xl);
  align-items: start;
}

.anniv-intro__content {
  min-width: 0;
}

.anniv-intro__overline {
  display: block;
  margin-block-end: var(--space-sm);
}

.anniv-intro__title {
  max-width: 18ch;
  margin-block-end: var(--space-md);
}

.anniv-intro__lead {
  font-size: var(--text-body-large);
  line-height: var(--leading-body-large);
  max-width: 70ch;
  margin-block-end: var(--space-lg);
}

.anniv-intro__quote {
  max-width: 70ch;
  margin-block-end: 0;
}

.anniv-intro__polaroid {
  width: 100%;
  max-width: 100%;
  transform: rotate(3deg);
  margin-block-end: 0;
}

.anniv-intro__polaroid .polaroid__image {
  aspect-ratio: 1 / 1;
}

@media (min-width: 700px) {
  .anniv-intro__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--space-xl);
  }

  .anniv-intro__content {
    grid-column: 1 / 8;
  }

  .anniv-intro__polaroid {
    grid-column: 8 / 13;
    align-self: start;
    margin-block-start: var(--space-md);
  }
}

@media (max-width: 699px) {
  .anniv-intro__title {
    max-width: 100%;
  }

  .anniv-intro__lead,
  .anniv-intro__quote {
    max-width: 100%;
  }

  .anniv-intro__polaroid {
    transform: rotate(1.5deg);
  }
}

/* Why section */
.anniv-why__title {
  margin-block-end: var(--space-xl);
}

.anniv-why__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-lg);
}

.anniv-why__card {
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: var(--space-lg);
  min-width: 0;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.anniv-why__card:hover {
  transform: rotate(0deg) translateY(-2px);
  box-shadow: var(--shadow-polaroid-hover);
}

.anniv-why__card .overline {
  display: block;
  margin-block-end: var(--space-sm);
}

.anniv-why__card h3 {
  margin-block-end: var(--space-sm);
}

.anniv-why__card p {
  max-width: 40ch;
}

.anniv-why__card--one {
  transform: rotate(-1.5deg);
}

.anniv-why__card--two {
  transform: rotate(1deg);
}

.anniv-why__card--three {
  transform: rotate(-0.5deg);
}

@media (min-width: 700px) {
  .anniv-why__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-xl);
  }

  .anniv-why__card--one {
    transform: rotate(-2deg) translateY(0.5rem);
  }

  .anniv-why__card--two {
    transform: rotate(1.5deg);
  }

  .anniv-why__card--three {
    transform: rotate(-1deg) translateY(1rem);
  }
}

@media (max-width: 699px) {
  .anniv-why__card {
    transform: rotate(0deg);
  }

  .anniv-why__card p {
    max-width: 100%;
  }
}

/* Formats */
.anniv-formats__title {
  margin-block-end: var(--space-xl);
}

.anniv-formats__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-lg);
}

.anniv-format {
  min-width: 0;
  padding: var(--space-lg);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}

.anniv-format h3 {
  margin-block-end: var(--space-sm);
}

.anniv-format p {
  max-width: 70ch;
}

.anniv-format .hand-note {
  margin-block-start: var(--space-md);
}

@media (min-width: 700px) {
  .anniv-formats__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-xl);
  }

  .anniv-format--intimate {
    transform: translateY(0.5rem);
  }

  .anniv-format--festive {
    transform: translateY(0);
  }

  .anniv-format--themed {
    transform: translateY(1rem);
  }
}

@media (max-width: 699px) {
  .anniv-format p {
    max-width: 100%;
  }
}

/* Poker section */
.anniv-poker__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-xl);
  align-items: start;
}

.anniv-poker__content {
  min-width: 0;
}

.anniv-poker__title {
  margin-block-end: var(--space-md);
}

.anniv-poker__lead {
  max-width: 60ch;
  margin-block-end: var(--space-lg);
}

.anniv-poker__quote {
  max-width: 60ch;
  margin-block-end: var(--space-lg);
}

.anniv-poker__list {
  max-width: 60ch;
  margin-block-end: 0;
}

.anniv-poker__polaroid {
  width: 100%;
  max-width: 100%;
  transform: rotate(-2.5deg);
  margin-block-end: 0;
}

.anniv-poker__polaroid .polaroid__image {
  aspect-ratio: 4 / 5;
}

@media (min-width: 700px) {
  .anniv-poker__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--space-xl);
  }

  .anniv-poker__content {
    grid-column: 1 / 7;
  }

  .anniv-poker__polaroid {
    grid-column: 7 / 13;
    align-self: start;
    margin-block-start: var(--space-md);
  }
}

@media (max-width: 699px) {
  .anniv-poker__lead,
  .anniv-poker__quote,
  .anniv-poker__list {
    max-width: 100%;
  }

  .anniv-poker__polaroid {
    transform: rotate(-1deg);
  }
}

/* Process */
.anniv-process__title {
  margin-block-end: var(--space-xl);
}

.anniv-process__steps {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.anniv-step {
  min-width: 0;
  padding: var(--space-lg);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}

.anniv-step .overline {
  display: block;
  margin-block-end: var(--space-sm);
}

.anniv-step h3 {
  margin-block-end: var(--space-sm);
}

.anniv-step p {
  max-width: 70ch;
}

@media (min-width: 700px) {
  .anniv-step--one {
    margin-inline-start: 0;
  }

  .anniv-step--two {
    margin-inline-start: 2rem;
  }

  .anniv-step--three {
    margin-inline-start: 4rem;
  }
}

@media (max-width: 699px) {
  .anniv-step p {
    max-width: 100%;
  }
}

/* Options */
.anniv-options__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.anniv-options__content {
  min-width: 0;
  max-width: 70ch;
}

.anniv-options__title {
  margin-block-end: var(--space-md);
}

.anniv-options__content > p {
  margin-block-end: var(--space-md);
}

.anniv-options__list {
  margin-block-end: var(--space-md);
}

.anniv-options__content .hand-note {
  margin-block-start: var(--space-md);
}

@media (min-width: 700px) {
  .anniv-options__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .anniv-options__content {
    grid-column: 1 / 9;
  }
}

@media (max-width: 699px) {
  .anniv-options__content {
    max-width: 100%;
  }
}

/* Location */
.anniv-location__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-xl);
  align-items: start;
}

.anniv-location__content {
  min-width: 0;
}

.anniv-location__title {
  margin-block-end: var(--space-md);
}

.anniv-location__content p {
  max-width: 70ch;
  margin-block-end: var(--space-md);
}

.anniv-location__address {
  font-style: normal;
  max-width: 70ch;
  color: var(--color-ink-muted);
}

.anniv-location__map {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  min-width: 0;
}

.anniv-location__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (min-width: 700px) {
  .anniv-location__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--space-xl);
  }

  .anniv-location__content {
    grid-column: 1 / 7;
  }

  .anniv-location__map {
    grid-column: 7 / 13;
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 699px) {
  .anniv-location__content p,
  .anniv-location__address {
    max-width: 100%;
  }

  .anniv-location__map {
    aspect-ratio: 4 / 3;
  }
}

/* CTA */
.anniv-cta {
  background-color: var(--color-accent-pink-soft);
}

.anniv-cta__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.anniv-cta__content {
  min-width: 0;
  text-align: center;
  margin-inline: auto;
  max-width: 55ch;
}

.anniv-cta__title {
  margin-block-end: var(--space-md);
}

.anniv-cta__content > p {
  margin-block-end: var(--space-md);
}

.anniv-cta__contact {
  font-size: var(--text-body);
  line-height: var(--leading-body);
  margin-block-end: var(--space-lg);
}

.anniv-cta__contact a {
  color: var(--color-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.anniv-cta__contact a:hover {
  color: var(--color-accent-red);
}

.anniv-cta .btn {
  margin-block-start: var(--space-sm);
}

@media (min-width: 700px) {
  .anniv-cta__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .anniv-cta__content {
    grid-column: 3 / 11;
  }
}

@media (max-width: 699px) {
  .anniv-cta__content {
    max-width: 100%;
  }
}