/* ===== Page: Assiettes Signature ===== */
.assiettes-page {
  background-color: var(--color-creme);
}

/* --- Hero --- */
.assiettes-hero {
  padding-block: var(--space-3xl);
}

.assiettes-hero__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
  align-items: start;
}

.assiettes-hero__content {
  grid-column: 2 / span 6;
  min-width: 0;
}

.assiettes-hero__content .section-label {
  margin-block-end: var(--space-sm);
}

.assiettes-hero__content h1 {
  max-width: 12ch;
  margin-block-end: var(--space-lg);
}

.assiettes-hero__lead {
  max-width: 68ch;
  margin-block-end: var(--space-md);
}

.assiettes-hero__detail {
  max-width: 68ch;
  color: var(--color-charbon-clair);
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  letter-spacing: var(--text-small-letter-spacing);
}

.assiettes-hero__media {
  grid-column: 8 / span 5;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--radius-none);
  transform: translateY(0);
  will-change: transform;
}

.assiettes-hero__image {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
  filter: saturate(0.75) sepia(0.08) hue-rotate(45deg);
}

/* --- Philosophie --- */
.assiettes-philosophie {
  padding-block: var(--space-3xl);
}

.assiettes-philosophie__container {
  max-width: 66.6667%;
  margin-inline: auto;
  text-align: center;
}

.assiettes-philosophie__container h2 {
  margin-block-end: var(--space-lg);
}

.assiettes-philosophie__container p {
  max-width: 68ch;
  margin-inline: auto;
  margin-block-end: var(--space-md);
}

.assiettes-philosophie__quote {
  max-width: 45ch;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
  color: var(--color-charbon);
}

/* --- Sélection --- */
.assiettes-selection {
  padding-block: var(--space-3xl);
}

.assiettes-selection h2 {
  margin-block-end: var(--space-xl);
}

.assiettes-selection__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.assiettes-card {
  min-width: 0;
  transition: transform var(--transition-fast) var(--transition-ease);
}

.assiettes-card:hover {
  transform: translateY(-4px);
}

.assiettes-card .card__title {
  max-width: 45ch;
}

.assiettes-card .card__body {
  max-width: 68ch;
}

.assiettes-card__ingredients {
  list-style: disc;
  padding-inline-start: 1.25rem;
  margin-block: var(--space-sm) var(--space-md);
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  letter-spacing: var(--text-small-letter-spacing);
}

.assiettes-card__accord {
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  letter-spacing: var(--text-small-letter-spacing);
  color: var(--color-charbon-clair);
}

/* --- Expérience --- */
.assiettes-experience {
  padding-block: var(--space-3xl);
}

.assiettes-experience__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
  align-items: start;
}

.assiettes-experience__content {
  grid-column: 2 / span 7;
  min-width: 0;
}

.assiettes-experience__content h2 {
  margin-block-end: var(--space-lg);
}

.assiettes-experience__content h3 {
  margin-block-start: var(--space-lg);
  margin-block-end: var(--space-sm);
}

.assiettes-experience__content p {
  max-width: 68ch;
  margin-block-end: var(--space-md);
}

.assiettes-experience__media {
  grid-column: 9 / span 4;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--radius-none);
}

.assiettes-experience__image {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
  filter: saturate(0.75) sepia(0.08) hue-rotate(45deg);
}

/* --- Citation --- */
.assiettes-citation {
  padding-block: var(--space-3xl);
}

.assiettes-citation__container {
  max-width: 66.6667%;
  margin-inline: auto;
  text-align: center;
}

.assiettes-citation__quote {
  max-width: 45ch;
  margin-inline: auto;
  margin-block-end: var(--space-md);
  color: var(--color-creme);
}

.assiettes-citation__source {
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  letter-spacing: var(--text-small-letter-spacing);
  color: var(--color-vert-sauge);
}

/* --- Poker --- */
.assiettes-poker {
  padding-block: var(--space-3xl);
}

.assiettes-poker__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
  align-items: start;
}

.assiettes-poker__content {
  grid-column: 2 / span 6;
  min-width: 0;
}

.assiettes-poker__content h2 {
  margin-block-end: var(--space-lg);
}

