/* Page-owned styles for Cercle Aubier home page */

.home-section {
  padding-block: var(--surface-section-gap-mobile);
}

@media (min-width: 48rem) {
  .home-section {
    padding-block: var(--surface-section-gap-desktop);
  }
}

/* Hero cinématique */
.home-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: var(--color-noir-profond);
}

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

.home-hero__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--color-overlay);
}

.home-hero__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.home-hero__content {
  position: relative;
  z-index: 1;
  width: 100%;
  padding-block: var(--space-7);
}

.home-hero__copy {
  max-width: 37.5rem;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: flex-start;
  text-align: left;
}

.home-hero__title {
  font-size: var(--text-display-size);
  line-height: var(--text-display-line-height);
  font-weight: var(--text-display-weight);
  font-style: italic;
  color: var(--color-ivoire-chaud);
  margin: 0;
  max-width: 100%;
}

.home-hero__lead {
  font-size: var(--text-body-size);
  line-height: var(--text-body-line-height);
  color: var(--color-ivoire-chaud);
  margin: 0;
  max-width: 100%;
}

.home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  align-items: center;
}

.home-hero__actions .btn {
  flex: 0 0 auto;
  min-width: 0;
}

.home-hero__tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
  margin-block-start: var(--space-6);
}

.home-hero__tags li {
  font-size: var(--text-caption-size);
  line-height: var(--text-caption-line-height);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--color-ivoire-chaud-muted);
  border: 1px solid var(--color-cuivre-vieilli);
  border-radius: var(--radius-sm);
  padding: var(--space-1) var(--space-3);
  white-space: nowrap;
}

@media (max-width: 47.999rem) {
  .home-hero__copy {
    max-width: 100%;
    align-items: center;
    text-align: center;
  }

  .home-hero__actions {
    justify-content: center;
  }

  .home-hero__tags {
    justify-content: center;
  }
}

/* Introduction au concept */
.home-intro {
  background-color: var(--color-vert-foret);
}

.home-intro__inner {
  max-width: 50rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  align-items: flex-start;
}

.home-intro__heading {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  align-items: flex-start;
}

.home-intro__heading .text-caption {
  margin: 0;
}

.home-intro__heading h2 {
  margin: 0;
  max-width: 100%;
}

.home-intro__copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  max-width: 43.75rem;
}

.home-intro__copy p {
  margin: 0;
}

/* Le restaurant */
.home-restaurant {
  background-color: var(--color-aubergine);
}

.home-restaurant__grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: var(--space-6);
  align-items: start;
}

.home-restaurant__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
  min-width: 0;
}

.home-restaurant__content .text-caption {
  margin: 0;
}

.home-restaurant__content h2,
.home-restaurant__content h3 {
  margin: 0;
  max-width: 100%;
}

.home-restaurant__content p {
  margin: 0;
  max-width: 100%;
}

.home-restaurant__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.home-restaurant__list li {
  padding-inline-start: var(--space-4);
  position: relative;
}

.home-restaurant__list li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: var(--color-cuivre-vieilli);
}

.home-restaurant__media {
  min-width: 0;
}

.home-restaurant__media img {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-standard);
}

.home-restaurant__media img:hover {
  transform: scale(1.05);
}

@media (max-width: 63.999rem) {
  .home-restaurant__grid {
    grid-template-columns: 1fr;
  }

  .home-restaurant__media img {
    aspect-ratio: 16 / 10;
  }
}

/* La cuisine */
.home-cuisine {
  background-color: var(--color-vert-foret);
}

.home-cuisine__inner {
  max-width: 50rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
}

.home-cuisine__inner .text-caption {
  margin: 0;
}

.home-cuisine__inner h2,
.home-cuisine__inner h3 {
  margin: 0;
  max-width: 100%;
}

.home-cuisine__inner p {
  margin: 0;
  max-width: 43.75rem;
}

/* Soirées à thème */
.home-soirees {
  background-color: var(--color-bleu-ardoise);
}

.home-soirees__inner {
  max-width: 50rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
}

.home-soirees__inner .text-caption {
  margin: 0;
}

.home-soirees__inner h2,
.home-soirees__inner h3 {
  margin: 0;
  max-width: 100%;
}

.home-soirees__inner p {
  margin: 0;
  max-width: 43.75rem;
}

.home-soirees__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  max-width: 43.75rem;
}

.home-soirees__list li {
  padding-inline-start: var(--space-4);
  position: relative;
}

.home-soirees__list li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: var(--color-cuivre-vieilli);
}

/* Le poker */
.home-poker {
  background-color: var(--color-vert-foret);
}

.home-poker__grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: var(--space-6);
  align-items: start;
}

.home-poker__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
  min-width: 0;
}

.home-poker__content .text-caption {
  margin: 0;
}

.home-poker__content h2,
.home-poker__content h3 {
  margin: 0;
  max-width: 100%;
}

.home-poker__content p {
  margin: 0;
  max-width: 100%;
}

.home-poker__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.home-poker__list li {
  padding-inline-start: var(--space-4);
  position: relative;
}

.home-poker__list li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: var(--color-cuivre-vieilli);
}

.home-poker__media {
  min-width: 0;
}

.home-poker__media img {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-standard);
}

.home-poker__media img:hover {
  transform: scale(1.05);
}

@media (max-width: 63.999rem) {
  .home-poker__grid {
    grid-template-columns: 1fr;
  }

  .home-poker__media img {
    aspect-ratio: 16 / 10;
  }
}

