/* ==============================================================
   LE SITE PAR-DESSUS LA LANDING (js/hote.js, 28/10). Ces règles ne valent que tant que la landing est là
   (classe landing-hote sur <html>) : elle les retire en partant, et le site retrouve les siennes.
   ============================================================== */
/* la landing défile avec la page, que le site garde d'ordinaire fixe (overflow: hidden, hauteur de l'écran) */
html.landing-hote, html.landing-hote body { overflow: visible !important; height: auto !important; }
html.landing-hote body { background: var(--nuit) !important; display: block !important; }
/* le site : une couche au-dessus de la landing, transparente, qui ne prend les clics que là où il dessine (son menu) */
html.landing-hote #root { position: fixed !important; inset: 0 !important; height: auto !important; z-index: 60; overflow: visible !important; pointer-events: none; }
/* (28/10 : sur iPhone, « Créer un évènement » ne répondait plus) les cadres du site, transparents, couvrent tout l'écran
   et prenaient les touchers : sur la landing, rien du site ne les prend, sauf son menu du haut (et ce qu'il ouvre) */
html.landing-hote:not(.landing-depart) #root * { pointer-events: none !important; }
html.landing-hote:not(.landing-depart) #root .desktop-nav-inner, html.landing-hote:not(.landing-depart) #root .desktop-nav-inner * { pointer-events: auto !important; }
/* (30/10) sauf les calques du vert liquide (useLiquideMenu), posés sur toute la barre : ils captaient ses touchers */
html.landing-hote:not(.landing-depart) #root .desktop-nav-inner .liquide-hote, html.landing-hote:not(.landing-depart) #root .desktop-nav-inner .liquide-hote * { pointer-events: none !important; }
html.landing-hote #fond-du-site, html.landing-hote #cadre-du-site { background-color: transparent !important; }
/* le menu de la photo de profil, posé par le site dans sa couche « overlay » : ses choix, et le clic à côté qui le referme
   (seulement ce qu'elle contient : vide, elle couvre tout l'écran) */
html.landing-hote:not(.landing-depart) #root .overlay * { pointer-events: auto !important; }
/* l'écran suivant arrive (un lien du menu, le formulaire) : il prend la main tout de suite */
html.landing-depart #root { pointer-events: auto; }
/* le menu est celui du site (au téléphone aussi depuis le 29/10) : la barre de la landing ne garde que son logo — repère
   du chargement —, puis s'efface quand le menu du site est là (« app-prete ») ; si le site ne démarrait pas, elle reste */
html.landing-hote:not(.site-absent) .barre-fixe .barre-droite { display: none; }
html.landing-hote.app-prete:not(.site-absent) #barre { visibility: hidden; }
/* au téléphone, son logo prend la place exacte de celui du menu du site (72 px de haut, logo de 18 px) : c'est là que
   l'icône du chargement se pose et que s'écrit « Shotai », juste avant que le menu ne la remplace */
@media (max-width: 639px) {
  html.landing-hote:not(.site-absent) .barre-fixe { height: 72px; }
  html.landing-hote:not(.site-absent) .barre-fixe .barre-logo { height: 18px; }
  html.landing-hote:not(.site-absent) .barre-fixe .bl-symbole { width: calc(18px * 109.6 / 110); }
  html.landing-hote:not(.site-absent) .barre-fixe .bl-mot { width: calc(18px * 475 / 110); margin-left: calc(18px * 36.4 / 110); }
}
/* LE VOL DE LA CARTE JUSQU'AU VRAI FORMULAIRE (js/creation.js, 29/10) : la vraie page de création glisse depuis le bas
   sous la landing, avec son fond (opaque le temps du vol) ; sa carte reste cachée — c'est celle qui vole qui s'y pose,
   puis elle laisse voir la vraie. Le menu se resserre en pilule dès le clic, comme sur la page de création (mêmes
   valeurs que .desktop-nav-inner.is-compact, src/styles/web.css) */
html.landing-hote.vol-creation #fond-du-site { background-color: #050a02 !important; }
html.vol-creation #carte-formulaire { visibility: hidden !important; }
@media (min-width: 640px) {
  html.vol-creation .desktop-nav-inner { max-width: min(920px, calc(100% - 32px)); height: 60px; padding: 0 12px 0 20px; }
  html.vol-creation .desktop-nav-glass { opacity: 1; }
  html.vol-creation .desktop-nav::before { opacity: 0; }
}
/* (Quentin, 29/10 : « le menu n'est pas affiché puis apparaît d'un coup ») le menu du site arrive après le chargement,
   une fois le site démarré : ses boutons entrent en douceur ; le logo, lui, est déjà là — c'est celui de la landing */
@keyframes menu-arrivee { from { opacity: 0; transform: translateY(-6px); } }
html.landing-hote .desktop-nav-boutons { animation: menu-arrivee 0.7s cubic-bezier(0.22, 1, 0.36, 1) backwards; }
/* (Quentin, 29/10 : « la carte évènement subit un léger changement » quand le site arrive) les réglages de base du site
   (ceux de Tailwind) valent pour toute la page : sur la landing, ils changeaient l'interligne de tous ses textes (1,45 →
   1,5) et bridaient ses images à la largeur de leur cadre — le flou derrière les cartes, l'image du mot qui se
   transforme. On rend à la landing les siens (css/ds.css) ; seulement à elle (data-landing, js/hote.js) : le site
   garde les siens, jusque dans les fenêtres qu'il pose à côté de #root */
html.landing-hote body > [data-landing] { line-height: 1.45; }
html.landing-hote body > [data-landing] :is(img, video) { max-width: none; }
/* (Quentin, 29/10 : « toujours ce petit décalage entre le chargement, le logo qui se dépose, s'anime et la suite du
   site » ; « juste lorsque l'écran noir disparaît, on voit le menu directement ») le site démarre avant l'animation de
   chargement (js/main.js) ; son menu, caché pendant qu'elle se joue, est posé sous l'écran de chargement juste avant
   que son noir ne s'efface (intro-menu retirée) : il se découvre avec l'accueil, sans fondu à lui. Son logo attend que
   l'icône se pose et l'écrive (intro-logo retirée à la fin : il prend alors exactement sa place).
   (30/10) Le logo et la vitre sont visés par leur nom, plus par leur place dans la barre : en y ajoutant les calques du
   vert liquide, les boutons n'étaient plus « le dernier élément » et restaient cachés jusqu'au logo posé */
html.landing-hote.intro-menu #root .desktop-nav { visibility: hidden; }
html.landing-hote.intro-logo #root :is(.desktop-nav-logo, .desktop-nav-glass) { visibility: hidden; }