/* ============================================
   PHARAONIC WARD BANNER — 8WEST INSTITUTE
   pharaonic-ward.css
   ============================================ */

#pw-outer {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

#pw-banner {
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 5;
  overflow: hidden;
  background: #1c1c1c;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

@media (max-width: 600px) {
  #pw-banner { aspect-ratio: 21 / 9; }
}

/* DEPTH — back */
.pw-depth-back {
  position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(ellipse 80% 60% at 50% 50%, rgba(200,170,100,0.05) 0%, transparent 70%),
    radial-gradient(ellipse 40% 80% at 20% 50%, rgba(200,170,100,0.03) 0%, transparent 60%),
    radial-gradient(ellipse 40% 80% at 80% 50%, rgba(200,170,100,0.03) 0%, transparent 60%);
}

/* DEPTH — mid */
.pw-depth-mid {
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(90deg, rgba(0,0,0,0.45) 0%, transparent 25%, transparent 75%, rgba(0,0,0,0.45) 100%);
}

/* NOISE */
#pw-banner::before {
  content: "";
  position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity: 0.04;
}

/* SCANLINES */
#pw-banner::after {
  content: "";
  position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,0.01) 2px, rgba(255,255,255,0.01) 4px);
}

/* VIGNETTE */
.pw-vignette {
  position: absolute; inset: 0; z-index: 4; pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(28,28,28,0.65) 100%);
}

/* EYE OF HORUS */
.pw-eye {
  position: absolute; z-index: 5; pointer-events: none;
  width: 42%; max-width: 360px;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.pw-eye img {
  width: 100%;
  filter: grayscale(100%) sepia(0.3) brightness(0.55);
  mix-blend-mode: soft-light;
  animation: eyeBreath 7s ease-in-out infinite;
}
@keyframes eyeBreath {
  0%, 100% { opacity: 0.18; transform: scale(1); }
  50%       { opacity: 0.3;  transform: scale(1.03); }
}

/* FLICKER */
.pw-flicker {
  position: absolute; inset: 0; z-index: 6; pointer-events: none;
  background: rgba(224,210,183,0.008);
  animation: flicker 9s steps(1) infinite;
}
@keyframes flicker {
  0%  { opacity: 1; }   2%  { opacity: 0; }   4%  { opacity: 1; }
  7%  { opacity: 0.65; } 9%  { opacity: 1; }
  46% { opacity: 1; }   47% { opacity: 0; }   48% { opacity: 1; }
  81% { opacity: 0.7; } 82% { opacity: 1; }
  96% { opacity: 0; }   98% { opacity: 1; }
}

/* GOLD LINES */
.pw-line {
  position: absolute; left: 0; right: 0; height: 1px; z-index: 6;
  background: linear-gradient(90deg, transparent, rgba(224,210,183,0.25) 20%, rgba(224,210,183,0.25) 80%, transparent);
}
.pw-line-top { top: 12%; }
.pw-line-bot { bottom: 12%; }

/* CORNER MARKS */
.pw-corner {
  position: absolute; width: 16px; height: 16px;
  border-color: rgba(224,210,183,0.22); border-style: solid; z-index: 6;
}
.pw-corner-tl { top: 14%; left: 3%;  border-width: 1px 0 0 1px; }
.pw-corner-tr { top: 14%; right: 3%; border-width: 1px 1px 0 0; }
.pw-corner-bl { bottom: 14%; left: 3%;  border-width: 0 0 1px 1px; }
.pw-corner-br { bottom: 14%; right: 3%; border-width: 0 1px 1px 0; }

/* RESTRICTED BADGE */
.pw-badge {
  position: absolute; top: 15%; right: 4%; z-index: 6;
  font-family: 'Courier New', monospace;
  font-size: clamp(5px, 0.7vw, 7px); letter-spacing: 2px;
  color: rgba(224,210,183,0.18); text-transform: uppercase;
  border: 1px solid rgba(224,210,183,0.08); padding: 3px 6px;
  animation: badgeBlink 5s steps(1) infinite;
}
@keyframes badgeBlink {
  0%, 100% { opacity: 1; } 49% { opacity: 1; } 51% { opacity: 0.12; } 53% { opacity: 1; }
}

/* FILE ID */
.pw-fileid {
  position: absolute; bottom: 15%; left: 4%; z-index: 6;
  font-family: 'Courier New', monospace;
  font-size: clamp(5px, 0.65vw, 7px); letter-spacing: 2px;
  color: rgba(224,210,183,0.14); text-transform: uppercase;
}

/* GLITCH BAR */
.pw-glitch { position: absolute; inset: 0; z-index: 7; pointer-events: none; overflow: hidden; }
.pw-glitch-bar {
  position: absolute; left: 0; right: 0; height: 2px;
  background: rgba(224,210,183,0.07);
  transform: translateY(-100%);
  animation: glitchBar 11s steps(1) infinite;
}
@keyframes glitchBar {
  0%  { transform: translateY(-100%); opacity: 0; }
  10% { transform: translateY(35%);   opacity: 1; }
  11% { transform: translateY(72%);   opacity: 0.4; }
  12% { transform: translateY(-100%); opacity: 0; }
  56% { opacity: 0; }
  57% { transform: translateY(50%);   opacity: 0.7; }
  58% { transform: translateY(-100%); opacity: 0; }
  100%{ transform: translateY(-100%); opacity: 0; }
}

/* BLEND EDGES — z-index:9 تحت المحتوى */
.pw-fade-top {
  position: absolute; top: 0; left: 0; right: 0; height: 38%;
  z-index: 9; pointer-events: none;
  background: linear-gradient(180deg, #1c1c1c 0%, transparent 100%);
}
.pw-fade-bot {
  position: absolute; bottom: 0; left: 0; right: 0; height: 38%;
  z-index: 9; pointer-events: none;
  background: linear-gradient(0deg, #1c1c1c 0%, transparent 100%);
}

/* CONTENT — z-index:10 فوق كل حاجة */
.pw-content {
  position: relative; z-index: 10;
  display: flex; flex-direction: column;
  align-items: center; text-align: center;
  padding: 0 5%; gap: 0;
}

.pw-meta { display: flex; gap: 20px; align-items: center; margin-bottom: 6px; }
.pw-meta span {
  font-family: 'Courier New', monospace;
  font-size: clamp(6px, 0.9vw, 9px); letter-spacing: 3px;
  color: rgba(224,210,183,0.35); text-transform: uppercase;
}
.pw-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(224,210,183,0.22); }

.pw-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(22px, 5vw, 52px); font-weight: 400;
  letter-spacing: clamp(6px, 1.5vw, 16px);
  color: #e0d2b7; text-transform: uppercase; line-height: 1;
  animation: titleGlow 6s ease-in-out infinite;
}
@keyframes titleGlow {
  0%, 100% { text-shadow: none; }
  50%       { text-shadow: 0 0 30px rgba(224,210,183,0.12), 0 0 60px rgba(224,210,183,0.06); }
}

.pw-divider {
  width: clamp(60px, 10vw, 110px); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(224,210,183,0.4), transparent);
  margin: clamp(5px, 1.2vw, 10px) 0;
  animation: divAnim 5s ease-in-out infinite;
}
@keyframes divAnim {
  0%, 100% { width: clamp(50px, 7vw, 80px);   opacity: 0.3; }
  50%       { width: clamp(80px, 12vw, 120px); opacity: 0.6; }
}