/* Poker Lounge */
.home-lounge {
  background-color: var(--color-aubergine);
}

.home-lounge__inner {
  max-width: 50rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
}

.home-lounge__inner .text-caption {
  margin: 0;
}

.home-lounge__inner h2 {
  margin: 0;
  max-width: 100%;
}

.home-lounge__inner p {
  margin: 0;
  max-width: 43.75rem;
}

/* Card Room */
.home-cardroom {
  background-color: var(--color-vert-foret);
}

.home-cardroom__inner {
  max-width: 50rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
}

.home-cardroom__inner .text-caption {
  margin: 0;
}

.home-cardroom__inner h2 {
  margin: 0;
  max-width: 100%;
}

.home-cardroom__inner p {
  margin: 0;
  max-width: 43.75rem;
}

/* Aperçu du menu */
.home-menu {
  background-color: var(--color-ivoire-chaud);
  color: var(--color-noir-profond);
}

.home-menu__inner {
  max-width: 50rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: flex-start;
}

.home-menu__inner .text-caption {
  color: var(--color-aubergine);
  margin: 0;
}

.home-menu__inner h2,
.home-menu__inner h3 {
  color: var(--color-noir-profond);
  margin: 0;
  max-width: 100%;
}

.home-menu__columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  width: 100%;
}

.home-menu__column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.home-menu__column h4 {
  color: var(--color-noir-profond);
  margin: 0;
}

.home-menu__column ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  color: var(--color-noir-profond);
}

.home-menu__column li {
  font-size: var(--text-body-size);
  line-height: var(--text-body-line-height);
}

.home-menu__inner .btn {
  align-self: flex-start;
}

@media (max-width: 63.999rem) {
  .home-menu__columns {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
}

/* Témoignages */
.home-testimonials {
  background-color: var(--color-aubergine);
}

.home-testimonials__inner {
  max-width: 62.5rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: flex-start;
}

.home-testimonials__inner .text-caption {
  margin: 0;
}

.home-testimonials__inner h2 {
  margin: 0;
  max-width: 100%;
}

.home-testimonials__lead {
  margin: 0;
  max-width: 43.75rem;
}

.home-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  width: 100%;
}

.home-testimonials__card {
  background-color: var(--color-bleu-ardoise);
  border: var(--border-hairline);
  border-radius: var(--radius-md);
  padding: var(--surface-card-padding);
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  min-width: 0;
  margin: 0;
}

.home-testimonials__card p {
  font-family: var(--font-heading);
  font-size: var(--text-h4-size);
  line-height: var(--text-h4-line-height);
  font-style: italic;
  color: var(--color-ivoire-chaud);
  margin: 0;
}

.home-testimonials__card footer {
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  color: var(--color-ivoire-chaud-muted);
  margin: 0;
}

@media (max-width: 63.999rem) {
  .home-testimonials__grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
}

/* Appel à l'action final */
.home-cta {
  background-color: var(--color-cuivre-vieilli);
  color: var(--color-noir-profond);
}

.home-cta__inner {
  max-width: 37.5rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: center;
  text-align: center;
}

.home-cta__inner h2 {
  color: var(--color-noir-profond);
  margin: 0;
  max-width: 100%;
}

.home-cta__inner p {
  color: var(--color-noir-profond);
  margin: 0;
  max-width: 100%;
}

.home-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  justify-content: center;
}

.home-cta__actions .btn {
  flex: 0 0 auto;
  min-width: 0;
}

.home-cta__contact {
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  color: var(--color-noir-profond);
}

.home-cta__contact a {
  color: var(--color-noir-profond);
  text-decoration: underline;
}

.home-cta__contact a:hover,
.home-cta__contact a:focus-visible {
  color: var(--color-vert-foret);
}

/* Contact */
.home-contact {
  background-color: var(--color-vert-foret);
}

.home-contact__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-6);
  align-items: start;
}

.home-contact__info {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
  min-width: 0;
}

.home-contact__info .text-caption {
  margin: 0;
}

.home-contact__info h2,
.home-contact__info h3 {
  margin: 0;
  max-width: 100%;
}

.home-contact__info p {
  margin: 0;
  max-width: 100%;
}

.home-contact__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.home-contact__list li {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.home-contact__list span {
  font-weight: 600;
  color: var(--color-ivoire-chaud);
}

.home-contact__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  width: 100%;
  max-width: 100%;
}

.home-contact__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-width: 0;
}

.home-contact__field label {
  font-size: var(--text-small-size);
  line-height: var(--text-small-line-height);
  color: var(--color-ivoire-chaud-muted);
}

.home-contact__field input,
.home-contact__field textarea {
  width: 100%;
  max-width: 100%;
  background-color: var(--color-noir-profond);
  border: 1px solid var(--color-ivoire-chaud-muted);
  border-radius: var(--radius-sm);
  padding: var(--space-3);
  color: var(--color-ivoire-chaud);
  font-size: var(--text-body-size);
  line-height: var(--text-body-line-height);
  transition: border-color var(--transition-standard), box-shadow var(--transition-standard);
}

.home-contact__field input:focus,
.home-contact__field textarea:focus {
  outline: none;
  border-color: var(--color-cuivre-vieilli);
  box-shadow: 0 0 0 2px rgba(184, 115, 51, 0.35);
}

.home-contact__form .btn {
  align-self: flex-start;
}

.home-contact__map {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  aspect-ratio: 4 / 3;
}

.home-contact__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 63.999rem) {
  .home-contact__grid {
    grid-template-columns: 1fr;
  }
}