/* ===== Planeta poveștilor — caruselul din partea de sus a paginii =====
   Imaginea planetei (1254×1254) are cărțile deja așezate cu baza spre centru.
   Toate cotele sunt fracții din --W (latura imaginii afișate):
   centrul globului = (0.504, 0.4753), cartea de sus începe la ~0.47·W (cea mai înaltă la 0.506·W) deasupra centrului. */
.planet-hero {
  --logoH: clamp(130px, 27svh, 340px);
  /* planeta stă jos, lipită de marginea ecranului; logo-ul ocupă mijlocul spațiului de deasupra */
  --W: min(100vw, calc((100svh - var(--logoH) - 70px) / .49));
  --stageH: calc(var(--W) * .49);
  position: relative; overflow: hidden; isolation: isolate; text-align: center;
  min-height: 100svh; display: flex; flex-direction: column; background: transparent;
}
.ph-sky { display: none; }
.ph-top { flex: 1; display: grid; place-items: center; padding: 64px 16px 8px; position: relative; z-index: 2; }

.ph-deco { position: absolute; z-index: -1; height: auto; pointer-events: none; user-select: none; }
.ph-stars { left: clamp(4px, 1.5vw, 28px); top: 4px; width: clamp(90px, 14vw, 230px); animation: ph-float 7s ease-in-out infinite; }
.ph-plane { left: 17%; top: calc(var(--logoH) * .55); width: clamp(100px, 17vw, 280px); animation: ph-plane 9s ease-in-out infinite; }
.ph-puzzle { right: clamp(4px, 1.6vw, 28px); top: 6px; width: clamp(90px, 16vw, 260px); animation: ph-float 8s ease-in-out infinite reverse; }
.ph-bee { right: 12%; top: calc(var(--logoH) * 1.05); width: clamp(40px, 5vw, 80px); animation: ph-bee 6s ease-in-out infinite; }

.ph-logo { position: relative; z-index: 2; height: var(--logoH); width: auto; max-width: 92vw; object-fit: contain; margin: 0 auto; animation: ph-logo-in 1s var(--ease-out) both; }
@keyframes ph-logo-in { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: none; } }

.ph-stage { position: relative; height: var(--stageH); flex: none; }
.ph-world {
  --rot: 0deg; --tx: 0; --ty: 0;
  position: absolute; width: var(--W); height: var(--W);
  left: calc(50% - var(--W) * .504);
  /* centrul globului stă puțin sub marginea de jos a scenei */
  top: calc(var(--stageH) + var(--W) * .03 - var(--W) * .4753);
  transform-origin: 50.4% 47.53%;
  transform: translate(calc(var(--W) * var(--tx)), calc(var(--W) * var(--ty))) rotate(var(--rot));
  transition: transform 1.1s cubic-bezier(.6, -.12, .26, 1.12);
  will-change: transform;
}
.ph-planet { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; user-select: none; filter: saturate(.86) contrast(.96) brightness(1.03) drop-shadow(0 18px 30px rgba(60, 90, 40, .14)); }

/* zona pe care se poate apăsa: cartea de sus */
.ph-hit {
  position: absolute; z-index: 2; left: 50%; width: calc(var(--W) * .18); height: calc(var(--W) * .25);
  margin-left: calc(var(--W) * -.09); top: calc(var(--stageH) + var(--W) * .03 - var(--W) * .47);
  border-radius: 12px;
}
.ph-hit:focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; }

