/* ============================================================
   PAGE BIENTÔT (coming-soon)
   Hero immersif + carte formulaire intégré
   Les Coffrets de Lorraine · ze-theme-vitrine
============================================================ */

/* ── Wrapper full-screen ──────────────────────────────────── */
.ze-vitrine-bientot {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: flex-start;
  overflow: hidden;
  background-color: var(--ze-charbon);
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
}

/* Spotlight radial uniquement (pas de nav transparente à protéger) */
.ze-vitrine-bientot::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 45% 55% at 28% 55%,
      rgba(13,12,10,0.78) 0%,
      rgba(13,12,10,0.70) 40%,
      rgba(13,12,10,0.45) 70%,
      rgba(13,12,10,0.18) 90%,
      rgba(13,12,10,0.00) 100%
    );
  pointer-events: none;
  z-index: 1;
}

/* Grain subtil */
.ze-vitrine-bientot::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 300px 300px;
  opacity: 0.06;
  pointer-events: none;
  mix-blend-mode: overlay;
  z-index: 2;
}

.ze-vitrine-bientot__inner {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: var(--ze-container);
  margin: 0 auto;
  padding: clamp(3rem, 5vw, 4rem) 5% 5rem;
  display: grid;
  grid-template-columns: 1.8fr 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: center;
  min-height: calc(100vh - var(--ze-announce-h));
}

/* ── Colonne gauche : titre éditorial ─────────────────────── */
.ze-vitrine-bientot__copy {
  color: white;
  align-self: center;
}

.ze-vitrine-bientot__eyebrow {
  font-family: var(--ze-font-sans);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--ze-or-clair);
  margin-bottom: 2rem;
  display: inline-flex;
  align-items: center;
  gap: 1rem;
}
.ze-vitrine-bientot__eyebrow::before {
  content: '';
  display: block;
  width: 36px;
  height: 1px;
  background: var(--ze-or-clair);
  flex-shrink: 0;
  opacity: 0.7;
}

.ze-vitrine-bientot__title {
  font-family: var(--ze-font-serif);
  line-height: 0.98;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.ze-vitrine-bientot__word {
  display: block;
  color: white;
  font-variation-settings: "opsz" 144;
}
.ze-vitrine-bientot__word--1 {
  font-size: clamp(2.2rem, 2.2vw, 2.4rem);
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.02em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.4rem;
}
.ze-vitrine-bientot__word--2 {
  font-size: clamp(6rem, 11vw, 11rem);
  font-style: italic;
  font-weight: 500;
  color: var(--ze-or-pale);
  letter-spacing: -0.02em;
  line-height: 0.94;
  white-space: nowrap;
}
.ze-vitrine-bientot__word--3 {
  font-size: clamp(3rem, 4vw, 3.8rem);
  font-style: italic;
  font-weight: 300;
  color: rgba(255,255,255,0.82);
  letter-spacing: -0.01em;
  margin-top: 0.1em;
  padding-left: clamp(1rem, 4vw, 4rem);
}

.ze-vitrine-bientot__sub {
  margin-top: 2.5rem;
  font-family: var(--ze-font-sans);
  font-size: clamp(0.95rem, 1.05vw, 1.05rem);
  font-weight: 300;
  color: rgba(255,255,255,0.85);
  max-width: 460px;
  line-height: 1.8;
}

/* Mini liste d'engagements sous le sous-titre */
.ze-vitrine-bientot__points {
  list-style: none;
  margin: 2rem 0 0;
  padding: 1.4rem 0 0;
  border-top: 1px solid rgba(255,255,255,0.12);
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.ze-vitrine-bientot__points li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--ze-font-sans);
  font-size: 0.88rem;
  font-weight: 300;
  color: rgba(255,255,255,0.72);
}
.ze-vitrine-bientot__points li::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--ze-or-clair);
  flex-shrink: 0;
}

/* ── Carte CTA (colonne droite du grid) ─────────────────────── */
.ze-vitrine-bientot__cta-card {
  background: var(--ze-blanc);
  border-radius: var(--ze-radius-lg);
  padding: clamp(2rem, 3.5vw, 3rem);
  box-shadow: var(--ze-shadow-card);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.2rem;
  position: relative;
}

.ze-vitrine-bientot__cta-eyebrow {
  font-family: var(--ze-font-sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ze-or-clair);
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.ze-vitrine-bientot__cta-eyebrow::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--ze-or-clair);
}

