/* =========================================================
   ULTRA GREEK ULTIMATE DESIGN
   Future Tech + Cyberpunk + Metallic Newsroom
   =============================================== */

/* ---- Animated background with moving tech lines ---- */
@keyframes ugTechLines {
  0% { background-position: 0 0, 0 0; }
  100% { background-position: 400px 800px, -400px -800px; }
}

/* ---- Global container ---- */
.ulse-ultimate {
  font-family: "Noto Sans", Arial, sans-serif;
  max-width: 980px;
  margin: 60px auto;
  padding: 60px 50px;

  background:
    linear-gradient(to bottom right, rgba(0,15,35,0.9), rgba(0,0,0,0.95)),
    repeating-linear-gradient(90deg,
      rgba(0,120,255,0.08) 0px, rgba(0,120,255,0.08) 2px,
      transparent 2px, transparent 6px),
    repeating-linear-gradient(0deg,
      rgba(0,120,255,0.04) 0px, rgba(0,120,255,0.04) 1px,
      transparent 1px, transparent 4px);
  background-size: auto, 200px 200px, 200px 200px;
  animation: ugTechLines 25s linear infinite;

  border-radius: 28px;
  box-shadow:
    0 0 60px rgba(0, 160, 255, 0.45),
    inset 0 0 40px rgba(0, 100, 200, 0.25);

  backdrop-filter: blur(18px);
  position: relative;
  overflow: hidden;
  color: #d9ecff;

  animation: ugFadeIn 1.3s ease forwards;
  opacity: 0;
}

/* ---- Fade-in ---- */
@keyframes ugFadeIn {
  from { opacity: 0; transform: translateY(25px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---- Scanner bars top/bottom ---- */
.ulse-ultimate:before,
.ulse-ultimate:after {
  content: "";
  position: absolute;
  width: 180%;
  height: 4px;
  left: -40%;
  background: linear-gradient(90deg, #007bff, #00eaff, #9146ff, #00d4ff);
  opacity: 0.8;
  filter: blur(1px);
  animation: ugScan 5.5s linear infinite;
}

.ulse-ultimate:before { top: 0; }
.ulse-ultimate:after { bottom: 0; }

@keyframes ugScan {
  from { transform: translateX(0); }
  to   { transform: translateX(100%); }
}

/* ---- Headings ---- */
.ulse-ultimate h2 {
  margin-top: 45px;
  margin-bottom: 18px;
  font-size: 34px;
  font-weight: 800;

  background: linear-gradient(90deg, #63b3ff, #9fd4ff, #df78ff, #63b3ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  text-shadow:
    0 0 15px rgba(0,180,255,0.6),
    0 0 25px rgba(80,0,150,0.45);

  letter-spacing: -0.3px;
  position: relative;
}

/* metallic underline */
.ulse-ultimate h2::after {
  content: "";
  display: block;
  width: 95px;
  height: 4px;
  background: linear-gradient(90deg, #00aaff, #00f0ff, #ad5cff);
  border-radius: 3px;
  margin-top: 10px;
  opacity: 0.95;
  box-shadow: 0 0 14px rgba(0,200,255,0.85);
  transition: width 0.35s ease;
}

.ulse-ultimate h2:hover::after {
  width: 150px;
}

/* ---- Paragraphs ---- */
.ulse-ultimate p {
  font-size: 19px;
  line-height: 1.85;
  margin-bottom: 26px;
  color: #e7f2ff;
  text-shadow: 0 0 10px rgba(0,60,140,0.5);
}

/* ---- Links ---- */
.ulse-ultimate a {
  color: #80e4ff;
  text-decoration: none;
  font-weight: 700;
  position: relative;
}

.ulse-ultimate a:hover {
  color: #c4f3ff;
}

/* neon underline */
.ulse-ultimate a::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  height: 2px;
  width: 0%;
  background: linear-gradient(90deg, #5ddcff, #b877ff);
  box-shadow: 0 0 12px #5ddcff;
  transition: width 0.35s ease;
}

.ulse-ultimate a:hover::after {
  width: 100%;
}

/* ---- Images ---- */
.ulse-ultimate img {
  width: 100%;
  border-radius: 20px;
  margin: 35px 0;
  box-shadow:
    0 0 35px rgba(0,150,255,0.45),
    0 0 90px rgba(120,0,200,0.25);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.ulse-ultimate img:hover {
  transform: scale(1.05);
  box-shadow:
    0 0 55px rgba(0,180,255,0.6),
    0 0 120px rgba(150,0,255,0.45);
}

/* ---- Center text ---- */
.ulse-ultimate .center {
  text-align: center;
  font-size: 20px;
  margin-top: 10px;
  color: #9bddff;
  text-shadow: 0 0 14px rgba(0,150,255,0.9);
}