/* ========================================
   SPLASH SCREEN — Intro lettering + logo
   Garda Essence · durata ~4,4s, una volta per sessione
   ======================================== */

.splash-screen {
  position: fixed;
  inset: 0;
  background: #E9E6DF;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 15vh;
  opacity: 1;
  pointer-events: auto;
  --lift-x: 0px;
  --lift-y: -200px;
  --lift-s: 0.25;
}

.splash-screen.complete {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  display: none;
}

.splash-block {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.splash-logo {
  width: 180px;
  height: 180px;
  object-fit: contain;
  opacity: 0;
}

.splash-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  margin-top: 72px;
}

.splash-word {
  display: flex;
  gap: 0.06em;
  font-family: 'Cormorant', 'Georgia', serif;
  font-weight: 300;
  font-size: 76px;
  letter-spacing: 0.16em;
  line-height: 1;
  color: #1A2E4A;
}

.splash-word span { display: inline-block; opacity: 0; }
.splash-word span.splash-space { width: 0.5em; opacity: 1; }

.splash-rule {
  width: 220px;
  height: 1px;
  background: #E47212;
  transform: scaleX(0);
  transform-origin: center;
}

.splash-sub {
  margin: 0;
  font-family: 'Montserrat', 'Segoe UI', sans-serif;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: #1A2E4A;
  opacity: 0;
}

/* ========== ANIMAZIONI ========== */
@keyframes ge-l0 {
  0%, 2.0% { opacity: 0; transform: translate(-10px, 26px); filter: blur(10px); }
  14.0%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l1 {
  0%, 4.2% { opacity: 0; transform: translate(0px, -26px); filter: blur(10px); }
  16.2%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l2 {
  0%, 6.4% { opacity: 0; transform: translate(10px, 26px); filter: blur(10px); }
  18.4%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l3 {
  0%, 8.6% { opacity: 0; transform: translate(-10px, -26px); filter: blur(10px); }
  20.6%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l4 {
  0%, 10.8% { opacity: 0; transform: translate(0px, 26px); filter: blur(10px); }
  22.8%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l5 {
  0%, 13.0% { opacity: 0; transform: translate(10px, -26px); filter: blur(10px); }
  25.0%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l6 {
  0%, 15.2% { opacity: 0; transform: translate(-10px, 26px); filter: blur(10px); }
  27.2%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l7 {
  0%, 17.4% { opacity: 0; transform: translate(0px, -26px); filter: blur(10px); }
  29.4%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l8 {
  0%, 19.6% { opacity: 0; transform: translate(10px, 26px); filter: blur(10px); }
  31.6%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l9 {
  0%, 21.8% { opacity: 0; transform: translate(-10px, -26px); filter: blur(10px); }
  33.8%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l10 {
  0%, 24.0% { opacity: 0; transform: translate(0px, 26px); filter: blur(10px); }
  36.0%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-l11 {
  0%, 26.2% { opacity: 0; transform: translate(10px, -26px); filter: blur(10px); }
  38.2%, 100% { opacity: 1; transform: translate(0, 0); filter: blur(0); }
}

@keyframes ge-rule {
  0%, 38% { transform: scaleX(0); opacity: 0; }
  48%, 100% { transform: scaleX(1); opacity: 1; }
}

@keyframes ge-sub {
  0%, 44% { opacity: 0; transform: translateY(8px); }
  54%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ge-logo {
  0%, 54% { opacity: 0; transform: scale(0.7); filter: blur(6px); }
  64%, 100% { opacity: 1; transform: scale(1); filter: blur(0); }
}

@keyframes ge-textout {
  0%, 64% { opacity: 1; }
  72%, 100% { opacity: 0; }
}

@keyframes ge-lift {
  0%, 64% { transform: translate(0, 0) scale(1); }
  82%, 100% { transform: translate(var(--lift-x), var(--lift-y)) scale(var(--lift-s)); }
}

@keyframes ge-veil {
  0%, 74% { opacity: 1; }
  88%, 100% { opacity: 0; }
}

.splash-screen.run .splash-word span:nth-child(1) { animation: ge-l0 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(2) { animation: ge-l1 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(3) { animation: ge-l2 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(4) { animation: ge-l3 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(5) { animation: ge-l4 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(7) { animation: ge-l5 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(8) { animation: ge-l6 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(9) { animation: ge-l7 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(10) { animation: ge-l8 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(11) { animation: ge-l9 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(12) { animation: ge-l10 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-word span:nth-child(13) { animation: ge-l11 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run { animation: ge-veil 5s ease-in-out forwards; }
.splash-screen.run .splash-block { animation: ge-lift 5s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
.splash-screen.run .splash-logo { animation: ge-logo 5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.splash-screen.run .splash-text { animation: ge-textout 5s ease-out forwards; }
.splash-screen.run .splash-rule { animation: ge-rule 5s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
.splash-screen.run .splash-sub { animation: ge-sub 5s ease-out forwards; }

/* ========== RESPONSIVE ========== */
@media (max-width: 900px) {
  .splash-word { font-size: 52px; letter-spacing: 0.14em; }
  .splash-logo { width: 140px; height: 140px; }
  .splash-text { margin-top: 52px; }
  .splash-rule { width: 170px; }
}

@media (max-width: 560px) {
  .splash-word { font-size: 34px; letter-spacing: 0.12em; }
  .splash-logo { width: 108px; height: 108px; }
  .splash-text { margin-top: 38px; gap: 14px; }
  .splash-rule { width: 130px; }
  .splash-sub { font-size: 10px; letter-spacing: 0.28em; }
}

/* ========== ACCESSIBILITÀ ========== */
@media (prefers-reduced-motion: reduce) {
  .splash-screen { display: none; }
}

/* Intro mostrata una sola volta per sessione */
html.intro-seen .splash-screen { display: none !important; }