.ze-vitrine-bientot__cta-title {
  font-family: var(--ze-font-serif);
  font-style: italic;
  font-weight: 500;
  font-variation-settings: "opsz" 144;
  font-size: clamp(1.7rem, 2.4vw, 2.2rem);
  color: var(--ze-charbon);
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 0;
}
.ze-vitrine-bientot__cta-title em {
  font-style: italic;
  font-weight: 400;
  color: var(--ze-or);
}

.ze-vitrine-bientot__cta-text {
  font-family: var(--ze-font-sans);
  font-size: 0.95rem;
  font-weight: 300;
  color: var(--ze-gris);
  line-height: 1.7;
  margin: 0;
}

/* wp:buttons wrapper (carte CTA, alignement à gauche) */
.ze-vitrine-bientot__cta-buttons {
  margin-top: 0.4rem;
  justify-content: flex-start;
}

/* Bouton CTA : cible le <a.wp-block-button__link> rendu par wp:button */
.ze-vitrine-bientot__cta-button .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 1em 2.2em;
  background: var(--ze-rouge);
  color: white;
  font-family: var(--ze-font-sans);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  border: none;
  border-radius: var(--ze-radius-pill);
  box-shadow: var(--ze-shadow-rouge);
  transition: background var(--ze-transition), transform var(--ze-transition), box-shadow var(--ze-transition);
}
/* Flèche → injectée en CSS (pour rester éditable proprement dans Gutenberg) */
.ze-vitrine-bientot__cta-button .wp-block-button__link::after {
  content: '';
  width: 14px;
  height: 14px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform var(--ze-transition);
}
.ze-vitrine-bientot__cta-button .wp-block-button__link:hover {
  background: var(--ze-rouge-fonce);
  transform: translateY(-2px);
  box-shadow: var(--ze-shadow-rouge-hover);
}
.ze-vitrine-bientot__cta-button .wp-block-button__link:hover::after {
  transform: translateX(4px);
}

.ze-vitrine-bientot__cta-phone {
  margin: 0.4rem 0 0;
  padding-top: 1.2rem;
  border-top: 1px solid var(--ze-creme);
  align-self: stretch;
  font-family: var(--ze-font-sans);
  font-size: 0.85rem;
  font-weight: 400;
  color: var(--ze-gris);
}
.ze-vitrine-bientot__cta-phone a {
  color: var(--ze-charbon);
  font-weight: 600;
  text-decoration: none;
  transition: color var(--ze-transition);
}
.ze-vitrine-bientot__cta-phone a:hover { color: var(--ze-rouge); }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1024px) {
  .ze-vitrine-bientot__inner {
    grid-template-columns: 1fr;
    gap: 3rem;
    align-items: stretch;
  }
  /* Scrim renforcé : assombrit fortement la zone du texte pour passer
     au-dessus de l'image de fond très chargée (illustration + texte produit) */
  .ze-vitrine-bientot::before {
    background:
      linear-gradient(180deg,
        rgba(13,12,10,0.92) 0%,
        rgba(13,12,10,0.78) 55%,
        rgba(13,12,10,0.90) 100%
      );
  }
  .ze-vitrine-bientot {
    background-position: 70% center;
  }
  /* Glow subtil derrière le titre pour décoller du fond */
  .ze-vitrine-bientot__word {
    text-shadow: 0 2px 24px rgba(0,0,0,0.55);
  }
  /* Eyebrow plus lisible sur mobile */
  .ze-vitrine-bientot__eyebrow {
    font-size: 0.78rem;
    color: var(--ze-or-pale);
  }
  .ze-vitrine-bientot__eyebrow::before {
    background: var(--ze-or-pale);
    opacity: 0.9;
  }
}

@media (max-width: 768px) {
  .ze-vitrine-bientot__word--3 { padding-left: 0; }
  /* À très petite largeur, autorise "la Lorraine" à wrap si nécessaire */
  .ze-vitrine-bientot__word--2 { white-space: normal; }
  .ze-vitrine-bientot__inner {
    padding: 2.5rem 6% 3rem;
  }
  /* Scrim encore plus sombre sur petits écrans (l'image prend moins de place
     visuelle, le texte doit dominer) */
  .ze-vitrine-bientot::before {
    background:
      linear-gradient(180deg,
        rgba(13,12,10,0.95) 0%,
        rgba(13,12,10,0.85) 55%,
        rgba(13,12,10,0.92) 100%
      );
  }
}