/* =======================================================================
   home.css — Prima pagina (Camelia Doca / Elysee)
   Incarcat conditionat din functions.php (handle: cd-home) DOAR pe is_front_page().
   Pe homepage assets-urile globale AAM/Astra sunt dezactivate
   (vezi cd_front_dequeue_conflicts() din functions.php).

   NOTA arhitectura: acest fisier contine deocamdata doar stilurile globale
   ale paginii (keyframes, body, utilitare). Stilurile per-element sunt inca
   inline in front-page.php si vor fi migrate aici, sectiune cu sectiune,
   in pasii de recolorare.
   ======================================================================= */

html { scroll-behavior: smooth; overflow-x: hidden; }
body.cd-elysee { margin: 0; background:#1a0b11; overflow-x: hidden; }
body.cd-elysee ::selection { background: #c9a24b; color: #1a0b11; }
.cd-ph { display:flex; align-items:center; justify-content:center; text-align:center; padding:0 18px;
         font-family:ui-monospace,monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; }

@keyframes elysee-cue { 0%,100% { transform: translateY(0); opacity:.4; } 50% { transform: translateY(10px); opacity:1; } }
@keyframes elysee-curtain { 0%,66% { transform: translateY(0); } 100% { transform: translateY(-100%); } }
@keyframes elysee-line { 0%,14% { width:0; } 100% { width:100%; } }
@keyframes elysee-markin { 0% { clip-path: inset(0 100% 0 0); opacity:.15; } 100% { clip-path: inset(0 0 0 0); opacity:1; } }
@keyframes elysee-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes elysee-spin { to { transform: rotate(360deg); } }
@keyframes elysee-kenburns { 0% { transform: scale(1.06) translate(0,0); } 100% { transform: scale(1.17) translate(-1.4%,-1%); } }
@keyframes elysee-grain { 0%{transform:translate(0,0);} 12%{transform:translate(-4%,-5%);} 24%{transform:translate(-9%,3%);} 36%{transform:translate(5%,-7%);} 48%{transform:translate(-3%,9%);} 60%{transform:translate(-10%,-3%);} 72%{transform:translate(7%,5%);} 84%{transform:translate(-5%,7%);} 100%{transform:translate(0,0);} }

/* meniul mobil — designul e gandit desktop-first; ascundem cursorul custom pe touch */
@media (max-width: 860px){
  .cd-nav-links { display:none !important; }
  .cd-hero-fg { padding-bottom: 90px !important; }
}

/* =======================================================================
   BALOANE care plutesc in hero — animatie CSS pura (GPU-only: transform).
   Strat in interiorul hero-ului (z-index 2: peste fundal+overlay, sub text z3).
   Auto-pauza cand tab-ul nu e vizibil; respecta prefers-reduced-motion.
   Recolorare = schimbi culoarea de baza din .cd-bln (acum: alb cald).
   ======================================================================= */
.cd-balloons { position:absolute; inset:0; z-index:2; overflow:hidden; pointer-events:none; }
.cd-bln-rise { position:absolute; bottom:-200px; will-change:transform;
  animation: cd-bln-rise var(--dur,22s) linear infinite; animation-delay: var(--delay,0s); }
.cd-bln-sway { will-change:transform;
  animation: cd-bln-sway var(--sway,8s) ease-in-out infinite alternate; }
.cd-bln {
  position:relative; width:var(--size,48px); height:calc(var(--size,48px) * 1.22);
  border-radius:50% 50% 48% 48% / 44% 44% 56% 56%;
  background:
    radial-gradient(circle at 32% 26%, rgba(255,255,255,1), rgba(255,255,255,0) 42%),
    radial-gradient(circle at 72% 80%, rgba(0,0,0,0.16), rgba(0,0,0,0) 54%),
    #f3efe7;
  box-shadow: inset -4px -6px 12px rgba(0,0,0,0.12), 0 8px 22px rgba(0,0,0,0.20);
  opacity:0.92;
}
.cd-bln::before { content:""; position:absolute; left:50%; bottom:-6px; transform:translateX(-50%);
  border-left:5px solid transparent; border-right:5px solid transparent; border-top:8px solid #f3efe7; }
.cd-bln::after { content:""; position:absolute; left:50%; top:100%; width:1px; height:78px;
  background:linear-gradient(rgba(244,238,227,0.5), rgba(244,238,227,0)); }
@keyframes cd-bln-rise { from { transform:translateY(0); } to { transform:translateY(-128vh); } }
@keyframes cd-bln-sway { from { transform:translateX(-14px) rotate(-4deg); } to { transform:translateX(14px) rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { .cd-balloons { display:none; } }