/* textul de pe cupola planetei — nu se rotește */
.ph-caption {
  position: absolute; left: 50%; bottom: calc(var(--W) * .028); transform: translateX(-50%); z-index: 3;
  width: min(92%, calc(var(--W) * .34)); color: #fff; display: grid; justify-items: center; gap: calc(var(--W) * .006);
}
.ph-kicker { font-family: var(--f-hand); font-weight: 700; font-size: clamp(.8rem, calc(var(--W) * .013), 1.05rem); color: #fff6d6; text-shadow: 0 1px 2px rgba(20, 50, 10, .5); }
.ph-title {
  font-size: clamp(1.05rem, calc(var(--W) * .026), 2rem); line-height: 1.05; color: #fff; text-wrap: balance;
  text-shadow: 0 2px 0 rgba(27, 60, 20, .5), 0 0 16px rgba(20, 60, 20, .45);
  transition: opacity .35s, transform .35s var(--ease-out);
}
.ph-title.swap { opacity: 0; transform: translateY(8px); }
.ph-actions { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.ph-actions .btn { font-size: clamp(.84rem, calc(var(--W) * .013), 1rem); }
.ph-arrow { width: clamp(38px, calc(var(--W) * .038), 50px); height: clamp(38px, calc(var(--W) * .038), 50px); display: grid; place-items: center; border-radius: 50%; border: 0; background: var(--white); color: var(--ink); box-shadow: 0 3px 0 rgba(0, 0, 0, .18); transition: transform .25s var(--ease-spring); }
.ph-arrow:hover { transform: scale(1.1) rotate(-6deg); }
.ph-arrow svg { width: 55%; height: 55%; }
.ph-dots { display: flex; gap: 6px; margin-top: 4px; }
.ph-dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .6); transition: all .3s var(--ease-spring); }
.ph-dots button.cur { width: 24px; border-radius: 999px; background: #fff; }

/* pagina principală: la intrare se vede doar lumea LuluBoo; sus-dreapta rămân steaua și ☰.
   După scroll apare bara albă cu logo-ul mic. */
.home .site-header { position: fixed; top: 0; left: 0; right: 0; background: transparent; box-shadow: none; transition: background-color .3s, box-shadow .3s; }
.home .site-header.is-scrolled { background: rgba(255, 253, 250, .92); box-shadow: 0 1px 0 rgba(27, 27, 27, .08); }
.home .site-header .logo { transition: opacity .3s, transform .4s var(--ease-out); }
.home .site-header:not(.is-scrolled) .logo { opacity: 0; transform: translateY(-6px); pointer-events: none; }
.home .nav-links, .home .nav-actions .btn-create { display: none !important; }
.home .menu-btn { display: inline-grid; }
.home .nav { justify-content: space-between; }
html.pmenu-lock .home .site-header, html.pmenu-lock .site-header { background: transparent; box-shadow: none; }
html.pmenu-lock .site-header .logo { opacity: 0; }
.promo-strip { border-radius: 0; }

@keyframes ph-float { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-8px) rotate(2deg); } }
@keyframes ph-plane { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(14px, -6px) rotate(-3deg); } }
@keyframes ph-bee { 0%, 100% { transform: translate(0, 0) rotate(0); } 25% { transform: translate(-10px, -8px) rotate(-6deg); } 50% { transform: translate(-18px, 4px) rotate(4deg); } 75% { transform: translate(-6px, 10px) rotate(-2deg); } }

/* telefon: logo sus, mai mult aer până la planetă, mai puține elemente decorative */
@media (max-width: 760px) {
  .planet-hero { --logoH: clamp(120px, 23svh, 220px); --W: min(255vw, calc((100svh - var(--logoH) - 70px) / .49)); }
  .ph-top { place-items: start center; padding-top: 62px; }
  .ph-plane { display: none; }
  .ph-stars { width: 14vw; top: 10px; left: 8px; }
  .ph-puzzle { width: 15vw; top: auto; bottom: calc(var(--stageH) + 8px); right: 8px; }
  .ph-bee { width: 10vw; top: auto; bottom: calc(var(--stageH) + 18px); right: auto; left: 8%; }
  .ph-caption { width: 88vw; }
}
@media (prefers-reduced-motion: reduce) {
  .ph-world { transition-duration: .01s; }
}
/* titlul de pe planetă rămâne lizibil peste iarba cu flori */
.ph-caption::before { content: ''; position: absolute; z-index: -1; inset: -18% -14% -12%; background: radial-gradient(ellipse at 50% 55%, rgba(28, 66, 24, .55) 0%, rgba(28, 66, 24, .32) 45%, transparent 72%); pointer-events: none; }
