/* ABOUT.CSS */
body { background:var(--bg); padding-bottom:50px; }

/* Hero */
.about-hero {
  position:relative; width:100%; overflow:hidden;
}
.about-hero img { width:100%; display:block; border-radius:0 0 24px 24px; }
.about-hero .overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom,rgba(7,16,30,0.1) 0%,rgba(7,16,30,0.95) 100%);
  border-radius:0 0 24px 24px;
  display:flex; flex-direction:column;
  align-items:center; justify-content:flex-end;
  padding:0 24px 28px;
  text-align:center;
}
.about-hero h1 {
  font-size:32px; font-weight:900; color:var(--gold);
  text-shadow:0 0 30px rgba(245,197,66,0.6); margin-bottom:8px;
  animation:titleGlow 3s ease-in-out infinite;
}
@keyframes titleGlow {
  0%,100%{text-shadow:0 0 20px rgba(245,197,66,0.5);}
  50%{text-shadow:0 0 40px rgba(245,197,66,0.9),0 0 80px rgba(245,197,66,0.3);}
}
.about-hero .tagline {
  font-size:15px; color:rgba(255,255,255,0.75);
  font-weight:500; font-style:italic; line-height:1.5;
}

/* Content sections */
.about-content { padding:20px 14px 0; }

.about-section {
  margin-bottom:22px;
  opacity:0;
  animation:fadeStagger 0.5s ease forwards;
}
.about-section:nth-child(1){animation-delay:0.1s;}
.about-section:nth-child(2){animation-delay:0.2s;}
.about-section:nth-child(3){animation-delay:0.3s;}
.about-section:nth-child(4){animation-delay:0.4s;}
.about-section:nth-child(5){animation-delay:0.5s;}

.about-section-title {
  font-size:13px; font-weight:800; color:var(--cyan);
  letter-spacing:2px; text-transform:uppercase;
  margin-bottom:10px; opacity:0.8;
}

/* Synopsis card */
.synopsis-card {
  padding:20px; line-height:1.8;
  font-size:15px; font-weight:500; color:var(--text);
  position:relative; overflow:hidden;
}
.synopsis-card::before {
  content:''; position:absolute; top:0; right:0;
  width:4px; height:100%;
  background:linear-gradient(to bottom,var(--cyan),var(--gold));
  border-radius:0 22px 22px 0;
}

/* Facts grid */
.facts-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:10px;
}
.fact-item {
  background:var(--card-bg); border:1px solid var(--card-border);
  border-radius:14px; padding:14px 12px;
  display:flex; align-items:center; gap:10px;
}
.fact-icon { font-size:24px; flex-shrink:0; }
.fact-body {}
.fact-label { font-size:11px; color:var(--muted); font-weight:700; letter-spacing:1px; text-transform:uppercase; }
.fact-value { font-size:14px; font-weight:800; color:var(--text); margin-top:2px; }

/* Credits */
.credits-card { padding:18px 20px; }
.credit-row {
  display:flex; justify-content:space-between; align-items:center;
  padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.06);
}
.credit-row:last-child { border-bottom:none; }
.credit-lbl { font-size:13px; color:var(--muted); font-weight:600; }
.credit-val { font-size:15px; font-weight:800; color:var(--text); }

/* Scene gallery */
.scene-gallery { display:flex; flex-direction:column; gap:12px; }
.scene-item { border-radius:var(--radius); overflow:hidden; position:relative; }
.scene-item img { width:100%; display:block; border-radius:var(--radius); }
.scene-caption {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top,rgba(7,16,30,0.9),transparent);
  padding:16px 14px 12px;
  font-size:13px; font-weight:700; color:rgba(255,255,255,0.85);
  border-radius:0 0 var(--radius) var(--radius);
}

/* 404 decoration */
.neon-404-big {
  text-align:center; padding:30px 0 10px;
  font-size:64px; font-weight:900; letter-spacing:8px;
  color:transparent;
  -webkit-text-stroke:2px rgba(255,77,77,0.35);
  animation:flicker 4s ease-in-out infinite;
}
@keyframes flicker {
  0%,100%{opacity:0.35;} 92%{opacity:0.35;} 93%{opacity:0.1;} 94%{opacity:0.35;} 96%{opacity:0.08;} 97%{opacity:0.35;}
}
