|
|
<?php
|
|
|
/**
|
|
|
* The template for displaying 404 pages (Not Found)
|
|
|
* Theme: NENGHUI Energy - Borderless Digital Space & 3D Typography
|
|
|
*/
|
|
|
// 强制修改标题
|
|
|
add_filter('pre_get_document_title', function() { return '404'; }, 9999);
|
|
|
add_filter('wp_title', function() { return '404'; }, 9999);
|
|
|
|
|
|
get_header(); ?>
|
|
|
|
|
|
<style>
|
|
|
:root {
|
|
|
--nh-primary: #13eca4;
|
|
|
--nh-dark: #121010;
|
|
|
--nh-bg-light: #f8fcfa;
|
|
|
}
|
|
|
|
|
|
/* 确保主背景通透大气 */
|
|
|
.nh-404-canvas {
|
|
|
min-height: 100vh;
|
|
|
background: #f8fcfa; /* 使用你定义的背景底色 */
|
|
|
background: linear-gradient(135deg, #f8fcfa 0%, #f0f7f5 50%, #dcfce7 60%);
|
|
|
font-family: 'Inter', sans-serif;
|
|
|
color: var(--nh-dark);
|
|
|
position: relative;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.font-display { font-family: 'Space Grotesk', sans-serif; }
|
|
|
|
|
|
/* * 核心视觉：3D 立体悬浮数字 404
|
|
|
* 利用多层 text-shadow 营造绿色霓虹的厚度感
|
|
|
*/
|
|
|
.text-3d-glow {
|
|
|
color: white; /* 亮色前景 */
|
|
|
/* 1层：核心亮绿霓虹 */
|
|
|
text-shadow: 0 1px 0 #b3f3db,
|
|
|
0 2px 0 #83f0ca,
|
|
|
0 3px 0 #54eeb8,
|
|
|
0 4px 0 #13eca4, /* 主色层 */
|
|
|
/* 2层：向下的柔和深色投影 */
|
|
|
0 6px 1px rgba(0,0,0,0.1),
|
|
|
0 0 5px rgba(0,0,0,0.1),
|
|
|
/* 3层：绿色氛围发光 (Neon Glow) */
|
|
|
0 1px 15px rgba(19, 236, 164, 0.4),
|
|
|
0 3px 25px rgba(19, 236, 164, 0.2);
|
|
|
}
|
|
|
|
|
|
/* 微动效 */
|
|
|
@keyframes float-soft {
|
|
|
0%, 100% { transform: translateY(0); }
|
|
|
50% { transform: translateY(-10px); }
|
|
|
}
|
|
|
.floating-text {
|
|
|
animation: float-soft 5s ease-in-out infinite;
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
<main class="nh-404-canvas relative flex items-center justify-center p-8 overflow-hidden">
|
|
|
|
|
|
<div class="fixed inset-0 pointer-events-none z-0">
|
|
|
<div class="absolute -top-[10%] -left-[10%] w-[50%] h-[50%] bg-primary/5 rounded-full blur-[150px] animate-blob-spin"></div>
|
|
|
<div class="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] bg-teal-200/20 rounded-full blur-[120px]"></div>
|
|
|
</div>
|
|
|
|
|
|
<div class="relative z-10 w-full max-w-4xl text-center" data-aos="fade-up" data-aos-duration="1200">
|
|
|
|
|
|
<div class="flex flex-col items-center mb-24">
|
|
|
<h1 class="text-3d-glow font-display text-[150px] md:text-[200px] font-black tracking-tighter leading-none floating-text">
|
|
|
404
|
|
|
</h1>
|
|
|
</div>
|
|
|
|
|
|
<div class="space-y-6 mb-24 flex flex-col items-center">
|
|
|
|
|
|
|
|
|
|
|
|
<h2 class="font-display text-3xl text-background-dark tracking-tight leading-tight max-w-lg">
|
|
|
Oops! That page can't be found.
|
|
|
</h2>
|
|
|
<p>You might have typed in the wrong address or the page has moved.</p>
|
|
|
</div>
|
|
|
|
|
|
<div class="flex flex-col sm:flex-row items-center justify-center gap-8 mt-12 w-full sm:w-auto">
|
|
|
<a href="<?php echo esc_url( home_url( '/' ) ); ?>"
|
|
|
class="w-full sm:w-auto px-16 h-16 bg-primary text-background-dark font-bold rounded-full flex items-center justify-center shadow-lg shadow-primary/20 hover:shadow-primary/40 hover:scale-105 transition-all duration-300 text-xs uppercase tracking-[0.2em]">
|
|
|
Go Homepage
|
|
|
</a>
|
|
|
|
|
|
<a href="<?php echo esc_url( home_url( '/contact-us/' ) ); ?>"
|
|
|
class="w-full sm:w-auto px-16 h-16 bg-white/60 backdrop-blur-md border border-primary/10 text-background-dark font-bold rounded-full flex items-center justify-center hover:bg-white transition-all duration-300 text-xs uppercase tracking-[0.2em]">
|
|
|
Contact Us
|
|
|
</a>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</main>
|
|
|
<script>
|
|
|
// 最终保险：JS 强制修改标题
|
|
|
document.title = "Shanghai Nenghui Energy: Innovative ESS Solutions";
|
|
|
</script>
|
|
|
<?php get_footer(); ?>
|