.assiettes-poker__content p {
  max-width: 68ch;
  margin-block-end: var(--space-md);
}

.assiettes-poker__card {
  grid-column: 8 / span 4;
  min-width: 0;
}

.assiettes-poker__card .section-label {
  margin-block-end: var(--space-sm);
}

.assiettes-poker__card h3 {
  margin-block-end: var(--space-sm);
}

.assiettes-poker__card p {
  margin-block-end: var(--space-md);
}

.assiettes-poker__card .btn {
  margin-block-start: var(--space-md);
}

/* --- Accords --- */
.assiettes-accords {
  padding-block: var(--space-3xl);
}

.assiettes-accords__container {
  max-width: 66.6667%;
  margin-inline: auto;
  text-align: left;
}

.assiettes-accords__container h2 {
  margin-block-end: var(--space-lg);
}

.assiettes-accords__container p {
  max-width: 68ch;
  margin-block-end: var(--space-md);
}

.assiettes-accords__list {
  margin-block: var(--space-lg);
}

.assiettes-accords__list ul {
  columns: 2;
  column-gap: var(--space-xl);
  list-style: disc;
  padding-inline-start: 1.25rem;
  margin-block-end: 0;
}

.assiettes-accords__list li {
  margin-block-end: var(--space-xs);
  break-inside: avoid;
}

/* --- CTA --- */
.assiettes-cta {
  padding-block: var(--space-3xl);
}

.assiettes-cta__container {
  max-width: 50%;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  align-items: center;
}

.assiettes-cta__container h2 {
  margin-block-end: 0;
}

.assiettes-cta__container p {
  max-width: 68ch;
  margin-block-end: 0;
}

.assiettes-cta__address {
  font-style: normal;
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  letter-spacing: var(--text-small-letter-spacing);
  color: var(--color-creme);
  margin-block-end: 0;
}

.assiettes-cta__address a {
  color: var(--color-creme);
}

.assiettes-cta__container .btn {
  margin-block-start: var(--space-md);
}

/* --- Responsive --- */
@media (max-width: 1023px) {
  .assiettes-hero__content {
    grid-column: 1 / span 7;
  }

  .assiettes-hero__media {
    grid-column: 8 / span 5;
  }

  .assiettes-experience__content {
    grid-column: 1 / span 7;
  }

  .assiettes-experience__media {
    grid-column: 8 / span 5;
  }

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

  .assiettes-poker__card {
    grid-column: 8 / span 5;
  }

  .assiettes-philosophie__container,
  .assiettes-citation__container,
  .assiettes-accords__container,
  .assiettes-cta__container {
    max-width: 83.3333%;
  }
}

@media (max-width: 767px) {
  .assiettes-hero__grid,
  .assiettes-experience__grid,
  .assiettes-poker__grid {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .assiettes-hero__content,
  .assiettes-hero__media,
  .assiettes-experience__content,
  .assiettes-experience__media,
  .assiettes-poker__content,
  .assiettes-poker__card {
    grid-column: 1;
  }

  .assiettes-hero__content h1 {
    font-size: clamp(2rem, 8vw, 2.75rem);
  }

  .assiettes-hero__lead,
  .assiettes-hero__detail,
  .assiettes-experience__content p,
  .assiettes-poker__content p,
  .assiettes-philosophie__container p,
  .assiettes-accords__container p,
  .assiettes-cta__container p {
    max-width: 100%;
  }

  .assiettes-selection__grid {
    grid-template-columns: 1fr;
    gap: var(--space-md);
  }

  .assiettes-philosophie__container,
  .assiettes-citation__container,
  .assiettes-accords__container,
  .assiettes-cta__container {
    max-width: 100%;
  }

  .assiettes-philosophie__container {
    text-align: left;
  }

  .assiettes-philosophie__quote {
    margin-inline: 0;
  }

  .assiettes-citation__container {
    text-align: center;
  }

  .assiettes-accords__list ul {
    columns: 1;
  }

  .assiettes-cta__container {
    text-align: center;
  }

  .assiettes-cta__container .btn {
    width: 100%;
  }
}