/* LORE TEXT */
.pw-lore {
  font-family: 'Courier New', monospace;
  font-size: clamp(9px, 1.15vw, 12px); line-height: 1.8; letter-spacing: 1px;
  color: rgba(224,210,183,0.38); max-width: 580px;
  text-align: center; direction: rtl;
  margin-bottom: clamp(6px, 1.2vw, 10px);
  min-height: clamp(14px, 1.8vw, 20px);
  position: relative;
}
.pw-lore-line {
  position: absolute; width: 100%; left: 0; top: 0;
  opacity: 0; transition: opacity 1s ease;
  white-space: nowrap;
}
.pw-lore-line.active { opacity: 1; }

.redacted {
  display: inline-block; background: rgba(224,210,183,0.15);
  color: transparent; border-radius: 1px; padding: 0 4px;
  user-select: none; font-size: 0.9em;
}

/* SUBJECTS */
.pw-subjects { display: flex; gap: clamp(16px,3vw,32px); margin-top: clamp(5px,1.2vw,10px); align-items: center; }
.pw-subject {
  font-family: Georgia, serif;
  font-size: clamp(8px, 1.1vw, 11px); letter-spacing: 3px;
  color: rgba(224,210,183,0.28); text-transform: uppercase;
  animation: subjectPulse 8s ease-in-out infinite;
}
.pw-subject:nth-child(3) { animation-delay: 4s; }
@keyframes subjectPulse {
  0%, 100% { color: rgba(224,210,183,0.28); }
  50%       { color: rgba(224,210,183,0.5); }
}
.pw-subject-sep { width: 1px; height: clamp(10px,1.6vw,14px); background: rgba(224,210,183,0.16); }

/* REDACTED — plain text version */
.redacted {
  display: inline-block;
  background: rgba(224,210,183,0.12);
  color: rgba(224,210,183,0.15);
  border-radius: 1px;
  padding: 0 5px;
  font-size: 0.85em;
  letter-spacing: 1px;
  user-select: none;
  font-family: 'Courier New', monospace;
}

/* STAMP — جملة موثقة بنفس عرض العنوان */
.pw-stamp {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 520px;
  border: 1px solid rgba(224,210,183,0.18);
  padding: clamp(4px,0.8vw,7px) clamp(10px,1.5vw,18px);
  margin: clamp(4px,0.8vw,8px) 0 0 0;
  position: relative;
}

/* خطوط جانبية داخل البوردر */
.pw-stamp-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(224,210,183,0.25));
  display: block;
}
.pw-stamp-line:last-child {
  background: linear-gradient(270deg, transparent, rgba(224,210,183,0.25));
}

.pw-stamp-text {
  font-family: 'Courier New', monospace;
  font-size: clamp(7px, 0.85vw, 10px);
  letter-spacing: clamp(2px, 0.5vw, 4px);
  color: rgba(224,210,183,0.45);
  text-transform: uppercase;
  direction: rtl;
  white-space: nowrap;
}
