| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707 |
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta name="description" content="亿图腾(北京)科技有限公司 — 浠艾福(Care Family)家庭健康成长平台,围绕身、心、智、行、富五个维度,赋能每个家庭实现健康与幸福。">
- <meta name="keywords" content="亿图腾,浠艾福,Care Family,家庭教育,健康成长,五维能量,亲子成长,五行相生相克">
- <meta property="og:title" content="亿图腾 · 浠艾福 — 家庭健康成长平台">
- <meta property="og:description" content="给全家的一站式幸福提案 — 身·心·智·行·富 五维全景幸福矩阵 · 五行相生相克">
- <meta property="og:type" content="website">
- <meta name="theme-color" content="#FF8C42">
- <title>亿图腾 · 浠艾福 — 家庭健康成长平台</title>
- <link rel="stylesheet" href="css/style.css">
- </head>
- <body>
- <!-- ==================== Navigation ==================== -->
- <header class="site-header" id="header">
- <div class="container header-inner">
- <a href="#hero" class="logo">
- <img src="logo.png" alt="浠艾福" class="logo-img" width="36" height="36">
- <span class="logo-text">亿图腾</span>
- <span class="logo-tag">· 浠艾福</span>
- </a>
- <button class="nav-toggle" id="navToggle" aria-label="切换导航">
- <span></span><span></span><span></span>
- </button>
- <nav class="nav" id="nav">
- <ul class="nav-list">
- <li><a href="#about" class="nav-link">关于我们</a></li>
- <li><a href="#product" class="nav-link">浠艾福</a></li>
- <li><a href="#wuxing" class="nav-link">五维哲学</a></li>
- <li><a href="#dimensions" class="nav-link">五维幸福</a></li>
- <li><a href="#features" class="nav-link">核心功能</a></li>
- <li><a href="#roles" class="nav-link">平台角色</a></li>
- <li><a href="#contact" class="nav-link">联系我们</a></li>
- </ul>
- </nav>
- </div>
- </header>
- <!-- ==================== Hero ==================== -->
- <section class="hero" id="hero">
- <div class="hero-bg"></div>
- <div class="container hero-inner">
- <div class="hero-content">
- <span class="hero-badge">家庭健康成长平台</span>
- <h1 class="hero-title">
- 给全家的<br>
- <span class="highlight">一站式幸福提案</span>
- </h1>
- <p class="hero-desc">
- 亿图腾科技倾力打造——<strong>浠艾福(Care Family)</strong>家庭健康成长俱乐部,
- 围绕 <strong>身·智·富·行·心</strong> 五大核心领域,
- 以五行哲学为根基,以五维能量为引擎,为每个家庭定制全生命周期解决方案。
- </p>
- <div class="hero-actions">
- <a href="#product" class="btn btn-primary">了解浠艾福</a>
- <a href="#wuxing" class="btn btn-outline">探索五维哲学</a>
- </div>
- <div class="hero-service-link">
- <span>服务商?</span>
- <a href="/admin/">登录管理后台 →</a>
- </div>
- </div>
- <div class="hero-visual">
- <div class="dimension-orbit">
- <div class="orbit-center">家</div>
- <div class="orbit-item o1" style="--i:0">身</div>
- <div class="orbit-item o2" style="--i:1">智</div>
- <div class="orbit-item o3" style="--i:2">富</div>
- <div class="orbit-item o4" style="--i:3">行</div>
- <div class="orbit-item o5" style="--i:4">心</div>
- </div>
- </div>
- </div>
- <div class="scroll-indicator">
- <span>向下滚动</span>
- <div class="scroll-arrow"></div>
- </div>
- </section>
- <!-- ==================== About ==================== -->
- <section class="section section-about" id="about">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">关于我们</span>
- <h2 class="section-title">亿图腾(北京)科技有限公司</h2>
- <p class="section-desc">
- 以科技为引擎,以家庭为中心,致力于为中国家庭提供一站式健康成长解决方案。
- </p>
- </div>
- <div class="about-grid">
- <div class="about-card">
- <div class="about-icon">
- <svg viewBox="0 0 48 48" fill="none" width="48" height="48"><circle cx="24" cy="24" r="20" stroke="#FF8C42" stroke-width="2" fill="#FFF5E6"/><path d="M24 32s-7-5-7-9c0-2.5 2-4.5 4-4.5s3 1.5 3 3c0-1.5 1-3 3-3s4 2 4 4.5c0 4-7 9-7 9z" fill="#FF8C42" fill-opacity=".15" stroke="#FF8C42" stroke-width="1.5" stroke-linejoin="round"/><path d="M17 20c-1-3 1-6 4-6s4 2 4 4-2 4-4 4-4-1-4-2z" fill="#FF8C42" fill-opacity=".15" stroke="#FF8C42" stroke-width="1.5"/><circle cx="32" cy="18" r="2.5" fill="#FF8C42" fill-opacity=".3"/></svg>
- </div>
- <h3>企业使命</h3>
- <p>用科技赋能每个家庭,让健康与幸福成为每个家庭的生活方式。</p>
- </div>
- <div class="about-card">
- <div class="about-icon">
- <svg viewBox="0 0 48 48" fill="none" width="48" height="48"><circle cx="24" cy="24" r="20" stroke="#4ECDC4" stroke-width="2" fill="#E6FFF9"/><circle cx="17" cy="19" r="4" fill="#4ECDC4" fill-opacity=".15" stroke="#4ECDC4" stroke-width="1.5"/><circle cx="31" cy="19" r="4" fill="#4ECDC4" fill-opacity=".15" stroke="#4ECDC4" stroke-width="1.5"/><circle cx="24" cy="32" r="4" fill="#4ECDC4" fill-opacity=".15" stroke="#4ECDC4" stroke-width="1.5"/><path d="M20 22l-1 2M28 22l1 2M22 29l-3-6M26 29l3-6" stroke="#4ECDC4" stroke-width="1.2" stroke-linecap="round"/></svg>
- </div>
- <h3>核心产品</h3>
- <p>浠艾福(Care Family)—— 连接家庭客户、专业服务商与平台的三方协同成长服务平台。</p>
- </div>
- <div class="about-card">
- <div class="about-icon">
- <svg viewBox="0 0 48 48" fill="none" width="48" height="48"><circle cx="24" cy="24" r="20" stroke="#FFD93D" stroke-width="2" fill="#FFFDE6"/><circle cx="24" cy="12" r="3" fill="#FFD93D" fill-opacity=".4"/><circle cx="35.5" cy="19.5" r="3" fill="#FFD93D" fill-opacity=".4"/><circle cx="31" cy="33" r="3" fill="#FFD93D" fill-opacity=".4"/><circle cx="17" cy="33" r="3" fill="#FFD93D" fill-opacity=".4"/><circle cx="12.5" cy="19.5" r="3" fill="#FFD93D" fill-opacity=".4"/><path d="M24 15L33 21l-3 10H18l-3-10z" stroke="#FFD93D" stroke-width="1.5" fill="#FFD93D" fill-opacity=".08" stroke-linejoin="round"/></svg>
- </div>
- <h3>品牌理念</h3>
- <p>家庭的成长不只是孩子的教育,更是全家在五个维度上的共同提升。</p>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Product (XAF) ==================== -->
- <section class="section section-product" id="product">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">核心产品</span>
- <h2 class="section-title">浠艾福 · Care Family</h2>
- <p class="section-desc">
- 以家庭为单位的健康成长平台,围绕五大维度,通过活动、课程、商品、任务、咨询等多元服务,
- 连接家庭客户、专业服务商与平台运营三方角色,以五维能量体系驱动全家持续成长。
- </p>
- </div>
- <div class="product-showcase">
- <div class="product-intro">
- <div class="product-quote">
- <p>"在充满变化的时代,一个家庭最顶级、最稳固的幸福——<br>
- 是身体的舒服长久,是下一代的大智慧,<br>
- 是长辈与家族的爱心传承,是知行合一的活力,<br>
- 更是衣食无忧的底气。"</p>
- </div>
- <div class="product-stats">
- <div class="stat">
- <span class="stat-num">5</span>
- <span class="stat-label">五维幸福维度</span>
- </div>
- <div class="stat">
- <span class="stat-num">3</span>
- <span class="stat-label">三方角色协同</span>
- </div>
- <div class="stat">
- <span class="stat-num">50+</span>
- <span class="stat-label">功能页面</span>
- </div>
- <div class="stat">
- <span class="stat-num">15+</span>
- <span class="stat-label">核心功能模块</span>
- </div>
- </div>
- </div>
- <!-- 幸福三支柱 -->
- <div class="pillar-section">
- <h3 class="pillar-heading">一个家庭最顶级、最稳固的幸福</h3>
- <div class="pillar-grid">
- <div class="pillar-card" style="--pillar-color:#F59E0B;--pillar-bg:#FFFBEB;">
- <div class="pillar-icon">
- <svg viewBox="0 0 48 48" fill="none" width="40" height="40"><circle cx="24" cy="24" r="20" stroke="#F59E0B" stroke-width="2" fill="#FFFBEB"/><path d="M18 30c2-6 10-6 12 0" stroke="#F59E0B" stroke-width="2" stroke-linecap="round"/><circle cx="24" cy="18" r="5" fill="#F59E0B" fill-opacity=".12" stroke="#F59E0B" stroke-width="1.5"/><path d="M15 22l3 2M33 22l-3 2" stroke="#F59E0B" stroke-width="1.2" stroke-linecap="round"/></svg>
- </div>
- <h4>衣食无忧</h4>
- <p>经济基础决定家庭底气,依托低门槛创客生态实现第二收入曲线,让每个家庭不为物质所困。</p>
- </div>
- <div class="pillar-card" style="--pillar-color:#FF6B9D;--pillar-bg:#FFF0F5;">
- <div class="pillar-icon">
- <svg viewBox="0 0 48 48" fill="none" width="40" height="40"><circle cx="24" cy="24" r="20" stroke="#FF6B9D" stroke-width="2" fill="#FFF0F5"/><path d="M32 18c0-3-2-5-4-5s-4 2-4 4c0-2-2-4-4-4s-4 2-4 5" stroke="#FF6B9D" stroke-width="2" stroke-linecap="round"/><path d="M24 34s-6-4-6-8c0-2 1.5-3.5 3-3.5s3 1.5 3 3c0-1.5 1.5-3 3-3s3 1.5 3 3.5c0 4-6 8-6 8z" fill="#FF6B9D" fill-opacity=".12" stroke="#FF6B9D" stroke-width="1.5" stroke-linejoin="round"/></svg>
- </div>
- <h4>子女传承</h4>
- <p>将家族智慧与家风代代相传,在爱与价值观的滋养中,培养下一代健全人格与核心竞争力。</p>
- </div>
- <div class="pillar-card" style="--pillar-color:#6366F1;--pillar-bg:#EEF0FF;">
- <div class="pillar-icon">
- <svg viewBox="0 0 48 48" fill="none" width="40" height="40"><circle cx="24" cy="24" r="20" stroke="#6366F1" stroke-width="2" fill="#EEF0FF"/><path d="M24 14l3 3h4v4l3 3-3 3v4h-4l-3 3-3-3h-4v-4l-3-3 3-3v-4h4z" stroke="#6366F1" stroke-width="1.2" fill="#6366F1" fill-opacity=".08"/><path d="M24 18v12M18 24h12" stroke="#6366F1" stroke-width="1.8" stroke-linecap="round"/></svg>
- </div>
- <h4>受人尊敬</h4>
- <p>以智慧与品格赢得社会的敬仰与尊崇,在成长中成就个人价值、实现家族荣耀的升华。</p>
- </div>
- </div>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Wuxing Philosophy ==================== -->
- <section class="section section-wuxing" id="wuxing">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">五维哲学</span>
- <h2 class="section-title">五行相生相克 · 五维动态平衡</h2>
- <p class="section-desc">
- 五维幸福并非各自孤立,而是像一个有机生态系统——
- <strong>相生让系统前进,相克让系统不翻车</strong>。
- 每一维都在为下一维积蓄能量,同时也受到制约不至过度失衡。
- </p>
- </div>
- <!-- Wuxing Cycle Diagram -->
- <div class="wuxing-diagram">
- <canvas id="wuxingCanvas"></canvas>
- </div>
- <!-- Explanation Cards -->
- <div class="wuxing-explanations">
- <!-- 相生 -->
- <div class="we-section">
- <h3 class="we-title we-sheng">✨ 相生关系 · 循环促进</h3>
- <p class="we-subtitle">每一维为下一维注入能量,形成正向螺旋上升</p>
- <div class="we-grid">
- <div class="wuxing-card wc-sheng" style="--wc-color:#FF8C42">
- <span class="wc-arrow">身 → 智</span>
- <h4>身生智</h4>
- <p>强健体魄孕育智慧,身心健康奠定智慧根基。</p>
- </div>
- <div class="wuxing-card wc-sheng" style="--wc-color:#6366F1">
- <span class="wc-arrow">智 → 富</span>
- <h4>智生富</h4>
- <p>智慧启迪财富之门,知识赋能价值创造。</p>
- </div>
- <div class="wuxing-card wc-sheng" style="--wc-color:#F59E0B">
- <span class="wc-arrow">富 → 行</span>
- <h4>富生行</h4>
- <p>财富滋养关系网络,经济从容成就人情温暖。</p>
- </div>
- <div class="wuxing-card wc-sheng" style="--wc-color:#10B981">
- <span class="wc-arrow">行 → 心</span>
- <h4>行生心</h4>
- <p>关系和谐温暖心灵,良好人际滋养爱与归属。</p>
- </div>
- <div class="wuxing-card wc-sheng" style="--wc-color:#FF6B9D">
- <span class="wc-arrow">心 → 身</span>
- <h4>心生身</h4>
- <p>家族大爱呵护健康,情感关怀滋养体魄。</p>
- </div>
- </div>
- </div>
- <!-- 相克 -->
- <div class="we-section">
- <h3 class="we-title we-ke">⚖️ 相克关系 · 动态制衡</h3>
- <p class="we-subtitle">每个维度都有制约机制,防止任何一维过度膨胀</p>
- <div class="we-grid">
- <div class="wuxing-card wc-ke" style="--wc-color:#FF8C42">
- <span class="wc-arrow">身 ⨯ 富</span>
- <h4>身克富</h4>
- <p>健康是最大财富,莫用健康换金钱。</p>
- </div>
- <div class="wuxing-card wc-ke" style="--wc-color:#6366F1">
- <span class="wc-arrow">智 ⨯ 行</span>
- <h4>智克行</h4>
- <p>算计人际关系得失不如真诚以待,关系不需要完美策略。</p>
- </div>
- <div class="wuxing-card wc-ke" style="--wc-color:#F59E0B">
- <span class="wc-arrow">富 ⨯ 心</span>
- <h4>富克心</h4>
- <p>勿让铜臭掩盖温情,财富服务于家庭。</p>
- </div>
- <div class="wuxing-card wc-ke" style="--wc-color:#10B981">
- <span class="wc-arrow">行 ⨯ 身</span>
- <h4>行克身</h4>
- <p>人际有度,关爱有方,莫因取悦他人透支自身健康。</p>
- </div>
- <div class="wuxing-card wc-ke" style="--wc-color:#FF6B9D">
- <span class="wc-arrow">心 ⨯ 智</span>
- <h4>心克智</h4>
- <p>大爱需留理性空间,不过度保护。</p>
- </div>
- </div>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Five Dimensions ==================== -->
- <section class="section section-dimensions" id="dimensions">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">五维幸福矩阵</span>
- <h2 class="section-title">身 · 智 · 富 · 行 · 心</h2>
- <p class="section-desc">
- 五大维度覆盖家庭健康成长的方方面面,能量值按比例分配至各维度,
- 综合计算健康指数,直观呈现家庭成长状态。
- </p>
- </div>
- <div class="dimension-grid">
- <!-- 身(土) — 01 -->
- <div class="dimension-card" style="--dim-color: #FF8C42; --dim-bg: #FFF5E6;">
- <h3 class="dim-title">
- <span class="dim-emoji">🌏</span>
- 身 · 主动健康
- <span class="dim-element" style="background:#FF8C42">五行属土</span>
- </h3>
- <p class="dim-desc">用最适合、最简单的方法(好水与精准营养),从根源调理家人体质。让身体无疾,心情愉快,畅享高质量的舒服长寿生活。</p>
- <ul class="dim-points">
- <li>精准营养推荐</li>
- <li>健康报告解析</li>
- <li>体质调理方案</li>
- </ul>
- <div class="dim-energy">
- <h4>⚡ 能量提升</h4>
- <ul>
- <li>均衡膳食营养,三餐定时定量</li>
- <li>规律作息睡眠,早睡早起</li>
- <li>适度运动锻炼,每周3-5次</li>
- <li>定期健康检测,防患于未然</li>
- </ul>
- </div>
- </div>
- <!-- 智(金) — 02 -->
- <div class="dimension-card" style="--dim-color: #6366F1; --dim-bg: #EEF0FF;">
- <h3 class="dim-title">
- <span class="dim-emoji">⚔️</span>
- 智 · 赋能未来
- <span class="dim-element" style="background:#6366F1">五行属金</span>
- </h3>
- <p class="dim-desc">通过专业心智测评与综合素质培养,开启青少年面向未来的大智慧、健全人格与核心竞争力。</p>
- <ul class="dim-points">
- <li>专业心智测评</li>
- <li>综合素质培养</li>
- <li>成长档案追踪</li>
- </ul>
- <div class="dim-energy">
- <h4>⚡ 能量提升</h4>
- <ul>
- <li>广泛阅读积累,建立知识体系</li>
- <li>参与专业心智测评,认识自我</li>
- <li>培养一项核心兴趣技能</li>
- <li>跨学科思维训练,开拓视野</li>
- </ul>
- </div>
- </div>
- <!-- 富(水) — 03 -->
- <div class="dimension-card" style="--dim-color: #F59E0B; --dim-bg: #FFFBEB;">
- <h3 class="dim-title">
- <span class="dim-emoji">💧</span>
- 富 · 利他创富
- <span class="dim-element" style="background:#F59E0B">五行属水</span>
- </h3>
- <p class="dim-desc">依托低门槛的创客成长生态,在利他分享中顺便实现家庭的"第二收入曲线",实现物质与精神的双重富沛。</p>
- <ul class="dim-points">
- <li>创客成长生态</li>
- <li>积分奖励体系</li>
- <li>服务套餐市场</li>
- </ul>
- <div class="dim-energy">
- <h4>⚡ 能量提升</h4>
- <ul>
- <li>财商启蒙教育,树立正确金钱观</li>
- <li>参与创客成长计划</li>
- <li>利他分享,创造价值</li>
- <li>积分奖励激励,正向循环</li>
- </ul>
- </div>
- </div>
- <!-- 行(木) — 04 -->
- <div class="dimension-card" style="--dim-color: #10B981; --dim-bg: #ECFDF5;">
- <h3 class="dim-title">
- <span class="dim-emoji">🌿</span>
- 行 · 人际和谐
- <span class="dim-element" style="background:#10B981">五行属木</span>
- </h3>
- <p class="dim-desc">"行"不仅是行动与行为,更核心的是人与人的关系——亲子关系、夫妻关系、同事关系、朋友关系。以和谐关系滋养家庭幸福,以善意行动温暖身边每一个人。</p>
- <ul class="dim-points">
- <li>亲子关系建设</li>
- <li>夫妻情感经营</li>
- <li>社交与人脉拓展</li>
- </ul>
- <div class="dim-energy">
- <h4>⚡ 能量提升</h4>
- <ul>
- <li>高质量陪伴家人,每日专注沟通</li>
- <li>夫妻定期约会,经营亲密关系</li>
- <li>主动维系朋友与同事关系</li>
- <li>参与社区活动,拓展社交圈</li>
- </ul>
- </div>
- </div>
- <!-- 心(火) — 05 -->
- <div class="dimension-card" style="--dim-color: #FF6B9D; --dim-bg: #FFF0F5;">
- <h3 class="dim-title">
- <span class="dim-emoji">🔥</span>
- 心 · 大爱相随
- <span class="dim-element" style="background:#FF6B9D">五行属火</span>
- </h3>
- <p class="dim-desc">将长辈陪护与家庭情感,升华为以"心"传心的家族纽带。用大爱反哺父母,用言传身教启迪下一代。</p>
- <ul class="dim-points">
- <li>情绪管理与疏导</li>
- <li>家庭情感联结</li>
- <li>家风传承记录</li>
- </ul>
- <div class="dim-energy">
- <h4>⚡ 能量提升</h4>
- <ul>
- <li>坚持家庭情感沟通,每周家庭会议</li>
- <li>高质量亲子陪伴,放下手机全心投入</li>
- <li>培养感恩之心,每日分享与表达</li>
- <li>传承家风文化,记录家族故事</li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Features ==================== -->
- <section class="section section-features" id="features">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">核心功能</span>
- <h2 class="section-title">全方位家庭成长服务</h2>
- <p class="section-desc">
- 从任务管理到五维能量,从专业测评到成长档案,浠艾福为每个家庭提供完整的数字化成长解决方案。
- </p>
- </div>
- <div class="features-grid">
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#FF8C42"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><path d="M6 16l6 6 14-14" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg></div>
- <h3>任务管理系统</h3>
- <p>创建、下发、执行与审核,支持小游戏互动,让好习惯在趣味中养成。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#4ECDC4"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><circle cx="16" cy="16" r="10" stroke="currentColor" stroke-width="2"/><path d="M16 10v6l4 4" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"/></svg></div>
- <h3>五维能量体系</h3>
- <p>身心灵全方位能量追踪,能量按比例分配,健康指数可视化呈现。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#6366F1"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><rect x="6" y="10" width="20" height="14" rx="2" stroke="currentColor" stroke-width="2"/><path d="M10 6v4M22 6v4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg></div>
- <h3>测评预约系统</h3>
- <p>家长申请、选择规划师、支付、结果录入,全流程线上化,专业测评报告一键获取。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#FF6B9D"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><path d="M16 26S6 20 6 14c0-3 2-5 5-5s5 2 5 4c0-2 2-4 5-4s5 2 5 5c0 6-10 12-10 12z" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/></svg></div>
- <h3>家庭邀请与关系</h3>
- <p>邀请二维码、令牌验证、家庭关系图,轻松构建家庭数字空间。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#F59E0B"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><path d="M16 4l3 9h10l-8 6 3 9-8-5-8 5 3-9-8-6h10l3-9z" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/></svg></div>
- <h3>心愿与奖励</h3>
- <p>孩子创建心愿、家长审批兑换,积分驱动的正向激励体系。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#10B981"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><path d="M8 24h16M8 8v16M8 8l16 8-16 8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg></div>
- <h3>套餐与商城</h3>
- <p>服务套餐市场、商品商城、订单管理,连接优质服务商与家庭需求。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#A78BFA"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><path d="M8 6v20M8 16l4-4 4 4 8-8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg></div>
- <h3>成长档案</h3>
- <p>成长记录、健康报告、成长计划,完整记录每个家庭的成长轨迹。</p>
- </div>
- <div class="feature-card">
- <div class="feature-icon" style="--fc:#0EA5E9"><svg viewBox="0 0 32 32" fill="none" width="32" height="32"><circle cx="16" cy="10" r="4" stroke="currentColor" stroke-width="2"/><path d="M6 28c0-6 4-10 10-10s10 4 10 10" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg></div>
- <h3>多角色支持</h3>
- <p>家长、孩子、成长规划师、平台运营,四类角色各司其职,协同成长。</p>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Roles ==================== -->
- <section class="section section-roles" id="roles">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">平台角色</span>
- <h2 class="section-title">三方协同 · 各司其职</h2>
- <p class="section-desc">
- 浠艾福连接家庭客户、专业服务商与平台运营三方角色,构建完整的家庭成长服务生态。
- </p>
- </div>
- <div class="roles-flow">
- <div class="role-card role-parent">
- <div class="role-badge">客户</div>
- <div class="role-icon" style="display:flex;gap:4px;justify-content:center;">
- <svg viewBox="0 0 48 48" fill="none" width="36" height="36"><circle cx="24" cy="24" r="20" stroke="#FF8C42" stroke-width="2" fill="#FFF5E6"/><circle cx="24" cy="18" r="6" fill="#FF8C42" fill-opacity=".2" stroke="#FF8C42" stroke-width="1.5"/><path d="M14 36c0-6 4-10 10-10s10 4 10 10" stroke="#FF8C42" stroke-width="2" stroke-linecap="round"/></svg>
- </div>
- <h3>家庭客户</h3>
- <p>以家庭为服务单位,覆盖全家各年龄段成员的健康成长需求。</p>
- <ul class="role-perms">
- <li><strong>家长</strong> — 付费决策、任务审批、成长管理</li>
- <li><strong>孩子</strong> — 执行任务、参与活动、收集成长徽章</li>
- <li><strong>老人</strong> — 健康管理、亲情陪伴、家风传承</li>
- </ul>
- <div class="role-qr">
- <div class="role-qr-code">
- <svg viewBox="0 0 100 100" fill="none" width="72" height="72">
- <rect width="100" height="100" rx="6" fill="#fff"/>
- <rect x="6" y="6" width="22" height="22" rx="3" stroke="#222" stroke-width="2" fill="#fff"/>
- <rect x="10" y="10" width="14" height="14" rx="2" fill="#222"/>
- <rect x="14" y="14" width="6" height="6" fill="#fff"/>
- <rect x="72" y="6" width="22" height="22" rx="3" stroke="#222" stroke-width="2" fill="#fff"/>
- <rect x="76" y="10" width="14" height="14" rx="2" fill="#222"/>
- <rect x="80" y="14" width="6" height="6" fill="#fff"/>
- <rect x="6" y="72" width="22" height="22" rx="3" stroke="#222" stroke-width="2" fill="#fff"/>
- <rect x="10" y="76" width="14" height="14" rx="2" fill="#222"/>
- <rect x="14" y="80" width="6" height="6" fill="#fff"/>
- <rect x="34" y="6" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="44" y="6" width="6" height="6" rx="1" fill="#222"/>
- <rect x="54" y="6" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="64" y="6" width="4" height="6" rx="1" fill="#222"/>
- <rect x="6" y="34" width="6" height="6" rx="1" fill="#222"/>
- <rect x="16" y="34" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="28" y="34" width="6" height="6" rx="1" fill="#222"/>
- <rect x="38" y="34" width="4" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="46" y="34" width="6" height="6" rx="1" fill="#222"/>
- <rect x="56" y="34" width="6" height="6" rx="1" fill="#222"/>
- <rect x="66" y="34" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="84" y="34" width="6" height="6" rx="1" fill="#222"/>
- <rect x="94" y="34" width="4" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="6" y="44" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="16" y="44" width="6" height="4" rx="1" fill="#222"/>
- <rect x="26" y="44" width="6" height="6" rx="1" fill="#222"/>
- <rect x="36" y="44" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="46" y="46" width="6" height="4" rx="1" fill="#222"/>
- <rect x="56" y="44" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="76" y="44" width="6" height="6" rx="1" fill="#222"/>
- <rect x="86" y="44" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="6" y="54" width="6" height="6" rx="1" fill="#222"/>
- <rect x="16" y="56" width="6" height="4" rx="1" fill="#222"/>
- <rect x="28" y="54" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="44" y="54" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="54" y="54" width="6" height="6" rx="1" fill="#222"/>
- <rect x="64" y="54" width="6" height="6" rx="1" fill="#222"/>
- <rect x="84" y="54" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="34" y="64" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="44" y="64" width="6" height="6" rx="1" fill="#222"/>
- <rect x="64" y="64" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="74" y="64" width="6" height="6" rx="1" fill="#222"/>
- <rect x="84" y="64" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="94" y="64" width="4" height="6" rx="1" fill="#222"/>
- <rect x="36" y="76" width="6" height="6" rx="1" fill="#222"/>
- <rect x="46" y="76" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="58" y="76" width="6" height="6" rx="1" fill="#222"/>
- <rect x="68" y="76" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="84" y="76" width="6" height="6" rx="1" fill="#222"/>
- <rect x="94" y="76" width="4" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="6" y="86" width="6" height="6" rx="1" fill="#222"/>
- <rect x="16" y="86" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="28" y="86" width="6" height="6" rx="1" fill="#222"/>
- <rect x="44" y="86" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="58" y="86" width="6" height="6" rx="1" fill="#222"/>
- <rect x="68" y="86" width="6" height="6" rx="1" fill="#222"/>
- <rect x="78" y="86" width="6" height="6" rx="1" fill="#FF8C42" opacity=".7"/>
- <rect x="90" y="86" width="6" height="6" rx="1" fill="#222"/>
- </svg>
- </div>
- <span class="role-qr-label">扫码开启</span>
- </div>
- </div>
- <div class="roles-connector">
- <div class="connector-arrow"></div>
- <div class="connector-label">服务</div>
- </div>
- <div class="role-card role-teacher">
- <div class="role-badge">服务商</div>
- <div class="role-icon" style="display:flex;gap:4px;justify-content:center;">
- <svg viewBox="0 0 48 48" fill="none" width="36" height="36"><circle cx="24" cy="24" r="20" stroke="#3B82F6" stroke-width="2" fill="#F0F7FF"/><path d="M16 28c2-6 14-6 16 0M24 18a3 3 0 100-6 3 3 0 000 6z" stroke="#3B82F6" stroke-width="2" stroke-linecap="round"/></svg>
- </div>
- <h3>专业服务团队</h3>
- <p>多领域专业服务者,为家庭提供全方位的成长支持与解决方案。</p>
- <ul class="role-perms">
- <li><strong>成长规划师</strong> — 成长路径规划、任务下发、测评解读</li>
- <li><strong>健康营养师</strong> — 精准营养方案、体质调理指导</li>
- <li><strong>心理咨询师</strong> — 情绪疏导、家庭关系、心智评估</li>
- <li><strong>活动管理员</strong> — 亲子活动组织、主题沙龙策划</li>
- </ul>
- <a href="/admin/" class="role-login-btn">登录管理后台</a>
- </div>
- <div class="roles-connector">
- <div class="connector-arrow"></div>
- <div class="connector-label">运营</div>
- </div>
- <div class="role-card role-admin">
- <div class="role-badge">平台</div>
- <div class="role-icon" style="display:flex;gap:4px;justify-content:center;">
- <svg viewBox="0 0 48 48" fill="none" width="36" height="36"><circle cx="24" cy="24" r="20" stroke="#6366F1" stroke-width="2" fill="#EEF0FF"/><rect x="16" y="14" width="16" height="20" rx="2" stroke="#6366F1" stroke-width="2"/><path d="M20 22h8M20 28h6" stroke="#6366F1" stroke-width="2" stroke-linecap="round"/></svg>
- </div>
- <h3>平台运营</h3>
- <p>系统管理者,审核入驻、配置系统、数据管理、操作日志。</p>
- <ul class="role-perms">
- <li>用户与家庭管理</li>
- <li>商品套餐审核</li>
- <li>系统配置与数据</li>
- <li>操作日志审计</li>
- </ul>
- <a href="/admin/" class="role-login-btn">登录管理后台</a>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Contact ==================== -->
- <section class="section section-contact" id="contact">
- <div class="container">
- <div class="section-header">
- <span class="section-tag">联系我们</span>
- <h2 class="section-title">携手共建家庭幸福未来</h2>
- <p class="section-desc">
- 无论您是家长、成长规划师,还是合作伙伴,我们都期待与您一起,
- 为中国家庭的健康成长贡献力量。
- </p>
- </div>
- <div class="contact-grid">
- <div class="contact-info">
- <div class="contact-item">
- <svg viewBox="0 0 24 24" fill="none" width="24" height="24"><circle cx="12" cy="12" r="10" stroke="#FF8C42" stroke-width="2"/><path d="M12 6v8l4 4" stroke="#FF8C42" stroke-width="2" stroke-linecap="round"/></svg>
- <div>
- <strong>公司全称</strong>
- <span>亿图腾(北京)科技有限公司</span>
- </div>
- </div>
- <div class="contact-item">
- <svg viewBox="0 0 24 24" fill="none" width="24" height="24"><rect x="4" y="6" width="16" height="12" rx="2" stroke="#FF8C42" stroke-width="2"/><path d="M4 8l8 5 8-5" stroke="#FF8C42" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
- <div>
- <strong>产品名称</strong>
- <span>浠艾福(Care Family)</span>
- </div>
- </div>
- <div class="contact-item">
- <svg viewBox="0 0 24 24" fill="none" width="24" height="24"><path d="M12 2C8 2 4 5 4 9c0 5 8 13 8 13s8-8 8-13c0-4-4-7-8-7z" stroke="#FF8C42" stroke-width="2"/><circle cx="12" cy="9" r="3" stroke="#FF8C42" stroke-width="2"/></svg>
- <div>
- <strong>公司地址</strong>
- <span>中国 · 北京</span>
- </div>
- </div>
- </div>
- <div class="contact-cta">
- <p>欢迎体验浠艾福家庭健康成长平台</p>
- <p class="cta-sub">微信小程序搜索「浠艾福」即可体验</p>
- <div class="cta-cards">
- <div class="cta-card">
- <span class="cta-card-icon">📱</span>
- <span>家长端</span>
- <span class="cta-card-desc">管理家庭成长</span>
- </div>
- <div class="cta-card">
- <span class="cta-card-icon">👤</span>
- <span>孩子端</span>
- <span class="cta-card-desc">完成任务挑战</span>
- </div>
- <div class="cta-card">
- <span class="cta-card-icon">📊</span>
- <span>规划师端</span>
- <span class="cta-card-desc">专业服务管理</span>
- </div>
- </div>
- </div>
- </div>
- </div>
- </section>
- <!-- ==================== Footer ==================== -->
- <footer class="site-footer">
- <div class="container">
- <div class="footer-inner">
- <div class="footer-brand">
- <img src="logo.png" alt="浠艾福" class="footer-logo-img" width="48" height="48">
- <span class="logo-text">亿图腾</span>
- <span class="logo-tag">· 浠艾福</span>
- <p>以科技赋能每个家庭,让健康与幸福触手可及。</p>
- </div>
- <div class="footer-links">
- <div class="footer-col">
- <h4>产品</h4>
- <ul>
- <li><a href="#product">浠艾福平台</a></li>
- <li><a href="#dimensions">五维幸福</a></li>
- <li><a href="#features">核心功能</a></li>
- </ul>
- </div>
- <div class="footer-col">
- <h4>关于</h4>
- <ul>
- <li><a href="#about">公司介绍</a></li>
- <li><a href="#roles">平台角色</a></li>
- <li><a href="#contact">联系方式</a></li>
- </ul>
- </div>
- </div>
- </div>
- <div class="footer-bottom">
- <p>© 2026 亿图腾(北京)科技有限公司. All rights reserved.</p>
- </div>
- </div>
- </footer>
- <!-- JavaScript -->
- <script src="js/main.js"></script>
- </body>
- </html>
|