139 lines
16 KiB
PHP
139 lines
16 KiB
PHP
<?php
|
||
get_header();
|
||
$cfg = gx_asset_config();
|
||
$stats = $cfg['stats'];
|
||
$news = new WP_Query(array('post_type' => 'post', 'posts_per_page' => 5, 'ignore_sticky_posts' => false));
|
||
?>
|
||
<div class="w-full">
|
||
<section class="relative min-h-screen flex flex-col pt-36 md:pt-48 pb-12 md:pb-32 bg-apple-grey overflow-hidden">
|
||
<div class="absolute top-0 left-0 w-full h-full overflow-hidden z-0 opacity-30 pointer-events-none">
|
||
<div class="absolute top-[-10%] right-[-20%] w-[800px] h-[800px] bg-blue-100 rounded-full blur-[120px]"></div>
|
||
<div class="absolute bottom-[-10%] left-[-20%] w-[600px] h-[600px] bg-purple-100 rounded-full blur-[100px]"></div>
|
||
</div>
|
||
<div class="relative z-10 max-w-7xl mx-auto px-4 md:px-6 flex flex-col items-center text-center">
|
||
<div class="mb-10 animate-fade-in">
|
||
<span class="inline-flex items-center gap-2 px-4 py-2 border border-gray-200/60 rounded-full text-xs md:text-sm font-medium text-gray-500 bg-white/80 backdrop-blur-md shadow-sm tracking-wide">
|
||
<span class="w-1.5 h-1.5 rounded-full bg-apple-blue animate-pulse"></span>
|
||
恭学教育，天津专升本轻奢品牌
|
||
</span>
|
||
</div>
|
||
<h1 class="text-4xl md:text-6xl lg:text-7xl font-semibold text-apple-dark mb-10 md:mb-14 leading-[1.1] tracking-tight animate-slide-up max-w-5xl mx-auto">
|
||
赋能未来，<br class="md:hidden"><span class="text-apple-blue">让升本更简单。</span>
|
||
</h1>
|
||
<div class="w-full max-w-4xl aspect-video bg-black rounded-[1.5rem] md:rounded-[2rem] shadow-2xl overflow-hidden relative group animate-slide-up mb-12 md:mb-16" data-gx-video>
|
||
<video data-src="<?php echo esc_url($cfg['hero_video_url']); ?>" poster="<?php echo esc_url($cfg['hero_video_cover']); ?>" class="w-full h-full object-cover opacity-0 transition-opacity duration-500" preload="none"></video>
|
||
<img data-gx-cover src="<?php echo esc_url($cfg['hero_video_cover']); ?>" alt="Brand Video Cover" class="absolute inset-0 w-full h-full object-cover opacity-60 group-hover:opacity-40 transition-opacity duration-500 scale-105 group-hover:scale-100">
|
||
<button data-gx-play class="absolute inset-0 flex items-center justify-center cursor-pointer" aria-label="播放视频">
|
||
<span class="w-16 h-16 md:w-24 md:h-24 bg-white/20 backdrop-blur-md rounded-full flex items-center justify-center border border-white/30 group-hover:scale-110 transition-transform">
|
||
<svg class="text-white fill-white ml-1" width="32" height="32" viewBox="0 0 24 24"><polygon points="5 3 19 12 5 21 5 3"/></svg>
|
||
</span>
|
||
</button>
|
||
<div class="absolute bottom-4 left-4 md:bottom-10 md:left-10 text-left pointer-events-none">
|
||
<h3 class="text-white font-bold text-lg md:text-2xl">了解恭学教育</h3>
|
||
<p class="text-gray-300 text-xs md:text-base">观看 2025 年度品牌宣传片</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex flex-wrap gap-3 md:gap-5 justify-center animate-slide-up">
|
||
<a href="<?php echo esc_url(home_url('/online-school/')); ?>" class="px-5 py-2.5 md:px-9 md:py-4 bg-apple-blue hover:bg-apple-blue-hover text-white rounded-full text-sm md:text-lg font-medium transition-all transform hover:scale-105 shadow-lg flex items-center justify-center gap-1.5 md:gap-2">开始学习 <svg class="md:w-5 md:h-5" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="m9 18 6-6-6-6"/></svg></a>
|
||
<a href="<?php echo esc_url(home_url('/question-bank/')); ?>" class="px-5 py-2.5 md:px-9 md:py-4 bg-white/90 backdrop-blur-md text-apple-blue border-2 border-apple-blue/30 rounded-full text-sm md:text-lg font-medium hover:bg-apple-blue hover:text-white hover:border-apple-blue transition-all flex items-center justify-center gap-1.5 md:gap-2"><svg class="md:w-5 md:h-5" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14c0 1.66 4.03 3 9 3s9-1.34 9-3V5"/><path d="M3 12c0 1.66 4.03 3 9 3s9-1.34 9-3"/></svg>大数据中心</a>
|
||
<button data-gx-modal-open="#gx-enroll-modal" class="px-5 py-2.5 md:px-9 md:py-4 bg-white/90 backdrop-blur-md text-apple-blue border-2 border-apple-blue/30 rounded-full text-sm md:text-lg font-medium hover:bg-apple-blue hover:text-white hover:border-apple-blue transition-all flex items-center justify-center gap-1.5 md:gap-2"><svg class="md:w-5 md:h-5" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><line x1="19" y1="8" x2="19" y2="14"/><line x1="22" y1="11" x2="16" y2="11"/></svg>报名上课</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-12 md:py-32 bg-white">
|
||
<div class="max-w-7xl mx-auto px-4 md:px-6">
|
||
<div class="mb-14 md:mb-20 text-center md:text-left">
|
||
<h2 class="text-3xl md:text-5xl font-semibold text-apple-dark mb-5 tracking-tight">核心产品生态</h2>
|
||
<p class="text-lg md:text-xl text-gray-500 max-w-2xl mx-auto md:mx-0 leading-relaxed">科技与教育的完美融合。精心打磨的每一个细节，只为给你最高效的学习体验。</p>
|
||
</div>
|
||
<div class="grid grid-cols-1 lg:grid-cols-12 gap-6 lg:gap-8">
|
||
<a href="<?php echo esc_url(home_url('/question-bank/')); ?>" class="lg:col-span-7 relative group overflow-hidden rounded-[2.5rem] bg-black shadow-2xl transition-transform hover:scale-[1.01] flex flex-col md:flex-row">
|
||
<div class="absolute inset-0 bg-gradient-to-br from-[#1c1c1e] to-black"></div>
|
||
<div class="relative z-20 flex-1 p-10 md:p-12 flex flex-col justify-center items-start">
|
||
<div class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/10 border border-white/5 backdrop-blur-md mb-6"><svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor" class="text-yellow-400"><path d="m12 2 2.4 6.9 7.3.2-5.8 4.4 2.1 7-6-4.1-6 4.1 2.1-7-5.8-4.4 7.3-.2L12 2z"/></svg><span class="text-xs font-bold text-gray-200 tracking-wide uppercase">AI Algorithm 4.0</span></div>
|
||
<h3 class="text-3xl md:text-5xl font-bold text-white mb-6 leading-tight">恭学刷题<br><span class="text-blue-500">智能进化。</span></h3>
|
||
<p class="text-gray-400 text-base md:text-lg mb-8 max-w-sm leading-relaxed">不只是刷题。大数据精准诊断，哪里不会练哪里，复习效率提升 300%。</p>
|
||
<span class="px-6 py-3 bg-white text-black rounded-full font-bold text-sm">立即体验</span>
|
||
</div>
|
||
<div class="relative z-10 flex-1 min-h-[300px] flex items-end justify-center md:justify-end md:pr-12 pb-0">
|
||
<div class="relative w-[240px] md:w-[260px] translate-y-[15%] group-hover:translate-y-[5%] transition-transform duration-700">
|
||
<?php gx_phone_mockup($cfg['question_bank_mockup']); ?>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<div class="lg:col-span-5 flex flex-col gap-6 lg:gap-8">
|
||
<a href="<?php echo esc_url(home_url('/online-school/')); ?>" class="flex-1 group overflow-hidden rounded-[2rem] md:rounded-[2.5rem] bg-blue-50/50 border border-blue-100 transition-all hover:shadow-xl p-8 flex flex-col sm:flex-row items-center gap-6">
|
||
<div class="flex-1 text-center sm:text-left">
|
||
<div class="text-apple-blue font-medium mb-3 text-xs uppercase tracking-widest flex items-center gap-2 justify-center sm:justify-start"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect width="14" height="20" x="5" y="2" rx="2" ry="2"/><path d="M12 18h.01"/></svg>Online Class</div>
|
||
<h3 class="text-2xl md:text-3xl font-bold text-apple-dark mb-2">恭学网校</h3>
|
||
<p class="text-gray-500 text-sm mb-6">线上课 APP 随身学</p>
|
||
<span class="text-apple-blue text-sm font-semibold">下载 APP ›</span>
|
||
</div>
|
||
<div class="relative w-[140px] flex-shrink-0 -rotate-[5deg] group-hover:rotate-0 transition-transform"><?php gx_phone_mockup($cfg['online_school_mockup']); ?></div>
|
||
</a>
|
||
<a href="<?php echo esc_url(home_url('/books/')); ?>" class="flex-1 group overflow-hidden rounded-[2rem] md:rounded-[2.5rem] bg-[#F5F5F0] transition-all hover:shadow-xl flex flex-col sm:flex-row items-center justify-between p-8 md:p-10 gap-6">
|
||
<div class="relative z-10 w-full sm:w-1/2 text-center sm:text-left">
|
||
<div class="text-orange-600 font-medium mb-3 text-xs uppercase tracking-widest flex items-center gap-2 justify-center sm:justify-start"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></svg>Publishing</div>
|
||
<h3 class="text-2xl md:text-3xl font-bold text-apple-dark mb-2">权威教材</h3>
|
||
<p class="text-gray-500 text-sm mb-6">年年迭代，紧扣大纲。</p>
|
||
<span class="text-apple-dark font-semibold text-sm">浏览书店 →</span>
|
||
</div>
|
||
<div class="gx-book w-full sm:w-1/2 max-w-[180px]"><img src="<?php echo esc_url($cfg['books'][0]['image']); ?>" alt="天津专升本数学"></div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-white border-t border-gray-100">
|
||
<div class="max-w-7xl mx-auto px-6 grid grid-cols-2 md:grid-cols-4 gap-8">
|
||
<div class="text-center p-6"><div data-count-end="<?php echo esc_attr($stats['years']); ?>" data-count-suffix="+" class="text-4xl md:text-5xl font-bold text-apple-dark">0+</div><div class="text-gray-500 text-sm uppercase">年专注专升本</div></div>
|
||
<div class="text-center p-6"><div class="text-4xl md:text-5xl font-bold text-apple-dark"><?php echo esc_html($stats['students']); ?></div><div class="text-gray-500 text-sm uppercase">累计服务学员</div></div>
|
||
<div class="text-center p-6"><div class="text-4xl md:text-5xl font-bold text-apple-dark"><?php echo esc_html($stats['coverage']); ?></div><div class="text-gray-500 text-sm uppercase">真题覆盖率</div></div>
|
||
<div class="text-center p-6"><div data-count-end="<?php echo esc_attr($stats['schools']); ?>" data-count-suffix="所" class="text-4xl md:text-5xl font-bold text-apple-dark">0所</div><div class="text-gray-500 text-sm uppercase">合作院校</div></div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-24 bg-apple-grey">
|
||
<div class="max-w-7xl mx-auto px-6">
|
||
<div class="text-center mb-16"><div class="inline-block px-3 py-1 rounded-full bg-white border border-gray-200 text-xs font-bold text-gray-500 mb-4 uppercase tracking-wider">Corporate Culture</div><h2 class="text-3xl md:text-4xl font-bold text-apple-dark">企业文化</h2></div>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||
<?php foreach (array(array('正直','坚守底线，以德为先'),array('进取','勇于突破，拒绝平庸'),array('协作','开放协同，持续进化'),array('创造','超越创新，探索未来')) as $item): ?>
|
||
<div class="bg-white p-8 rounded-3xl shadow-sm hover:shadow-lg transition-all flex flex-col items-center text-center"><div class="w-16 h-16 rounded-2xl bg-gray-50 flex items-center justify-center mb-6 text-apple-blue text-2xl">◆</div><h3 class="text-xl font-bold text-apple-dark mb-2"><?php echo esc_html($item[0]); ?></h3><p class="text-gray-500 text-sm"><?php echo esc_html($item[1]); ?></p></div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="relative py-10 md:py-16 bg-apple-grey">
|
||
<div class="max-w-7xl mx-auto px-4 md:px-6"><div class="relative rounded-3xl overflow-hidden shadow-2xl"><img src="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=1600&q=80" alt="恭学愿景" class="w-full h-[300px] md:h-[450px] object-cover"><div class="absolute inset-0 bg-gradient-to-t from-black/70 via-black/30 to-transparent"></div><div class="absolute inset-0 flex flex-col items-center justify-center text-center px-6"><h2 class="text-white text-3xl md:text-5xl font-bold mb-4">种种用心，只为你能省心</h2><p class="text-gray-200 text-sm md:text-lg max-w-2xl">不懈探索、勇于突破、脚踏实地、求真务实。</p></div></div></div>
|
||
</section>
|
||
|
||
<section class="py-20 md:py-28 bg-[#F5F5F7]">
|
||
<div class="max-w-7xl mx-auto px-4 md:px-6"><div class="text-center mb-14"><div class="text-apple-blue font-semibold text-sm tracking-widest uppercase mb-3">Dedicated Member</div><h2 class="text-3xl md:text-4xl font-bold text-apple-dark">核心团队</h2></div><div class="grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6">
|
||
<?php foreach ($cfg['team'] as $member): ?><div class="bg-white rounded-2xl md:rounded-3xl p-6 md:p-8 flex flex-col items-center text-center shadow-sm hover:shadow-xl transition-all group"><div class="w-20 h-20 md:w-28 md:h-28 rounded-full overflow-hidden mb-4 md:mb-6 ring-4 ring-white shadow-lg"><img src="<?php echo esc_url($member['avatar']); ?>" alt="<?php echo esc_attr($member['name']); ?>" class="w-full h-full object-cover" loading="lazy"></div><h3 class="text-base md:text-xl font-bold text-apple-dark mb-1"><?php echo esc_html($member['name']); ?></h3><p class="text-gray-500 text-xs md:text-sm"><?php echo esc_html($member['role']); ?></p></div><?php endforeach; ?>
|
||
</div></div>
|
||
</section>
|
||
|
||
<section class="py-20 md:py-28 bg-apple-grey">
|
||
<div class="max-w-4xl mx-auto px-4 md:px-6"><div class="flex justify-between items-end mb-10 md:mb-14"><h2 class="text-2xl md:text-3xl font-bold text-apple-dark">行业动态 & 咨询</h2><a href="<?php echo esc_url(gx_knowledge_url()); ?>" class="text-apple-blue font-medium hover:underline">查看更多 ›</a></div><div class="space-y-4 md:space-y-6">
|
||
<?php if ($news->have_posts()): while ($news->have_posts()): $news->the_post(); $cats = get_the_category(); $cat = !empty($cats) ? $cats[0]->name : '文章'; ?>
|
||
<a href="<?php the_permalink(); ?>" class="bg-white p-5 md:p-6 rounded-2xl shadow-sm hover:shadow-md transition-shadow flex flex-col md:flex-row gap-4 md:gap-6 items-start md:items-center group"><div class="bg-blue-50 group-hover:bg-apple-blue group-hover:text-white transition-colors text-apple-blue px-4 py-2 rounded-lg font-bold text-center min-w-[80px]"><div class="text-lg md:text-xl"><?php echo esc_html(get_the_date('d')); ?></div><div class="text-xs uppercase"><?php echo esc_html(get_the_date('m')); ?>月</div></div><div class="flex-1"><div class="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2"><?php echo esc_html($cat); ?></div><h3 class="text-lg md:text-xl font-bold text-apple-dark mb-2 group-hover:text-apple-blue"><?php the_title(); ?></h3><p class="text-apple-text-gray text-sm line-clamp-2"><?php echo esc_html(wp_trim_words(get_the_excerpt(), 26)); ?></p></div></a>
|
||
<?php endwhile; wp_reset_postdata(); endif; ?>
|
||
</div></div>
|
||
</section>
|
||
</div>
|
||
|
||
<div id="gx-enroll-modal" class="gx-modal">
|
||
<div class="gx-modal-backdrop"></div>
|
||
<div class="gx-modal-panel p-8 text-center">
|
||
<button data-gx-modal-close class="absolute top-4 right-4 p-2 rounded-full hover:bg-gray-100">×</button>
|
||
<h3 class="text-2xl font-bold text-gray-900 mb-2">扫码添加客服</h3>
|
||
<p class="text-gray-500 mb-6">添加微信客服，获取课程规划</p>
|
||
<div class="bg-gray-50 rounded-2xl p-6 inline-block"><img src="<?php echo esc_url($cfg['customer_service_qrcode']); ?>" alt="客服二维码" class="w-64 h-64 rounded-lg"></div>
|
||
<p class="text-sm text-gray-400 mt-6">工作时间：周一至周日 9:00-21:00</p>
|
||
</div>
|
||
</div>
|
||
<?php get_footer(); ?>
|