/* =========================================================================
   Les Délices de Mamour — Page « site en construction »
   -------------------------------------------------------------------------
   Cette feuille vient EN COMPLÉMENT de style.css, dont elle réutilise
   les variables, la base typographique, les boutons et le logo.
   ========================================================================= */

/* La page tient en un seul écran */
.page-attente {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100svh;
}

/* --- Bloc principal ---------------------------------------------------- */
.attente {
  position: relative;
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  padding-block: clamp(5rem, 14vw, 9rem);
  overflow: hidden;
  background-image: radial-gradient(
    134% 88% at 50% 40%,
    #FFFFFF 0%,
    var(--couleur-creme) 45%,
    var(--couleur-rose-poudre) 100%
  );
}

/* Bouquets d'angle, fondus par un masque radial */
.attente__angle {
  position: absolute;
  z-index: 1;
  width: clamp(150px, 17vw, 330px);
  pointer-events: none;
  -webkit-mask-image: radial-gradient(120% 120% at 8% 8%, #000 52%, transparent 78%);
          mask-image: radial-gradient(120% 120% at 8% 8%, #000 52%, transparent 78%);
}

.attente__angle--gauche {
  top: -30px;
  left: -26px;
}

.attente__angle--droite {
  top: -30px;
  right: -26px;
  transform: scaleX(-1);
}

/* Les deux angles du bas reprennent le même bouquet, retourné */
.attente__angle--bas-gauche {
  bottom: -30px;
  left: -26px;
  transform: scaleY(-1);
}

.attente__angle--bas-droite {
  bottom: -30px;
  right: -26px;
  transform: scale(-1, -1);
}

/* --- Contenu ----------------------------------------------------------- */
.attente__contenu {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.75rem;
  text-align: center;
}

.attente__contenu > * { max-width: 100%; }

/* Logo agrandi, empilé verticalement */
.attente__logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.attente__logo .logo__pastille {
  width: 76px;
  height: 76px;
}

.attente__logo .logo__pastille .icone-coeur {
  width: 30px;
  height: 30px;
}

.attente__logo .logo__texte { align-items: center; }

.attente__titre {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  font-weight: 700;
}

.attente__titre-surtitre {
  font-family: var(--police-titre);
  font-size: var(--taille-surtitre);
  line-height: 1.34;
  letter-spacing: var(--interlettrage-titre);
  text-transform: uppercase;
  color: var(--couleur-or);
}

.attente__titre-principal {
  font-family: var(--police-script);
  font-size: var(--taille-h2-script);
  line-height: 1.08;
  color: var(--couleur-rose);
  text-wrap: balance;
}

.attente__texte {
  max-width: 46ch;
  color: var(--couleur-brun-fonce);
  text-wrap: pretty;
}

/* Les réseaux sociaux sont la seule action de la page : on les agrandit */
.attente__reseaux { margin-top: 0.5rem; }

.attente__reseaux .reseaux {
  gap: 1rem;
  justify-content: center;
}

.attente__reseaux .reseaux__lien {
  width: 52px;
  height: 52px;
  border-color: var(--couleur-or);
}

.attente__reseaux .reseaux__lien svg {
  width: 22px;
  height: 22px;
}

/* Signature discrète, en remplacement du pied de page */
.attente__signature {
  margin-top: 1.25rem;
  font-family: var(--police-titre);
  font-size: 0.6625rem;
  line-height: 1.12rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--couleur-or);
}

/* --- Petits écrans ------------------------------------------------------ */
@media (max-width: 640px) {
  .attente__angle--gauche,
  .attente__angle--droite { top: -12px; }

  /* Sur écran étroit, les bouquets du bas viendraient sous le texte :
     on ne garde que ceux du haut. */
  .attente__angle--bas-gauche,
  .attente__angle--bas-droite { display: none; }
}


/* =========================================================================
   Pied de page allégé — utilisé par les pages de texte (mentions légales)
   ========================================================================= */
.pied-attente {
  position: relative;
  padding-block: 2.25rem 1.75rem;
  background-color: var(--couleur-brun-fonce);
  color: var(--couleur-brun-clair);
  text-align: center;
}

.pied-attente__liens {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 1.5rem;
  margin-bottom: 1rem;
}

.pied-attente__liens a {
  font-size: var(--taille-pied);
  line-height: 1.5625rem;
  color: var(--couleur-brun-clair);
  transition: color var(--transition-douce);
}

.pied-attente__liens a:hover { color: var(--couleur-or); }

.pied-attente__mentions {
  font-family: var(--police-titre);
  font-size: 0.6625rem;
  line-height: 1.12rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #C2ADAD;
}
