update 4page
This commit is contained in:
@@ -0,0 +1,535 @@
|
||||
/**
|
||||
* About Us 2 — from Figma AIFO About Us-2 (node 11157:34903).
|
||||
*/
|
||||
#about-us-2 {
|
||||
--primary: #f98715;
|
||||
--primary-hover: #f9a215;
|
||||
--bg-page: #070400;
|
||||
--bg-card: #0e0e0e;
|
||||
--border-muted: #989795;
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
--text-secondary: #ccc;
|
||||
--aifo-page-bg-height: 920px;
|
||||
--aifo-page-content-offset: 1.375rem;
|
||||
background: var(--bg-page);
|
||||
color: var(--text-main);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#about-us-2 {
|
||||
--aifo-page-bg-height: 520px;
|
||||
--aifo-page-content-offset: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
#about-us-2 .au2-page {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
padding: 0 18px 80px;
|
||||
}
|
||||
|
||||
#about-us-2 .text-orange {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/* ── Buttons ── */
|
||||
#about-us-2 .au2-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
padding: 16px 32px;
|
||||
min-height: 52px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.16px;
|
||||
color: var(--text-main);
|
||||
background: var(--primary);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-btn:hover {
|
||||
background: var(--primary-hover);
|
||||
box-shadow: inset 0 5px 10px rgba(249, 135, 21, 0.6), 0 5px 10px rgba(249, 135, 21, 0.6);
|
||||
color: var(--text-main);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-btn--outline {
|
||||
background: rgba(15, 15, 15, 0.5);
|
||||
border: 0.657px solid #666;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-btn--outline:hover {
|
||||
background: rgba(249, 135, 21, 0.08);
|
||||
border-color: var(--primary);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* ── Shared typography ── */
|
||||
#about-us-2 .au2-label {
|
||||
margin: 0 0 12px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-section-title {
|
||||
margin: 0 0 16px;
|
||||
font-size: clamp(32px, 4.5vw, 48px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.48px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-section-title--center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-section-desc {
|
||||
margin: 0 0 48px;
|
||||
font-size: 18px;
|
||||
line-height: 1.5;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-section-desc--center {
|
||||
text-align: center;
|
||||
max-width: 560px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* ── Hero ── */
|
||||
#about-us-2 .au2-hero {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 72px 0 64px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero__glow {
|
||||
position: absolute;
|
||||
top: -40px;
|
||||
left: 50%;
|
||||
width: min(90vw, 720px);
|
||||
height: 360px;
|
||||
transform: translateX(-50%);
|
||||
background: radial-gradient(ellipse at center, rgba(249, 135, 21, 0.35) 0%, transparent 70%);
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero__inner {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 720px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero__title {
|
||||
margin: 0 0 24px;
|
||||
font-size: clamp(40px, 6vw, 64px);
|
||||
line-height: 1.12;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero__desc {
|
||||
margin: 0 auto 32px;
|
||||
max-width: 620px;
|
||||
font-size: clamp(16px, 2.2vw, 20px);
|
||||
line-height: 1.55;
|
||||
font-weight: 400;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero__actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
/* ── Intro ── */
|
||||
#about-us-2 .au2-intro {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
align-items: center;
|
||||
gap: 48px;
|
||||
padding: 48px 0 64px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-intro__title {
|
||||
margin: 0 0 20px;
|
||||
font-size: clamp(28px, 4vw, 40px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.4px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-intro__text {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.7;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-intro__visual img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 16px;
|
||||
border: 0.5px solid rgba(152, 151, 149, 0.35);
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
/* ── Stats ── */
|
||||
#about-us-2 .au2-stats {
|
||||
padding: 0 0 72px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__bar {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 0;
|
||||
padding: 40px 24px;
|
||||
border-radius: 16px;
|
||||
background: url("../images/backgrounds/bg_key_states.png") center / 100% 100% no-repeat;
|
||||
border: 0.5px solid rgba(152, 151, 149, 0.22);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__item {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__item:not(:last-child)::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 1px;
|
||||
height: 48px;
|
||||
background: rgba(255, 255, 255, 0.13);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__value {
|
||||
margin: 0 0 6px;
|
||||
font-size: clamp(24px, 3vw, 34px);
|
||||
font-weight: 800;
|
||||
line-height: 1.2;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__label {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
line-height: 1.4;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
|
||||
/* ── CTA Banner ── */
|
||||
#about-us-2 .au2-cta {
|
||||
position: relative;
|
||||
margin: 0 0 72px;
|
||||
padding: 64px 32px;
|
||||
border-radius: 20px;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
border: 0.5px solid rgba(152, 151, 149, 0.22);
|
||||
background: rgba(12, 12, 12, 0.85);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-cta__glow {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 80%;
|
||||
height: 200px;
|
||||
transform: translate(-50%, -50%);
|
||||
background: radial-gradient(ellipse at center, rgba(249, 135, 21, 0.3) 0%, transparent 70%);
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-cta__inner {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 560px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-cta__title {
|
||||
margin: 0 0 16px;
|
||||
font-size: clamp(28px, 4vw, 40px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-cta__desc {
|
||||
margin: 0 0 28px;
|
||||
font-size: 16px;
|
||||
line-height: 1.55;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* ── Core Values ── */
|
||||
#about-us-2 .au2-values {
|
||||
padding: 0 0 72px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-values__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 24px;
|
||||
margin-top: 48px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-value-card {
|
||||
padding: 32px 28px;
|
||||
border-radius: 16px;
|
||||
border: 0.5px solid rgba(152, 151, 149, 0.35);
|
||||
background: var(--bg-card);
|
||||
transition: border-color 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-value-card:hover {
|
||||
border-color: rgba(249, 135, 21, 0.4);
|
||||
box-shadow: 0 8px 32px rgba(249, 135, 21, 0.08);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-value-card__icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 12px;
|
||||
background: rgba(249, 135, 21, 0.1);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-value-card__icon img {
|
||||
display: block;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-value-card__title {
|
||||
margin: 0 0 12px;
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-value-card__text {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
line-height: 1.65;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* ── Testimonials ── */
|
||||
#about-us-2 .au2-testimonials {
|
||||
padding: 0 0 72px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonials__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial {
|
||||
padding: 24px;
|
||||
border-radius: 15px;
|
||||
border: 0.5px solid var(--border-muted);
|
||||
background: var(--bg-card);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial--wide {
|
||||
grid-column: span 2;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial__flag.fi {
|
||||
width: 28px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial__name {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial__meta {
|
||||
margin: 2px 0 0;
|
||||
font-size: 14px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial__quote {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
line-height: 1.7;
|
||||
font-weight: 300;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* ── Support ── */
|
||||
#about-us-2 .au2-support {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
align-items: center;
|
||||
gap: 48px;
|
||||
padding: 48px 0 0;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support__title {
|
||||
margin: 0 0 16px;
|
||||
font-size: clamp(28px, 4vw, 36px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support__desc {
|
||||
margin: 0 0 28px;
|
||||
font-size: 16px;
|
||||
line-height: 1.55;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support__actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support__visual {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support__visual img {
|
||||
display: block;
|
||||
width: min(100%, 360px);
|
||||
height: auto;
|
||||
filter: drop-shadow(0 0 40px rgba(249, 135, 21, 0.35));
|
||||
}
|
||||
|
||||
/* ── Responsive ── */
|
||||
@media (max-width: 991px) {
|
||||
#about-us-2 .au2-intro {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-intro__visual {
|
||||
order: -1;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__bar {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 32px 16px;
|
||||
background-image: url("../images/backgrounds/bg_key_states_mb.png");
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__item:nth-child(2)::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__item:nth-child(odd):not(:last-child)::after {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-values__grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonials__grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-testimonial--wide {
|
||||
grid-column: span 1;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support {
|
||||
grid-template-columns: 1fr;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-support__actions {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#about-us-2 .au2-page {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
padding-bottom: 56px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero {
|
||||
padding-top: 48px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-hero__actions,
|
||||
#about-us-2 .au2-support__actions {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-btn {
|
||||
width: 100%;
|
||||
max-width: 280px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__bar {
|
||||
padding: 32px 16px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-stats__item::after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-cta {
|
||||
padding: 48px 20px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
#about-us-2 .au2-values,
|
||||
#about-us-2 .au2-testimonials {
|
||||
padding-bottom: 48px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
/**
|
||||
* AIFO section glow — shared left/right decorative glows.
|
||||
* Copied from special-offer-50 (.so-welcome__glow, #special-offer-50::before).
|
||||
* Original special-offer-50 page is unchanged; import this file for new sections/pages.
|
||||
*/
|
||||
|
||||
:root {
|
||||
--aifo-glow-right-image: url("../images/backgrounds/new-user-promo-welcome-side-glow.png");
|
||||
--aifo-glow-left-image: url("../images/backgrounds/new-user-promo-corner-glow.png");
|
||||
--aifo-glow-right-width: min(82vw, 720px);
|
||||
--aifo-glow-left-top: 106px;
|
||||
--aifo-glow-left-offset: -2vw;
|
||||
--aifo-glow-left-size: min(60vw, 555px);
|
||||
--aifo-glow-left-max-height: min(52vh, 485px);
|
||||
}
|
||||
|
||||
/* Section-level host */
|
||||
.aifo-section-glow-host {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.aifo-section-glow-host > *:not(.aifo-glow-right):not(.left_bg_light) {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* Right — from .so-welcome__glow */
|
||||
.aifo-glow-right {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: calc((100% - 100vw) / 2);
|
||||
left: auto;
|
||||
bottom: auto;
|
||||
transform: translateY(-50%);
|
||||
width: var(--aifo-glow-right-width);
|
||||
height: 100vh;
|
||||
height: 100dvh;
|
||||
max-height: 100svh;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
background-color: transparent;
|
||||
background-image: var(--aifo-glow-right-image);
|
||||
background-repeat: no-repeat;
|
||||
background-position: right center;
|
||||
background-size: auto 100%;
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
/* Left — from #special-offer-50::before */
|
||||
.left_bg_light {
|
||||
position: absolute;
|
||||
top: var(--aifo-glow-left-top);
|
||||
left: var(--aifo-glow-left-offset);
|
||||
width: var(--aifo-glow-left-size);
|
||||
height: var(--aifo-glow-left-size);
|
||||
max-height: var(--aifo-glow-left-max-height);
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
background: var(--aifo-glow-left-image) no-repeat left top / cover;
|
||||
}
|
||||
|
||||
/* Page-level host (left glow on full page) */
|
||||
.aifo-page-glow-host {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.aifo-page-glow-host > .left_bg_light,
|
||||
.aifo-page-glow-host > .aifo-glow-right {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.aifo-page-glow-host > *:not(.left_bg_light):not(.aifo-glow-right) {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
+47
-4
@@ -1,5 +1,3 @@
|
||||
/* AIFO Footer — Figma ref: temp/底部栏20260610 Footer */
|
||||
|
||||
.aifo-foot {
|
||||
--foot-bg: #070400;
|
||||
--foot-accent: #f98715;
|
||||
@@ -8,9 +6,12 @@
|
||||
--foot-muted-60: rgba(255, 255, 255, 0.6);
|
||||
--foot-border: rgba(255, 255, 255, 0.16);
|
||||
--foot-chip-bg: rgba(255, 255, 255, 0.2);
|
||||
--foot-glow-overlap: clamp(72px, 11vw, 200px);
|
||||
position: relative;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
/* margin-top: calc(var(--foot-glow-overlap) * -1);
|
||||
padding-top: var(--foot-glow-overlap); */
|
||||
background: var(--foot-bg);
|
||||
color: var(--foot-text);
|
||||
font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
@@ -18,10 +19,43 @@
|
||||
|
||||
.aifo-foot__glow {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
width: max(100%, 1920px);
|
||||
height: clamp(560px, 72vw, 960px);
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
background: url("/assets/images/backgrounds/footer_bg.png") center bottom / cover no-repeat;
|
||||
background: url("../images/backgrounds/footer_bg.png") center bottom / 100% auto no-repeat;
|
||||
/* PNG 顶部为纯黑 #000，与 --foot-bg #070400 在宽屏下会形成硬边；顶部渐隐后与页面底色融合 */
|
||||
-webkit-mask-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent 0%,
|
||||
rgba(0, 0, 0, 0.25) 14%,
|
||||
rgba(0, 0, 0, 0.72) 28%,
|
||||
#000 42%,
|
||||
#000 100%
|
||||
);
|
||||
mask-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent 0%,
|
||||
rgba(0, 0, 0, 0.25) 14%,
|
||||
rgba(0, 0, 0, 0.72) 28%,
|
||||
#000 42%,
|
||||
#000 100%
|
||||
);
|
||||
}
|
||||
|
||||
.aifo-foot::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: var(--foot-glow-overlap);
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
background: linear-gradient(to bottom, var(--foot-bg) 0%, rgba(7, 4, 0, 0.55) 55%, transparent 100%);
|
||||
}
|
||||
|
||||
.aifo-foot__inner {
|
||||
@@ -139,6 +173,15 @@
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.aifo-foot__contact-label .icon-dianhua,
|
||||
.aifo-foot__contact-label .icon-youxiang,
|
||||
.aifo-foot__contact-label .icon-dizhi {
|
||||
flex-shrink: 0;
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
color: #f98715;
|
||||
}
|
||||
|
||||
.aifo-foot__contact-value {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
|
||||
+113
-7
@@ -1591,13 +1591,102 @@
|
||||
|
||||
/* home page */
|
||||
#block-1 {
|
||||
height: 90.9375rem;
|
||||
background-image: url("../images/backgrounds/20251203-153844.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
height: 39.9375rem;
|
||||
background-image: none;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.main {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* Hero background img — height derived from dots position + arc offset in source image
|
||||
*
|
||||
* Formula (object-fit: cover; object-position: center bottom; width-limited):
|
||||
* hero-bg-height = dots-bottom-y + arc-gap + viewportWidth × (arcOffsetPx / imageWidth)
|
||||
*
|
||||
* arcOffsetPx: arc peak distance from bottom of source PNG (measure once in Figma)
|
||||
* dots-bottom-y: distance from hero top to bottom of .home-hero-carousel__dots
|
||||
*/
|
||||
#homepage {
|
||||
--hero-img-width: 2880;
|
||||
--hero-img-height: 1982;
|
||||
--hero-img-arc-offset: 920;
|
||||
--hero-nav-gap: 76px;
|
||||
--hero-coach-dots-gap: 35px;
|
||||
--hero-dots-height: 10px;
|
||||
/* left column: badge top → AI Coach bottom */
|
||||
--hero-slide1-content-height: 486px;
|
||||
/* viewport height (fits right visual + left column) */
|
||||
--hero-slide1-viewport-height: 580px;
|
||||
--hero-inner-padding-bottom: 40px;
|
||||
/* Mobile: arc ~30px below dots (height-limited cover) */
|
||||
--hero-arc-gap: 30px;
|
||||
--hero-dots-y: calc(48px + 720px + 56px - 32px + 10px);
|
||||
}
|
||||
|
||||
#homepage .hero-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
/* Narrow screens: scale driven by height → solve H from dots + arc-gap */
|
||||
height: calc(
|
||||
(var(--hero-dots-y) + var(--hero-arc-gap)) * var(--hero-img-height)
|
||||
/ (var(--hero-img-height) - var(--hero-img-arc-offset))
|
||||
);
|
||||
object-fit: cover;
|
||||
object-position: center bottom;
|
||||
z-index: -1;
|
||||
background-color: #050302;
|
||||
display: block;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 991.98px) {
|
||||
#homepage {
|
||||
--hero-dots-y: calc(80px + 720px + 64px - 40px + 10px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage {
|
||||
--hero-arc-gap: 8px;
|
||||
--hero-bg-height-adjust: -15px;
|
||||
--hero-dots-y: calc(
|
||||
var(--hero-nav-gap) + var(--hero-slide1-content-height)
|
||||
+ var(--hero-coach-dots-gap) + var(--hero-dots-height)
|
||||
+ var(--hero-inner-padding-bottom)
|
||||
);
|
||||
}
|
||||
|
||||
#homepage .hero-bg {
|
||||
/* Wide screens: scale driven by width */
|
||||
height: calc(
|
||||
var(--hero-dots-y) + var(--hero-arc-gap)
|
||||
+ 100vw * var(--hero-img-arc-offset) / var(--hero-img-width)
|
||||
+ var(--hero-bg-height-adjust)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/* Fallback for pages without #homepage wrapper */
|
||||
.hero-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 39.9375rem;
|
||||
object-fit: cover;
|
||||
object-position: center bottom;
|
||||
z-index: -1;
|
||||
background-color: #050302;
|
||||
display: block;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#block-1 .hero-buttons {
|
||||
margin-top: 5rem;
|
||||
}
|
||||
@@ -5616,7 +5705,7 @@
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.footer .text-muted {
|
||||
.footer p.text-muted{
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
@@ -5625,10 +5714,27 @@
|
||||
padding-right: 1.9376rem;
|
||||
padding-left: 1.9376rem;
|
||||
}
|
||||
.footer .text-muted {
|
||||
.footer p.text-muted{
|
||||
padding: 0 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width:768px){
|
||||
.banner-desc br,#block-1{height:62.9375rem;position:relative;min-height:42vh;min-height:42svh}
|
||||
#homepage #block-1{
|
||||
height:auto;
|
||||
min-height:0;
|
||||
}
|
||||
.funded-trading-hero .d-flex .img-fluid-r{right:-13px}
|
||||
.hero-img{top:7px}
|
||||
.funded-trading-hero .d-flex .img-fluid-l{left:-3px}
|
||||
.funded-trading-hero .hero-title{font-size:35px}
|
||||
#section-6 h2{text-align:center}
|
||||
#section-3 h5 .h-inline-icon{margin-right:.25rem}
|
||||
.banner-desc br, .hero-bg { display: block; }
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 2500px) {
|
||||
.section-challenge .content-container {
|
||||
max-width: 70vw;
|
||||
|
||||
@@ -0,0 +1,262 @@
|
||||
/**
|
||||
* Leading V2 — header, footer, and page (from Figma export leading-v2).
|
||||
* Use with layout-v2.js + aifo-page-bg.css (same background pattern as promotion-activity).
|
||||
*/
|
||||
#leading-v2 {
|
||||
--primary: #f98715;
|
||||
--bg-page: #070400;
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
--aifo-page-bg-height: 805px;
|
||||
--aifo-page-content-offset: 1.375rem;
|
||||
--lv2-header-height: 5.75rem;
|
||||
background: var(--bg-page);
|
||||
color: var(--text-main);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#leading-v2 {
|
||||
--aifo-page-bg-height: 445px;
|
||||
--aifo-page-content-offset: 1rem;
|
||||
--lv2-header-height: 72px;
|
||||
}
|
||||
}
|
||||
|
||||
#leading-v2 {
|
||||
--aifo-nav-height: var(--lv2-header-height);
|
||||
}
|
||||
|
||||
/* ── Header (glass-panel — same as components/nav.html) ── */
|
||||
.lv2-header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 1541;
|
||||
padding: 0;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.lv2-header.glass-panel {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
.lv2-header__inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
max-width: 1128px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.lv2-header__inner {
|
||||
padding: 30px 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.lv2-header__logo {
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.lv2-header__logo img {
|
||||
display: block;
|
||||
height: 32px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/* ── Page ── */
|
||||
#leading-v2 .leading-v2-page {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
padding: 0 18px 24px;
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 48px 0 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#leading-v2 .lv2-hero {
|
||||
padding-top: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero__title {
|
||||
margin: 0;
|
||||
font-size: clamp(34px, 5vw, 60px);
|
||||
line-height: 1.15;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.01em;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero__title-accent {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero__subtitle {
|
||||
margin: 16px 0 0;
|
||||
font-size: clamp(18px, 2.5vw, 20px);
|
||||
line-height: 1.5;
|
||||
letter-spacing: -0.01em;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero__form {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
#leading-v2 #promo-compare-module {
|
||||
width: 100%;
|
||||
margin-top: 64px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#leading-v2 #promo-compare-module {
|
||||
margin-top: 112px;
|
||||
}
|
||||
}
|
||||
|
||||
#leading-v2 #promo-compare-module .promo-section {
|
||||
padding: 48px 0 24px;
|
||||
}
|
||||
|
||||
#leading-v2 #promo-compare-module .promo-section--compare {
|
||||
padding-top: 32px;
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#leading-v2 #promo-compare-module .promo-section {
|
||||
padding: 32px 0 16px;
|
||||
}
|
||||
|
||||
#leading-v2 #promo-compare-module .promo-section__title {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Footer (RegisterLanding) ── */
|
||||
.lv2-footer {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-top: 32px;
|
||||
padding: 40px 20px 48px;
|
||||
background: var(--bg-page);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.lv2-footer {
|
||||
padding: 40px 32px 48px;
|
||||
}
|
||||
}
|
||||
|
||||
.lv2-footer__glow {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
width: 120%;
|
||||
height: 400px;
|
||||
border-radius: 50%;
|
||||
background: var(--primary);
|
||||
opacity: 0.25;
|
||||
filter: blur(175px);
|
||||
transform: translateX(-50%);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.lv2-footer__inner {
|
||||
position: relative;
|
||||
max-width: 1046px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.lv2-footer__logo-row {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-bottom: 24px;
|
||||
border-bottom: 1px solid rgba(152, 151, 149, 0.5);
|
||||
}
|
||||
|
||||
.lv2-footer__logo img {
|
||||
display: block;
|
||||
height: 32px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.lv2-footer__text {
|
||||
margin: 32px 0 0;
|
||||
font-size: 13px;
|
||||
line-height: 20px;
|
||||
letter-spacing: -0.01em;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.lv2-footer__company {
|
||||
margin-top: 20px;
|
||||
font-size: 13px;
|
||||
line-height: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.lv2-footer__company p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.lv2-footer__bottom {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
margin-top: 32px;
|
||||
padding-top: 24px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
letter-spacing: 0.24px;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.lv2-footer__bottom {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
.lv2-footer__bottom > p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.lv2-footer__bottom-links {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px 32px;
|
||||
}
|
||||
|
||||
.lv2-footer__bottom-links a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
transition: color 0.2s ease;
|
||||
}
|
||||
|
||||
.lv2-footer__bottom-links a:hover {
|
||||
color: var(--primary);
|
||||
text-decoration: none;
|
||||
}
|
||||
@@ -0,0 +1,463 @@
|
||||
/**
|
||||
* ADL register form styles (from aifo theme adl-register.css).
|
||||
* Used by pages/modules/adl-register.section.html
|
||||
*/
|
||||
.adl-register {
|
||||
--adl-primary: #F98715;
|
||||
--adl-white: #FFFFFF;
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
color: var(--adl-white);
|
||||
}
|
||||
|
||||
.adl-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 12px 22px;
|
||||
border-radius: 12px;
|
||||
font-size: 13px;
|
||||
line-height: 24px;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
transition: .18s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.adl-btn-primary {
|
||||
background: var(--adl-primary);
|
||||
color: #fff;
|
||||
border: 1px solid rgba(255, 255, 255, .18);
|
||||
}
|
||||
|
||||
.adl-btn-primary:hover {
|
||||
color: #fff;
|
||||
background: #ffa12f;
|
||||
box-shadow: 0 0 16px rgba(249, 135, 21, .45);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.adl-btn-primary:disabled {
|
||||
opacity: 0.65;
|
||||
cursor: not-allowed;
|
||||
transform: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.adl-btn-ghost {
|
||||
background: rgba(255, 255, 255, .08);
|
||||
color: #fff;
|
||||
border: 1px solid rgba(255, 255, 255, .25);
|
||||
}
|
||||
|
||||
.adl-btn-ghost:hover {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, .16);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.adl-register {
|
||||
padding: 86px 0;
|
||||
background: linear-gradient(180deg, #090909, #050505);
|
||||
}
|
||||
|
||||
.adl-register-top {
|
||||
padding: 18px 0 74px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.adl-register-top .adl-register-box {
|
||||
max-width: 900px;
|
||||
box-shadow: 0 20px 55px rgba(0, 0, 0, .42);
|
||||
}
|
||||
|
||||
.adl-register .container {
|
||||
width: 100%;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.adl-register-box {
|
||||
max-width: 860px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
padding: 40px 30px;
|
||||
border-radius: 24px;
|
||||
border: 1px solid rgba(249, 135, 21, .46);
|
||||
background: radial-gradient(circle at 50% 0, rgba(249, 135, 21, .24), rgba(0, 0, 0, .28) 52%);
|
||||
backdrop-filter: blur(3px);
|
||||
}
|
||||
|
||||
.adl-register-box h2 {
|
||||
font-size: 56px;
|
||||
line-height: 64px;
|
||||
color: #fff;
|
||||
margin: 0 0 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.adl-register-box > p {
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
color: #fff;
|
||||
margin: 0 0 28px;
|
||||
opacity: .95;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.adl-register-form {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
background: rgba(255, 255, 255, .03);
|
||||
border: 1px solid rgba(255, 255, 255, .12);
|
||||
border-radius: 20px;
|
||||
padding: 20px 18px 16px;
|
||||
}
|
||||
|
||||
.adl-form-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.adl-field label {
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
margin: 0 0 8px;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
letter-spacing: .01em;
|
||||
}
|
||||
|
||||
.adl-field input,
|
||||
.adl-country-wrap select {
|
||||
width: 100%;
|
||||
height: 54px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid rgba(255, 255, 255, .24);
|
||||
background: rgba(0, 0, 0, .55);
|
||||
color: #fff;
|
||||
padding: 0 14px;
|
||||
font-size: 16px;
|
||||
transition: border-color .18s, box-shadow .18s, background .18s;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.adl-field input:focus,
|
||||
.adl-country-wrap select:focus {
|
||||
outline: none;
|
||||
border-color: rgba(249, 135, 21, .7);
|
||||
box-shadow: 0 0 0 3px rgba(249, 135, 21, .16);
|
||||
}
|
||||
|
||||
.adl-phone-row {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.adl-phone-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #111;
|
||||
border: 1px solid #2a2a2a;
|
||||
border-radius: 14px;
|
||||
padding: 2px 10px;
|
||||
position: relative;
|
||||
height: 54px;
|
||||
}
|
||||
|
||||
.adl-phone-wrapper:focus-within {
|
||||
border-color: #F98715;
|
||||
box-shadow: 0 0 0 3px rgba(249, 135, 21, .16);
|
||||
}
|
||||
|
||||
.adl-country-select {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
min-width: 92px;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.adl-country-flag {
|
||||
font-size: 18px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.adl-country-code {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.adl-country-arrow {
|
||||
font-size: 12px;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.adl-phone-input {
|
||||
background: transparent !important;
|
||||
border: 0 !important;
|
||||
box-shadow: none !important;
|
||||
flex: 1;
|
||||
height: 44px !important;
|
||||
padding: 8px 10px !important;
|
||||
}
|
||||
|
||||
.adl-country-menu {
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 56px;
|
||||
width: 100%;
|
||||
background: #1B1B1B;
|
||||
border: 1px solid #333;
|
||||
border-radius: 10px;
|
||||
padding: 8px;
|
||||
z-index: 30;
|
||||
max-height: 260px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.adl-country-menu.open {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.adl-country-search {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
border: 1px solid #3a3a3a;
|
||||
border-radius: 6px;
|
||||
background: #3a3a3a;
|
||||
color: #fff;
|
||||
padding: 0 10px;
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.adl-country-list {
|
||||
max-height: 190px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.adl-country-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 8px;
|
||||
border-radius: 6px;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.adl-country-item:hover {
|
||||
background: #2a2a2a;
|
||||
}
|
||||
|
||||
.adl-pass-wrap {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.adl-pass-wrap input {
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
||||
.adl-eye-toggle {
|
||||
position: absolute;
|
||||
right: 14px;
|
||||
top: 9px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: 0;
|
||||
background: none;
|
||||
color: rgba(249, 249, 249, .55);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: color .2s ease;
|
||||
}
|
||||
|
||||
.adl-eye-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
.adl-eye-toggle:hover {
|
||||
color: rgba(249, 249, 249, .85);
|
||||
}
|
||||
|
||||
.adl-eye-toggle.is-visible {
|
||||
color: var(--adl-primary);
|
||||
}
|
||||
|
||||
.adl-code-row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.adl-code-row input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.adl-code-row button {
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
height: 50px;
|
||||
padding: 0 18px;
|
||||
}
|
||||
|
||||
.adl-check {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: flex-start;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
color: #fff;
|
||||
margin: 10px 0 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.adl-check input {
|
||||
margin-top: 4px;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.adl-register-error {
|
||||
display: none;
|
||||
background: rgba(255, 92, 92, .12);
|
||||
border: 1px solid rgba(255, 92, 92, .35);
|
||||
border-radius: 10px;
|
||||
padding: 10px 12px;
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
line-height: 20px;
|
||||
margin: 8px 0 12px;
|
||||
}
|
||||
|
||||
.adl-register-error.show {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.adl-submit {
|
||||
width: 300px !important;
|
||||
max-width: 100% !important;
|
||||
height: auto !important;
|
||||
background: var(--adl-primary) !important;
|
||||
color: #fff !important;
|
||||
border: none !important;
|
||||
border-radius: 12px !important;
|
||||
padding: 12px 22px !important;
|
||||
font-size: 16px !important;
|
||||
font-weight: 700 !important;
|
||||
line-height: 24px !important;
|
||||
letter-spacing: 0 !important;
|
||||
margin: 15px auto 0 !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.adl-login-hint {
|
||||
margin: 10px 0 0;
|
||||
text-align: center;
|
||||
font-size: 14px !important;
|
||||
line-height: 22.4px !important;
|
||||
color: rgba(249, 249, 249, .75) !important;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
|
||||
.adl-login-hint a {
|
||||
color: var(--adl-primary);
|
||||
font-size: 14px !important;
|
||||
font-weight: 400 !important;
|
||||
text-decoration: none;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.adl-login-hint a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.adl-register-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.adl-register-actions .adl-btn {
|
||||
width: 300px;
|
||||
max-width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.adl-disclaimer {
|
||||
margin-top: 14px !important;
|
||||
font-size: 12px !important;
|
||||
line-height: 20px !important;
|
||||
opacity: .82;
|
||||
}
|
||||
|
||||
/* Embedded in leading-v2 hero */
|
||||
#leading-v2 .lv2-hero .adl-register-top {
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero .adl-register .container {
|
||||
padding: 0;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.adl-register-box h2 {
|
||||
font-size: 36px;
|
||||
line-height: 44px;
|
||||
}
|
||||
|
||||
.adl-register-box > p {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.adl-form-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.adl-code-row {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.adl-register-top {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.adl-register-top .adl-register-box {
|
||||
padding: 24px 16px;
|
||||
}
|
||||
|
||||
.adl-register-form {
|
||||
padding: 14px 12px;
|
||||
}
|
||||
|
||||
.adl-code-row input {
|
||||
flex: unset;
|
||||
}
|
||||
|
||||
#leading-v2 .lv2-hero .adl-register-top {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,400 @@
|
||||
/**
|
||||
* Home hero carousel — scoped to #section-1.home-hero-carousel
|
||||
* Source: Serena/Figma HeroCarousel.tsx (autoplay 5s, fade, pill dots)
|
||||
*/
|
||||
#homepage #section-1.home-hero-carousel {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background: transparent;
|
||||
--hero-inner-padding-bottom: 40px;
|
||||
}
|
||||
|
||||
/* #homepage .home-hero-carousel__glow {
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: -120px;
|
||||
left: 50%;
|
||||
width: 140%;
|
||||
max-width: 1600px;
|
||||
height: 700px;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 50%;
|
||||
opacity: 0.7;
|
||||
background: radial-gradient(
|
||||
ellipse at center,
|
||||
#f7931e 0%,
|
||||
#88510f 18%,
|
||||
#2b1905 40%,
|
||||
transparent 70%
|
||||
);
|
||||
} */
|
||||
|
||||
#homepage .home-hero-carousel__inner {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 1128px;
|
||||
margin: 0 auto;
|
||||
padding: 48px 20px 56px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#homepage .home-hero-carousel__inner {
|
||||
padding: 76px 32px 64px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__inner {
|
||||
padding: var(--hero-nav-gap) 32px
|
||||
calc(var(--hero-coach-dots-gap) + var(--hero-dots-height) + var(--hero-inner-padding-bottom));
|
||||
min-height: calc(
|
||||
var(--hero-nav-gap) + var(--hero-slide1-viewport-height)
|
||||
+ var(--hero-coach-dots-gap) + var(--hero-dots-height)
|
||||
+ var(--hero-inner-padding-bottom)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__viewport {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 720px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__viewport {
|
||||
height: var(--hero-slide1-viewport-height);
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
#homepage .home-hero-carousel__viewport {
|
||||
touch-action: pan-y;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__slide {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 40px;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
transition: opacity 0.7s ease;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__slide.is-active {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__slide-grid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 40px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__slide {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__slide-grid {
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 48px;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 48px;
|
||||
width: 100%;
|
||||
max-width: 560px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__content {
|
||||
text-align: left;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__copy {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__heading-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__heading-group {
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 8px 14px;
|
||||
border-radius: 20px;
|
||||
background: rgba(249, 135, 21, 0.4);
|
||||
color: #f98715;
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__badge-icon {
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__title {
|
||||
margin: 0;
|
||||
font-size: clamp(36px, 5vw, 54px);
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
font-weight: 800;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__desc {
|
||||
margin: 0;
|
||||
font-size: clamp(18px, 2.2vw, 20px);
|
||||
line-height: 1.4;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__actions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 12px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
#homepage .home-hero-carousel__actions {
|
||||
display: grid;
|
||||
grid-template-columns: auto auto;
|
||||
grid-template-rows: auto auto;
|
||||
column-gap: 12px;
|
||||
row-gap: 14px;
|
||||
justify-content: center;
|
||||
align-items: start;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__actions .home-hero-carousel__btn--primary {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__actions .home-hero-carousel__btn--ghost,
|
||||
#homepage .home-hero-carousel__actions .home-hero-carousel__btn--ai-coach {
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__actions .home-hero-carousel__ai-coach {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
justify-self: center;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__ai-coach {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 4px;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__ai-coach:hover {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__ai-coach img {
|
||||
display: block;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
flex-shrink: 0;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__actions {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__actions .home-hero-carousel__ai-coach {
|
||||
justify-self: start;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
min-height: 56px;
|
||||
padding: 16px 40px;
|
||||
border-radius: 10px;
|
||||
font-size: clamp(18px, 2vw, 20px);
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.01em;
|
||||
line-height: 1;
|
||||
text-decoration: none;
|
||||
transition: opacity 0.2s ease, background 0.2s ease;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn--primary {
|
||||
color: #fff;
|
||||
background: #f98715;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn--primary:hover {
|
||||
opacity: 0.9;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn--ghost {
|
||||
color: #fff;
|
||||
background: rgba(15, 15, 15, 0.5);
|
||||
border: 1px solid #666;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn--ghost:hover {
|
||||
background: rgba(15, 15, 15, 0.8);
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn--ai-coach {
|
||||
gap: 6px;
|
||||
padding: 5px 20px 5px 8px;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__btn--ai-coach img {
|
||||
display: block;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
flex-shrink: 0;
|
||||
object-fit: contain;
|
||||
object-position: left center;
|
||||
margin-right: -6px;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__visual {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
max-width: 520px;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__visual img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 440px;
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__visual img {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__dots {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
left: 20px;
|
||||
right: 20px;
|
||||
bottom: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#homepage .home-hero-carousel__dots {
|
||||
left: 32px;
|
||||
right: 32px;
|
||||
bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#homepage .home-hero-carousel__dots {
|
||||
top: calc(
|
||||
var(--hero-nav-gap) + var(--hero-slide1-content-height) + var(--hero-coach-dots-gap)
|
||||
);
|
||||
bottom: auto;
|
||||
left: 32px;
|
||||
right: 32px;
|
||||
margin-top: 0;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__dot {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: rgba(250, 250, 250, 0.4);
|
||||
cursor: pointer;
|
||||
transition: width 0.3s ease, background 0.3s ease;
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__dot:hover {
|
||||
background: rgba(250, 250, 250, 0.6);
|
||||
}
|
||||
|
||||
#homepage .home-hero-carousel__dot.is-active {
|
||||
width: 40px;
|
||||
background: #f98715;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
#homepage .home-hero-carousel__slide,
|
||||
#homepage .home-hero-carousel__dot {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,175 @@
|
||||
/**
|
||||
* Promo compare table module (copy from promotion-activity.css).
|
||||
* Scope: wrap markup in #promo-compare-module or [data-promo-compare-module].
|
||||
*
|
||||
* Usage:
|
||||
* <link href="../assets/css/modules/promo-compare.css" rel="stylesheet">
|
||||
* <div id="promo-compare-module" class="promo-compare-module" data-promo-compare-module>
|
||||
* <!-- paste section from pages/modules/promo-compare.section.html -->
|
||||
* </div>
|
||||
* Section glow: see docs/aifo-section-glow.md
|
||||
*/
|
||||
@import url("../aifo-section-glow.css");
|
||||
|
||||
#promo-compare-module {
|
||||
--primary: #f98715;
|
||||
--bg-card: #0e0e0e;
|
||||
--border-muted: #989795;
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-compare-module__page {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 1140px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 18px;
|
||||
padding-right: 18px;
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-section {
|
||||
position: relative;
|
||||
padding: 72px 0;
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-section__title {
|
||||
margin: 0 0 48px;
|
||||
font-size: clamp(32px, 4.5vw, 60px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.6px;
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-section__title .text-orange {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-section__title--center {
|
||||
text-align: center;
|
||||
max-width: 700px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-section--compare {
|
||||
padding-top: 48px;
|
||||
padding-bottom: 96px;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 986px;
|
||||
margin: 0 auto;
|
||||
border: 0.5px solid var(--border-muted);
|
||||
border-radius: 15px;
|
||||
background: var(--bg-card);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__header,
|
||||
#promo-compare-module .compare-table__row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
min-height: 64px;
|
||||
padding: 18px 28px;
|
||||
font-size: 18px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell--other {
|
||||
color: var(--text-muted);
|
||||
border-right: 0.5px solid rgba(152, 151, 149, 0.35);
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell--aifo {
|
||||
color: var(--text-main);
|
||||
font-weight: 600;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(249, 135, 21, 0.04) 0%,
|
||||
rgba(249, 135, 21, 0.1) 100%
|
||||
);
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell--head {
|
||||
min-height: 72px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell--head.compare-table__cell--other {
|
||||
color: #b3b3b3;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell--head.compare-table__cell--aifo {
|
||||
color: var(--primary);
|
||||
font-weight: 700;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(249, 135, 21, 0.08) 0%,
|
||||
rgba(249, 135, 21, 0.16) 100%
|
||||
);
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__row:not(:last-child) .compare-table__cell,
|
||||
#promo-compare-module .compare-table__header .compare-table__cell {
|
||||
border-bottom: 0.5px solid rgba(152, 151, 149, 0.28);
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__icon {
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__icon svg {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__icon--no {
|
||||
color: #e74c3c;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__icon--yes {
|
||||
color: #3ecf8e;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#promo-compare-module .promo-section {
|
||||
padding: 48px 0;
|
||||
}
|
||||
|
||||
#promo-compare-module .promo-section__title {
|
||||
font-size: 32px;
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell {
|
||||
padding: 14px 16px;
|
||||
font-size: 14px;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
#promo-compare-module .compare-table__cell--head {
|
||||
font-size: 11px;
|
||||
min-height: 56px;
|
||||
letter-spacing: 0.06em;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,113 @@
|
||||
#page-index {
|
||||
--primary: #f98715;
|
||||
--bg-page: #070400;
|
||||
--bg-card: #0e0e0e;
|
||||
--border-muted: rgba(152, 151, 149, 0.28);
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
background: var(--bg-page);
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
#page-index .page-index-main {
|
||||
margin-top: 5.9375rem;
|
||||
padding: 48px 16px 80px;
|
||||
}
|
||||
|
||||
#page-index .page-index {
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#page-index .page-index__header {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
#page-index .page-index__title {
|
||||
margin: 0 0 12px;
|
||||
font-size: clamp(32px, 4vw, 48px);
|
||||
font-weight: 700;
|
||||
line-height: 1.2;
|
||||
letter-spacing: -0.4px;
|
||||
}
|
||||
|
||||
#page-index .page-index__title .text-orange {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#page-index .page-index__desc {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
color: var(--text-muted);
|
||||
max-width: 640px;
|
||||
}
|
||||
|
||||
#page-index .page-index__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
#page-index .page-index__section {
|
||||
background: var(--bg-card);
|
||||
border: 0.5px solid var(--border-muted);
|
||||
border-radius: 12px;
|
||||
padding: 20px 22px 24px;
|
||||
}
|
||||
|
||||
#page-index .page-index__section-title {
|
||||
margin: 0 0 16px;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#page-index .page-index__list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#page-index .page-index__list li + li {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
#page-index .page-index__link {
|
||||
display: block;
|
||||
padding: 8px 10px;
|
||||
border-radius: 8px;
|
||||
font-size: 15px;
|
||||
line-height: 1.35;
|
||||
color: var(--text-main);
|
||||
text-decoration: none;
|
||||
transition: background-color 0.2s ease, color 0.2s ease;
|
||||
}
|
||||
|
||||
#page-index .page-index__link:hover,
|
||||
#page-index .page-index__link:focus {
|
||||
background: rgba(249, 135, 21, 0.1);
|
||||
color: var(--primary);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#page-index .page-index__link small {
|
||||
display: block;
|
||||
margin-top: 2px;
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#page-index .page-index-main {
|
||||
margin-top: 72px;
|
||||
padding-top: 32px;
|
||||
}
|
||||
|
||||
#page-index .page-index__grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 16px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,544 @@
|
||||
/**
|
||||
* Partnership page — from Figma AIFO V2 (node 11533:26942).
|
||||
*/
|
||||
#partnership-page {
|
||||
--primary: #f98715;
|
||||
--primary-hover: #f9a215;
|
||||
--bg-page: #070400;
|
||||
--bg-card: #0e0e0e;
|
||||
--border-muted: rgba(152, 151, 149, 0.5);
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
--aifo-page-bg-height: 805px;
|
||||
--aifo-page-content-offset: 1.375rem;
|
||||
background: var(--bg-page);
|
||||
color: var(--text-main);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#partnership-page {
|
||||
--aifo-page-bg-height: 445px;
|
||||
--aifo-page-content-offset: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-page {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
padding: 0 18px 80px;
|
||||
}
|
||||
|
||||
#partnership-page .text-orange {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/* ── Hero ── */
|
||||
#partnership-page .partnership-hero {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding: 48px 0 24px;
|
||||
max-width: 760px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#partnership-page .partnership-hero {
|
||||
padding-top: 80px;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-hero__title {
|
||||
margin: 0 0 20px;
|
||||
font-size: clamp(36px, 5vw, 60px);
|
||||
line-height: 1.15;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.6px;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-hero__desc {
|
||||
margin: 0 0 32px;
|
||||
max-width: 620px;
|
||||
font-size: clamp(16px, 2.2vw, 20px);
|
||||
line-height: 1.5;
|
||||
font-weight: 500;
|
||||
color: var(--text-main);
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 220px;
|
||||
padding: 15px 40px;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: var(--text-main);
|
||||
background: var(--primary);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-btn:hover {
|
||||
background: var(--primary-hover);
|
||||
box-shadow: inset 0 5px 10px rgba(249, 135, 21, 0.6), 0 5px 10px rgba(249, 135, 21, 0.6);
|
||||
color: var(--text-main);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* ── Sections ── */
|
||||
#partnership-page .partnership-section {
|
||||
padding: 56px 0;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#partnership-page .partnership-section {
|
||||
padding: 72px 0;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section__title {
|
||||
margin: 0 0 40px;
|
||||
font-size: clamp(32px, 4.5vw, 60px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.6px;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section__title--center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ── Commission tiers ── */
|
||||
#partnership-page .partnership-tiers {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#partnership-page .partnership-tiers {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier {
|
||||
position: relative;
|
||||
min-height: 220px;
|
||||
padding: 32px 24px;
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(14, 14, 14, 0.95) 100%);
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
transition: transform 0.25s ease, box-shadow 0.25s ease;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier:hover {
|
||||
transform: translateY(-4px);
|
||||
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier--featured {
|
||||
border-color: rgba(249, 135, 21, 0.45);
|
||||
background: linear-gradient(160deg, #f98715 0%, #c45f08 55%, #8a3f04 100%);
|
||||
box-shadow: 0 16px 48px rgba(249, 135, 21, 0.28);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier__badge {
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
right: 18px;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier__rate {
|
||||
margin: 0;
|
||||
font-size: clamp(48px, 8vw, 72px);
|
||||
line-height: 1;
|
||||
font-weight: 800;
|
||||
letter-spacing: -0.04em;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier__label {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier__meta {
|
||||
margin: 4px 0 0;
|
||||
font-size: 14px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-tier--featured .partnership-tier__meta {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
/* ── Benefits ── */
|
||||
#partnership-page .partnership-benefits {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
#partnership-page .partnership-benefits {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-benefit {
|
||||
padding: 24px;
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: var(--bg-card);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-benefit__visual {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 120px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-benefit__visual img {
|
||||
display: block;
|
||||
width: auto;
|
||||
height: 96px;
|
||||
max-width: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-benefit__title {
|
||||
margin: 0 0 10px;
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-benefit__desc {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.55;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* ── How it works ── */
|
||||
#partnership-page .partnership-steps {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#partnership-page .partnership-steps {
|
||||
grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
|
||||
align-items: stretch;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-step {
|
||||
padding: 24px 20px;
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: rgba(14, 14, 14, 0.92);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-step__icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 50%;
|
||||
background: rgba(249, 135, 21, 0.15);
|
||||
color: var(--primary);
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-step__glyph {
|
||||
font-size: 24px;
|
||||
font-weight: 800;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-step__title {
|
||||
margin: 0 0 8px;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-step__desc {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-steps__arrow {
|
||||
display: none;
|
||||
align-self: center;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
color: var(--text-main);
|
||||
font-size: 18px;
|
||||
line-height: 28px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#partnership-page .partnership-steps__arrow {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Audience ── */
|
||||
#partnership-page .partnership-audience {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#partnership-page .partnership-audience {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card {
|
||||
padding: 28px 24px;
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: var(--bg-card);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__label {
|
||||
margin: 0 0 20px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card--fit .partnership-audience-card__label {
|
||||
color: #3dd68c;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card--not-fit .partnership-audience-card__label {
|
||||
color: #ff6b4a;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__visual {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
min-height: 88px;
|
||||
margin-bottom: 20px;
|
||||
padding: 16px;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__visual--warn {
|
||||
background: rgba(255, 107, 74, 0.08);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__warn-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 107, 74, 0.18);
|
||||
color: #ff6b4a;
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__list li {
|
||||
position: relative;
|
||||
padding-left: 28px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 16px;
|
||||
line-height: 1.45;
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card__list li:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card--fit .partnership-audience-card__list li::before {
|
||||
content: "✓";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
color: #3dd68c;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-audience-card--not-fit .partnership-audience-card__list li::before {
|
||||
content: "✕";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
color: #ff6b4a;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* ── Payment methods module spacing ── */
|
||||
#partnership-page #payment-methods-container {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
#partnership-page #payment-methods-container .pm2-section {
|
||||
padding-top: 56px;
|
||||
padding-bottom: 56px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#partnership-page #payment-methods-container .pm2-section {
|
||||
padding-top: 72px;
|
||||
padding-bottom: 72px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── FAQ ── */
|
||||
#partnership-page .partnership-section--faq .partnership-faq {
|
||||
max-width: 820px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-item {
|
||||
margin-bottom: 12px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: rgba(14, 14, 14, 0.85);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
padding: 20px 24px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--text-main);
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-question {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-icon-box {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 8px;
|
||||
background: var(--primary);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
transition: transform 0.25s ease;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-icon {
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-item.active .faq-icon-box {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-body {
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
transition: max-height 0.25s ease, opacity 0.25s ease;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-item.active .faq-body {
|
||||
max-height: 320px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-answer {
|
||||
padding: 0 24px 20px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
#partnership-page .partnership-section--faq .faq-answer p {
|
||||
margin: 12px 0 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* ── CTA ── */
|
||||
#partnership-page .partnership-cta {
|
||||
margin-top: 24px;
|
||||
padding: 48px 24px;
|
||||
border-radius: 24px;
|
||||
border: 1px solid rgba(249, 135, 21, 0.25);
|
||||
background: linear-gradient(135deg, rgba(249, 135, 21, 0.12) 0%, rgba(14, 14, 14, 0.95) 100%);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-cta__title {
|
||||
margin: 0 0 12px;
|
||||
font-size: clamp(28px, 4vw, 44px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#partnership-page .partnership-cta__desc {
|
||||
margin: 0 0 28px;
|
||||
font-size: 18px;
|
||||
line-height: 1.5;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
@@ -0,0 +1,80 @@
|
||||
/**
|
||||
* Pricing page — same v2 shell as leading-v2 (header, footer, page bg).
|
||||
*/
|
||||
#pricing-page {
|
||||
--primary: #f98715;
|
||||
--bg-page: #070400;
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
--aifo-page-bg-height: 805px;
|
||||
--aifo-page-content-offset: 1.375rem;
|
||||
--lv2-header-height: 5.75rem;
|
||||
background: var(--bg-page);
|
||||
color: var(--text-main);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#pricing-page {
|
||||
--aifo-page-bg-height: 445px;
|
||||
--aifo-page-content-offset: 1rem;
|
||||
--lv2-header-height: 72px;
|
||||
}
|
||||
}
|
||||
|
||||
#pricing-page {
|
||||
--aifo-nav-height: var(--lv2-header-height);
|
||||
}
|
||||
|
||||
#pricing-page .pricing-page {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
padding: 0 18px 24px;
|
||||
}
|
||||
|
||||
#pricing-page #challenge-floor-module {
|
||||
width: 100%;
|
||||
padding-top: 48px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#pricing-page #challenge-floor-module {
|
||||
padding-top: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
#pricing-page #challenge-floor-module .challenge-floor {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
#pricing-page #promo-compare-module {
|
||||
width: 100%;
|
||||
margin-top: 64px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#pricing-page #promo-compare-module {
|
||||
margin-top: 112px;
|
||||
}
|
||||
}
|
||||
|
||||
#pricing-page #promo-compare-module .promo-section {
|
||||
padding: 48px 0 24px;
|
||||
}
|
||||
|
||||
#pricing-page #promo-compare-module .promo-section--compare {
|
||||
padding-top: 32px;
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#pricing-page #promo-compare-module .promo-section {
|
||||
padding: 32px 0 16px;
|
||||
}
|
||||
|
||||
#pricing-page #promo-compare-module .promo-section__title {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 182 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 753 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
@@ -0,0 +1,3 @@
|
||||
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M9.11519 17.215L10.0859 20.1671L11.4884 16.2979C11.709 15.6897 12.0559 15.1352 12.5061 14.6707C12.9564 14.2062 13.4999 13.8422 14.1009 13.6029L18.3359 11.9171L14.4681 10.5325C13.8963 10.3324 13.3736 10.0132 12.9343 9.59601C12.4951 9.17884 12.1495 8.6732 11.9202 8.1125L10.0859 3.66713L8.84844 6.875C8.45104 7.91017 7.82125 8.84027 7.00761 9.59359C6.19397 10.3469 5.21822 10.9033 4.15556 11.22L1.83594 11.9171L5.04519 13.0529C5.99804 13.3868 6.861 13.9361 7.56691 14.658C8.27283 15.3799 8.80266 16.2549 9.11519 17.215ZM16.6584 6.41712L16.9252 7.22288L17.3006 6.16963C17.3614 6.00383 17.4565 5.85274 17.5797 5.72621C17.7029 5.59969 17.8514 5.50059 18.0156 5.43538L19.1706 4.9775L18.1159 4.60213C17.963 4.54687 17.8227 4.4616 17.7032 4.35133C17.5837 4.24106 17.4875 4.108 17.4202 3.96L16.9252 2.75L16.5856 3.66713C16.4756 3.94874 16.3029 4.2016 16.0807 4.40649C15.8584 4.61139 15.5923 4.76294 15.3027 4.84963L14.6702 5.005L15.5859 5.3075C15.8346 5.40335 16.0594 5.55229 16.2447 5.74394C16.4299 5.93558 16.5711 6.16531 16.6584 6.41712Z" fill="#F98715"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M17.1009 1.33925C17.0758 1.232 17.0213 1.13389 16.9434 1.05601C16.8655 0.978133 16.7674 0.923589 16.6602 0.898546C13.4373 0.158155 9.92157 1.03924 7.41657 3.54423C7.06356 3.89771 6.73792 4.27751 6.44248 4.68034C6.35877 4.79433 6.23908 4.87324 6.10199 4.90715C4.79337 5.23115 3.53277 5.91483 2.48608 6.96154C2.0177 7.42914 1.60981 7.95363 1.27196 8.52274C0.985787 9.00603 1.47627 9.57604 2.00307 9.38134C2.83437 9.07415 3.73258 8.92324 4.65837 8.92264C4.64546 9.00153 4.62687 9.07955 4.61578 9.15844C5.26545 9.91465 5.94322 10.6463 6.64767 11.3517C7.35307 12.0563 8.08469 12.734 8.84098 13.3836C8.91987 13.3725 8.99788 13.3539 9.07647 13.341C9.07587 14.2668 8.92496 15.165 8.61777 15.9963C8.42307 16.5231 8.99306 17.0136 9.47637 16.7274C10.0456 16.3896 10.5702 15.9817 11.0379 15.5133C12.0843 14.4669 12.768 13.206 13.092 11.8977C13.1259 11.7606 13.2051 11.6409 13.3188 11.5573C13.7216 11.2618 14.1014 10.9362 14.4549 10.5831C16.9602 8.07756 17.8413 4.56214 17.1009 1.33925ZM13.0635 7.77003C12.6876 8.14589 12.1778 8.35705 11.6463 8.35705C11.1147 8.35705 10.605 8.1459 10.2291 7.77004C9.85323 7.39418 9.64207 6.8844 9.64207 6.35285C9.64207 5.8213 9.85323 5.31152 10.2291 4.93566C10.605 4.5598 11.1147 4.34864 11.6463 4.34864C12.1778 4.34864 12.6876 4.5598 13.0635 4.93566C13.4394 5.31153 13.6505 5.82131 13.6505 6.35286C13.6505 6.88442 13.4394 7.3942 13.0635 7.77006L13.0635 7.77003Z" fill="#F98715"/>
|
||||
<path d="M3.22063 12.1201C2.61313 12.7276 0.037622 16.4917 0.770823 17.2249C1.50402 17.9581 5.26813 15.3823 5.87563 14.7751C6.48313 14.1676 6.38113 13.081 5.64793 12.3481C4.91474 11.6146 3.82783 11.5126 3.22063 12.1201V12.1201Z" fill="#F98715"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@@ -0,0 +1,3 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.2906 1.96729H13.3373C12.8294 1.96729 12.3644 2.25208 12.1336 2.70461L5.63955 15.44C5.61148 15.4955 5.55459 15.5301 5.4926 15.5301H1.99123L6.08443 7.51362H9.67478L7.99192 4.98696H4.54451C4.17548 4.98696 3.83745 5.19371 3.66935 5.52226L0.71349 11.3042V18.028L0.710938 18.0331H6.66933C7.17729 18.0331 7.64222 17.7483 7.87304 17.2961L14.3707 4.56177C14.3988 4.50671 14.4557 4.47171 14.5177 4.47171H18.0118L13.9197 12.4867H10.3293L12.0122 15.0134H15.4596C15.8286 15.0134 16.1667 14.8066 16.3348 14.4781L19.2906 8.69618V1.96729Z" fill="#F98715"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 657 B |
Binary file not shown.
|
After Width: | Height: | Size: 4.0 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 829 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 77 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 184 KiB |
@@ -49,7 +49,7 @@
|
||||
<li><a href="/pages/academy.html">Academy</a></li>
|
||||
<li><a href="/pages/funding_program.html">Funding Programs</a></li>
|
||||
<li><a href="/pages/payout.html">Payout</a></li>
|
||||
<li><a href="/pages/affiliate.html">Partnership</a></li>
|
||||
<li><a href="/pages/partnership.html">Partnership</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="aifo-foot__nav-col">
|
||||
|
||||
@@ -0,0 +1,57 @@
|
||||
<footer class="lv2-footer" data-lv2-footer>
|
||||
<div class="lv2-footer__glow" aria-hidden="true"></div>
|
||||
|
||||
<div class="lv2-footer__inner">
|
||||
<div class="lv2-footer__logo-row">
|
||||
<a class="lv2-footer__logo" href="/" aria-label="AIFO Home">
|
||||
<img src="/assets/images/brand/logo.png" alt="AIFO" width="127" height="32">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<p class="lv2-footer__text">
|
||||
Disclaimer: AIFO provides educational services, simulated trading evaluations, and proprietary
|
||||
trading assessment programs only. AIFO does not provide investment advice, brokerage services,
|
||||
portfolio management, or financial intermediary services. All trading activities conducted through
|
||||
the platform are performed in a simulated environment unless otherwise expressly stated. Trading in
|
||||
financial markets involves substantial risk and may not be suitable for all individuals. Past
|
||||
performance does not guarantee future results. Any information provided on this website is for
|
||||
educational and evaluation purposes only and should not be considered financial advice. Our services
|
||||
are not offered to residents or persons located in jurisdictions where such services would be contrary
|
||||
to local laws or regulations, including but not limited to the United States, Iran, North Korea, Syria,
|
||||
Cuba, Russia, and any jurisdictions subject to applicable sanctions or regulatory restrictions. Users
|
||||
are solely responsible for ensuring that their use of the services complies with applicable local laws
|
||||
and regulations. AIFO makes no guarantees regarding profitability, trading performance, or future
|
||||
outcomes. Services are provided on an "as is" and "as available" basis. To the maximum extent
|
||||
permitted by applicable law, AIFO disclaims all liability for any direct or indirect loss arising from
|
||||
the use of the platform, services, or related content. By using this website, you acknowledge and agree
|
||||
to our Terms & Conditions, Risk Disclosure, and Privacy Policy.
|
||||
</p>
|
||||
|
||||
<p class="lv2-footer__text">
|
||||
Risk Warning: All information provided on this website is intended solely for educational purposes
|
||||
related to trading in financial markets. It does not constitute a specific investment recommendation,
|
||||
business advice, investment opportunity analysis, or any form of general recommendation regarding the
|
||||
trading of investment instruments. AIFO offers services related to simulated trading and educational
|
||||
tools for traders. We do not act as a broker nor accept any deposits. Before purchasing a subscription,
|
||||
you should carefully assess your trading objectives, experience level, and risk appetite. We strongly
|
||||
advise against investing more than you can afford to lose. We encourage you to fully understand the
|
||||
risks involved and to take necessary precautions to manage them.
|
||||
</p>
|
||||
|
||||
<div class="lv2-footer__company">
|
||||
<p>AIFO Global Ltd</p>
|
||||
<p>License No. L16175/AG</p>
|
||||
<p>Boulevard de Coalancanthe, Mutsamudu, Anjouan, Union of Comoros</p>
|
||||
</div>
|
||||
|
||||
<div class="lv2-footer__bottom">
|
||||
<p>©<span data-lv2-year></span> AIFO Co. Ltd. All Rights Reserved.</p>
|
||||
<div class="lv2-footer__bottom-links">
|
||||
<a href="#">Cookie Policy</a>
|
||||
<a href="#">Privacy Policy</a>
|
||||
<a href="#">Terms & Conditions</a>
|
||||
<a href="#">Risk Disclosure</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -0,0 +1,7 @@
|
||||
<header class="lv2-header glass-panel fixed-header" id="lv2-header" data-lv2-header>
|
||||
<div class="lv2-header__inner">
|
||||
<a class="lv2-header__logo" href="/" aria-label="AIFO Home">
|
||||
<img src="/assets/images/brand/logo.png" alt="AIFO" width="127" height="32">
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
@@ -17,6 +17,11 @@
|
||||
<span class="icon iconfont icon-nav-academy text-orange mr-6"></span> Academy
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/pages/page-index.html">
|
||||
<div class="dropdown-rounded-item">
|
||||
<span class="icon iconfont icon-nav-academy text-orange mr-6"></span> Page Directory
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/pages/mind_growth.html">
|
||||
<div class="dropdown-rounded-item">
|
||||
<span class="icon iconfont icon-nav-mind-growth text-orange mr-6"></span>Mind & Growth
|
||||
|
||||
@@ -0,0 +1,113 @@
|
||||
# AIFO 区块光影（Section Glow）
|
||||
|
||||
从 `special-offer-50` **复制**出的公共左右光晕模块，供新页面/区块复用。
|
||||
|
||||
> **注意**：`special-offer-50.html` / `special-offer-50.css` **保持原样**，仍使用页面内自带的 `.so-welcome__glow` 与 `#special-offer-50::before`，无需改原页。
|
||||
|
||||
## 文件
|
||||
|
||||
| 文件 | 说明 |
|
||||
|------|------|
|
||||
| `assets/css/aifo-section-glow.css` | 光影样式（新页面必引） |
|
||||
| `pages/modules/aifo-section-glow.fragment.html` | HTML 片段参考 |
|
||||
|
||||
## 图片资源
|
||||
|
||||
| 变量 | 默认图片 | 用途 |
|
||||
|------|----------|------|
|
||||
| `--aifo-glow-right-image` | `assets/images/backgrounds/new-user-promo-welcome-side-glow.png` | 右侧竖条光晕（同 `.so-welcome__glow`） |
|
||||
| `--aifo-glow-left-image` | `assets/images/backgrounds/new-user-promo-corner-glow.png` | 左上角光晕（同 `#special-offer-50::before`） |
|
||||
|
||||
## 快速使用
|
||||
|
||||
### 1. 引入 CSS
|
||||
|
||||
```html
|
||||
<link type="text/css" href="../assets/css/aifo-section-glow.css" rel="stylesheet">
|
||||
```
|
||||
|
||||
或在模块 CSS 中：
|
||||
|
||||
```css
|
||||
@import url("../aifo-section-glow.css");
|
||||
```
|
||||
|
||||
### 2. 区块级 — 光晕只在某个 section 内
|
||||
|
||||
父级加 `aifo-section-glow-host`，内部放光影 div，正文会自动叠在光晕之上。
|
||||
|
||||
```html
|
||||
<section class="my-section aifo-section-glow-host">
|
||||
<!-- 右侧（可选） -->
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
|
||||
<!-- 左侧（可选） -->
|
||||
<div class="left_bg_light" aria-hidden="true"></div>
|
||||
|
||||
<h2>标题</h2>
|
||||
<p>正文...</p>
|
||||
</section>
|
||||
```
|
||||
|
||||
### 3. 页面级 — 左侧光晕贴整页左上角
|
||||
|
||||
```html
|
||||
<main class="aifo-page-glow-host">
|
||||
<div class="left_bg_light" aria-hidden="true"></div>
|
||||
<section>...</section>
|
||||
</main>
|
||||
```
|
||||
|
||||
## 类名对照（与 special-offer-50 原实现）
|
||||
|
||||
| 公共类名 | 原 special-offer-50 | 说明 |
|
||||
|----------|---------------------|------|
|
||||
| `.aifo-glow-right` | `.so-welcome__glow` | 右侧全高竖条光，`mix-blend-mode: screen` |
|
||||
| `.left_bg_light` | `#special-offer-50::before` | 左上角光晕 |
|
||||
| `.aifo-section-glow-host` | `.so-welcome` 等相对定位容器 | 区块宿主 |
|
||||
| `.aifo-page-glow-host` | 页面根 `main` | 整页宿主 |
|
||||
|
||||
## 自定义（CSS 变量）
|
||||
|
||||
```css
|
||||
#my-page .my-section {
|
||||
--aifo-glow-right-width: 640px;
|
||||
--aifo-glow-left-top: 80px;
|
||||
--aifo-glow-left-offset: -1vw;
|
||||
--aifo-glow-right-image: url("../images/custom/right-glow.png");
|
||||
--aifo-glow-left-image: url("../images/custom/left-glow.png");
|
||||
}
|
||||
```
|
||||
|
||||
## 已接入示例
|
||||
|
||||
### `promo-compare.section.html`
|
||||
|
||||
对比表区块使用右侧光晕（原 `special-offer-50` 未改动）：
|
||||
|
||||
```html
|
||||
<section class="promo-section promo-section--compare aifo-section-glow-host">
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
...
|
||||
</section>
|
||||
```
|
||||
|
||||
引入 `promo-compare.css` 时会自动 `@import` `aifo-section-glow.css`。
|
||||
|
||||
## 注意事项
|
||||
|
||||
1. 宿主需 `position: relative`（`.aifo-section-glow-host` 已包含）。
|
||||
2. 光晕超出容器时，宿主设 `overflow: visible`（默认已是）。
|
||||
3. 右侧光晕 `right: calc((100% - 100vw) / 2)` 可在居中 `max-width` 布局下贴齐视口右缘。
|
||||
4. 装饰元素务必加 `aria-hidden="true"`。
|
||||
|
||||
## 最小示例
|
||||
|
||||
```html
|
||||
<link href="../assets/css/aifo-section-glow.css" rel="stylesheet">
|
||||
|
||||
<section class="aifo-section-glow-host" style="min-height:60vh;background:#080808;color:#fff;padding:80px 24px;">
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
<h2 style="text-align:center;">Demo</h2>
|
||||
</section>
|
||||
```
|
||||
+127
-43
@@ -10,6 +10,7 @@
|
||||
<link href="./assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="./assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="./assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="./assets/css/modules/home-hero-carousel.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/lipis/flag-icons@7.3.2/css/flag-icons.min.css"
|
||||
onerror="this.onerror=null;this.href='/assets/flag-icons.min.css';">
|
||||
</head>
|
||||
@@ -58,62 +59,144 @@
|
||||
|
||||
|
||||
<main class="main" id="homepage">
|
||||
<!-- banner start -->
|
||||
|
||||
<!-- <img
|
||||
src="./assets/images/backgrounds/20251203-153844.webp"
|
||||
class="hero-bg"
|
||||
alt=""
|
||||
fetchpriority="high"
|
||||
loading="eager"
|
||||
decoding="async"
|
||||
> -->
|
||||
|
||||
<img
|
||||
src="./assets/images/banner/20260702-151441.png"
|
||||
class="hero-bg"
|
||||
alt=""
|
||||
fetchpriority="high"
|
||||
loading="eager"
|
||||
decoding="async"
|
||||
>
|
||||
<!-- \assets\images\banner -->
|
||||
<!-- banner start (Figma hero carousel) -->
|
||||
<div class="block-1" id="block-1">
|
||||
<!-- Home hero carousel — from Serena/Figma HeroCarousel (3 slides, autoplay + dots) -->
|
||||
<section
|
||||
id="section-1"
|
||||
class="home-hero-carousel"
|
||||
data-home-hero-carousel
|
||||
aria-roledescription="carousel"
|
||||
aria-label="Homepage hero"
|
||||
>
|
||||
<div class="home-hero-carousel__glow" aria-hidden="true"></div>
|
||||
|
||||
<section id="section-1" class="funded-trading-hero spotlight parallax bg-cover bg-size--cover" >
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<!-- Icons -->
|
||||
|
||||
<h1 class="hero-title fade-in">
|
||||
<span class="line1 fade-in"><img src="./assets/images/backgrounds/img-02.png" alt="Funded Trading" class="hero-img floating-img"> Your First Step</span>
|
||||
<span class="line2 fade-in">Toward <span class="text-primary-orange">Funded Trading</span></span>
|
||||
<div class="home-hero-carousel__inner">
|
||||
<div class="home-hero-carousel__viewport">
|
||||
<article class="home-hero-carousel__slide is-active" data-home-hero-slide aria-hidden="false">
|
||||
<div class="home-hero-carousel__slide-grid">
|
||||
<div class="home-hero-carousel__content">
|
||||
<div class="home-hero-carousel__copy">
|
||||
<div class="home-hero-carousel__heading-group">
|
||||
<span class="home-hero-carousel__badge">
|
||||
<img src="./assets/images/banner/logo-1-icon.svg" alt="" class="home-hero-carousel__badge-icon" width="20" height="20" decoding="async" aria-hidden="true">
|
||||
Forex . Gold . Crypto
|
||||
</span>
|
||||
<h1 class="home-hero-carousel__title">
|
||||
Your Trading Journey <span class="text-primary-orange">Starts With AIFO</span>
|
||||
</h1>
|
||||
|
||||
<div class="banner-contain d-flex align-items-center justify-content-center flex-wrap mt-6">
|
||||
<img src="./assets/images/backgrounds/img-03.png" alt="" class="img-fluid img-fluid-l me-5 floating-img fade-in" >
|
||||
|
||||
<div class="text-center mx-4 fade-in">
|
||||
<div class="mb-3">
|
||||
<div class="banner-desc fade-in">
|
||||
Join thousands of traders who started with AIFO and discover the
|
||||
<span class="text-primary-orange">capital</span>,
|
||||
<span class="text-primary-orange">tools</span>, and
|
||||
<span class="text-primary-orange">expert </span><br><span class="text-primary-orange">guidance</span> you need to grow and thrive.
|
||||
</div>
|
||||
|
||||
<p class="home-hero-carousel__desc">Join thousands of traders who started with AIFO and discover the capital, tools, and expert guidance you need to grow and thrive.</p>
|
||||
</div>
|
||||
|
||||
<div class="trustpilot text-primary d-flex align-items-center justify-content-center gap-2 flex-wrap fade-in">
|
||||
<span>Rated Excellent </span>
|
||||
<span class="pd-lr-1"><img src="./assets/images/backgrounds/img-05.png" alt="Star" class="star-icon"></span>
|
||||
<span class="pd-lr-1 underline-text"> 43,636 reviews on</span>
|
||||
<span><a href="https://www.trustpilot.com/" target="_blank"><img src="./assets/images/backgrounds/Frame 427320868.svg" alt="Star" class="star-icon" ></a></span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="./assets/images/backgrounds/img-h-04.png" alt="" class="img-fluid img-fluid-r ms-5 floating-img fade-in">
|
||||
</div>
|
||||
|
||||
<!-- Buttons -->
|
||||
<div class="hero-buttons center-buttons fade-in">
|
||||
<a href="#" class="btn btn-start-challenge">Start Challenge</a>
|
||||
<a href="#" class="btn btn-free-trial">
|
||||
Free Trial
|
||||
<span class="btn-arrow">›</span>
|
||||
<div class="home-hero-carousel__actions">
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--primary">Start Challenge</a>
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--ghost">
|
||||
Learn To Trade
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
<a href="#" class="home-hero-carousel__ai-coach">
|
||||
<img src="./assets/images/banner/ChatGPT Image Jul 1, 2026, 01_34_31 PM.png" alt="" width="48" height="48" decoding="async">AI Coach
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="home-hero-carousel__visual">
|
||||
<img src="./assets/images/home-hero-carousel/slide-1.png" alt="AIFO trading globe" width="520" height="477" decoding="async">
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="home-hero-carousel__slide" data-home-hero-slide aria-hidden="true">
|
||||
<div class="home-hero-carousel__slide-grid">
|
||||
<div class="home-hero-carousel__content">
|
||||
<div class="home-hero-carousel__copy">
|
||||
<div class="home-hero-carousel__heading-group">
|
||||
<span class="home-hero-carousel__badge">
|
||||
<img src="./assets/images/banner/login-2-icon.svg" alt="" class="home-hero-carousel__badge-icon" width="20" height="20" decoding="async" aria-hidden="true">
|
||||
Real-time Market Analysis
|
||||
</span>
|
||||
<h2 class="home-hero-carousel__title">
|
||||
Meet <span class="text-primary-orange">AIFO Intelligence</span>
|
||||
</h2>
|
||||
</div>
|
||||
<p class="home-hero-carousel__desc">Begin using Prop Trading's very first AI Coach, designed to help you conduct complex market analysis and guide you toward becoming a funded trader.</p>
|
||||
</div>
|
||||
<div class="home-hero-carousel__actions">
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--primary">Try For Free</a>
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--ghost home-hero-carousel__btn--ai-coach">
|
||||
<img src="./assets/images/banner/ChatGPT Image Jul 1, 2026, 01_34_31 PM.png" alt="" width="45" height="45" decoding="async" aria-hidden="true">
|
||||
AI Coach
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="home-hero-carousel__visual">
|
||||
<img src="./assets/images/home-hero-carousel/slide-2.png" alt="AIFO AI Coach" width="520" height="477" decoding="async">
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="home-hero-carousel__slide" data-home-hero-slide aria-hidden="true">
|
||||
<div class="home-hero-carousel__slide-grid">
|
||||
<div class="home-hero-carousel__content">
|
||||
<div class="home-hero-carousel__copy">
|
||||
<div class="home-hero-carousel__heading-group">
|
||||
<span class="home-hero-carousel__badge">
|
||||
<img src="./assets/images/banner/login-3-icon.svg" alt="" class="home-hero-carousel__badge-icon" width="20" height="20" decoding="async" aria-hidden="true">
|
||||
Become a Funded Trader
|
||||
</span>
|
||||
<h2 class="home-hero-carousel__title">
|
||||
<span class="text-primary-orange">Flexible Challenges</span> Made For You
|
||||
</h2>
|
||||
</div>
|
||||
<p class="home-hero-carousel__desc">We offer a wide variety of different challenge types, from the traditional 1-step, 2-step, and 3-step challenges to our instant-access and Lite challenges, designed to suit your experience and goals.</p>
|
||||
</div>
|
||||
<div class="home-hero-carousel__actions">
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--primary">
|
||||
Choose Your Challenge
|
||||
</a>
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--ghost home-hero-carousel__btn--ai-coach">
|
||||
<img src="./assets/images/banner/ChatGPT Image Jul 1, 2026, 01_34_31 PM.png" alt="" width="45" height="45" decoding="async" aria-hidden="true">
|
||||
AI Coach
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="home-hero-carousel__visual">
|
||||
<img src="./assets/images/home-hero-carousel/slide-3.png" alt="AIFO flexible challenges dashboard" width="520" height="477" decoding="async">
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="home-hero-carousel__dots" role="tablist" aria-label="Choose slide">
|
||||
<button type="button" class="home-hero-carousel__dot is-active" role="tab" aria-selected="true" aria-label="Go to slide 1" data-home-hero-dot="0"></button>
|
||||
<button type="button" class="home-hero-carousel__dot" role="tab" aria-selected="false" aria-label="Go to slide 2" data-home-hero-dot="1"></button>
|
||||
<button type="button" class="home-hero-carousel__dot" role="tab" aria-selected="false" aria-label="Go to slide 3" data-home-hero-dot="2"></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Number Statistics Section -->
|
||||
<section id="section-2" class="fade-in">
|
||||
<section id="section-2" class="fade-in" style="display: none;">
|
||||
<div class="container">
|
||||
|
||||
<div class="row justify-content-center text-center">
|
||||
@@ -1192,6 +1275,7 @@
|
||||
<script src="./assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
||||
<script src="./assets/vendor/popper/popper.min.js"></script>
|
||||
<script src="./assets/js/bootstrap/bootstrap.min.js"></script>
|
||||
<script src="/js/home-hero-carousel.js"></script>
|
||||
<!-- FontAwesome 5 -->
|
||||
<script src="./assets/vendor/fontawesome/js/fontawesome-all.min.js" defer></script>
|
||||
<!-- Page plugins -->
|
||||
|
||||
@@ -0,0 +1,30 @@
|
||||
/**
|
||||
* Loads adl-register.section.html into a container.
|
||||
*/
|
||||
(function () {
|
||||
var MODULE_URL = '/pages/modules/adl-register.section.html';
|
||||
|
||||
function loadAdlRegisterModule() {
|
||||
var container = document.getElementById('adl-register-container');
|
||||
if (!container) return;
|
||||
|
||||
fetch(MODULE_URL, { credentials: 'same-origin' })
|
||||
.then(function (res) {
|
||||
if (!res.ok) throw new Error('Failed to load ' + MODULE_URL);
|
||||
return res.text();
|
||||
})
|
||||
.then(function (html) {
|
||||
container.innerHTML = html;
|
||||
document.dispatchEvent(new CustomEvent('aifo:adl-register-ready'));
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[adl-register-module.js]', err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', loadAdlRegisterModule);
|
||||
} else {
|
||||
loadAdlRegisterModule();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,238 @@
|
||||
/**
|
||||
* ADL register form interactions (static port of aifo theme adl-register.js).
|
||||
*
|
||||
* Configure API endpoints before load:
|
||||
* window.ADL_REGISTER = { ajaxUrl: '...', successUrl: '/pages/user_signup_success.html' };
|
||||
*/
|
||||
(function () {
|
||||
var countries = [
|
||||
{ name: 'Australia', flag: '🇦🇺', dial: '+61' },
|
||||
{ name: 'China', flag: '🇨🇳', dial: '+86' },
|
||||
{ name: 'United States', flag: '🇺🇸', dial: '+1' },
|
||||
{ name: 'United Kingdom', flag: '🇬🇧', dial: '+44' },
|
||||
{ name: 'Singapore', flag: '🇸🇬', dial: '+65' },
|
||||
{ name: 'Malaysia', flag: '🇲🇾', dial: '+60' },
|
||||
{ name: 'New Zealand', flag: '🇳🇿', dial: '+64' },
|
||||
{ name: 'Japan', flag: '🇯🇵', dial: '+81' },
|
||||
{ name: 'Korea', flag: '🇰🇷', dial: '+82' },
|
||||
{ name: 'Hong Kong', flag: '🇭🇰', dial: '+852' },
|
||||
{ name: 'Taiwan', flag: '🇹🇼', dial: '+886' },
|
||||
{ name: 'Thailand', flag: '🇹🇭', dial: '+66' },
|
||||
{ name: 'Vietnam', flag: '🇻🇳', dial: '+84' },
|
||||
{ name: 'Philippines', flag: '🇵🇭', dial: '+63' },
|
||||
{ name: 'India', flag: '🇮🇳', dial: '+91' },
|
||||
{ name: 'Germany', flag: '🇩🇪', dial: '+49' }
|
||||
];
|
||||
|
||||
function initAdlRegister() {
|
||||
var form = document.getElementById('adl-register-form');
|
||||
if (!form || form.dataset.adlInit === '1') return;
|
||||
form.dataset.adlInit = '1';
|
||||
|
||||
var cfg = window.ADL_REGISTER || {};
|
||||
var ajaxUrl = cfg.ajaxUrl || '';
|
||||
var successUrl = cfg.successUrl || '/pages/user_signup_success.html';
|
||||
var errEl = document.getElementById('adl-register-error');
|
||||
|
||||
function showErr(msg) {
|
||||
if (!errEl) return;
|
||||
errEl.textContent = msg || 'Something went wrong.';
|
||||
errEl.classList.add('show');
|
||||
}
|
||||
|
||||
function clearErr() {
|
||||
if (!errEl) return;
|
||||
errEl.textContent = '';
|
||||
errEl.classList.remove('show');
|
||||
}
|
||||
|
||||
form.querySelectorAll('.adl-eye-toggle').forEach(function (btn) {
|
||||
btn.addEventListener('click', function () {
|
||||
var target = form.querySelector(btn.getAttribute('data-target'));
|
||||
if (!target) return;
|
||||
var isPwd = target.type === 'password';
|
||||
target.type = isPwd ? 'text' : 'password';
|
||||
btn.setAttribute('aria-label', isPwd ? 'Hide password' : 'Show password');
|
||||
btn.classList.toggle('is-visible', isPwd);
|
||||
});
|
||||
});
|
||||
|
||||
var menu = document.getElementById('adl-country-menu');
|
||||
var list = document.getElementById('adl-country-list');
|
||||
var countrySelect = document.getElementById('adl-country-select');
|
||||
var countrySearch = document.getElementById('adl-country-search');
|
||||
|
||||
function renderCountries(items) {
|
||||
if (!list) return;
|
||||
list.innerHTML = '';
|
||||
items.forEach(function (c) {
|
||||
var item = document.createElement('div');
|
||||
item.className = 'adl-country-item';
|
||||
item.setAttribute('data-dial', c.dial);
|
||||
item.setAttribute('data-flag', c.flag);
|
||||
item.innerHTML = '<span>' + c.flag + '</span><span>' + c.name + ' (' + c.dial + ')</span>';
|
||||
list.appendChild(item);
|
||||
});
|
||||
}
|
||||
|
||||
renderCountries(countries);
|
||||
|
||||
if (countrySelect && menu) {
|
||||
countrySelect.addEventListener('click', function () {
|
||||
var open = menu.classList.toggle('open');
|
||||
countrySelect.setAttribute('aria-expanded', open ? 'true' : 'false');
|
||||
});
|
||||
}
|
||||
|
||||
if (countrySearch) {
|
||||
countrySearch.addEventListener('input', function () {
|
||||
var q = countrySearch.value.toLowerCase();
|
||||
renderCountries(
|
||||
countries.filter(function (c) {
|
||||
return c.name.toLowerCase().indexOf(q) !== -1 || c.dial.indexOf(q) !== -1;
|
||||
})
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
if (list) {
|
||||
list.addEventListener('click', function (e) {
|
||||
var item = e.target.closest('.adl-country-item');
|
||||
if (!item) return;
|
||||
var flagEl = document.getElementById('adl-country-flag');
|
||||
var codeEl = document.getElementById('adl-country-code');
|
||||
var inputEl = document.getElementById('adl-country-code-input');
|
||||
if (flagEl) flagEl.textContent = item.getAttribute('data-flag');
|
||||
if (codeEl) codeEl.textContent = item.getAttribute('data-dial');
|
||||
if (inputEl) inputEl.value = item.getAttribute('data-dial');
|
||||
if (menu) menu.classList.remove('open');
|
||||
if (countrySelect) countrySelect.setAttribute('aria-expanded', 'false');
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('click', function (e) {
|
||||
if (!e.target.closest('.adl-phone-wrapper') && menu) {
|
||||
menu.classList.remove('open');
|
||||
if (countrySelect) countrySelect.setAttribute('aria-expanded', 'false');
|
||||
}
|
||||
});
|
||||
|
||||
var sendCodeBtn = document.getElementById('adl-send-code');
|
||||
if (sendCodeBtn) {
|
||||
sendCodeBtn.addEventListener('click', function () {
|
||||
clearErr();
|
||||
var email = document.getElementById('adl-email');
|
||||
var username = document.getElementById('adl-username');
|
||||
if (!email || !username || !email.value.trim() || !username.value.trim()) {
|
||||
showErr('Please enter username and email first.');
|
||||
return;
|
||||
}
|
||||
if (!ajaxUrl) {
|
||||
showErr('Email code API is not configured for this static preview.');
|
||||
return;
|
||||
}
|
||||
|
||||
sendCodeBtn.disabled = true;
|
||||
sendCodeBtn.textContent = 'Sending...';
|
||||
|
||||
var body = new URLSearchParams();
|
||||
body.set('action', 'send_email_code');
|
||||
body.set('email', email.value.trim());
|
||||
body.set('username', username.value.trim());
|
||||
|
||||
fetch(ajaxUrl, { method: 'POST', body: body, credentials: 'same-origin' })
|
||||
.then(function (res) { return res.json(); })
|
||||
.then(function () {
|
||||
var sec = 60;
|
||||
sendCodeBtn.textContent = 'Resend (' + sec + 's)';
|
||||
var timer = setInterval(function () {
|
||||
sec -= 1;
|
||||
sendCodeBtn.textContent = 'Resend (' + sec + 's)';
|
||||
if (sec <= 0) {
|
||||
clearInterval(timer);
|
||||
sendCodeBtn.disabled = false;
|
||||
sendCodeBtn.textContent = 'Get Code';
|
||||
}
|
||||
}, 1000);
|
||||
})
|
||||
.catch(function () {
|
||||
showErr('Failed to send code. Please try again.');
|
||||
sendCodeBtn.disabled = false;
|
||||
sendCodeBtn.textContent = 'Get Code';
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
form.addEventListener('submit', function (e) {
|
||||
e.preventDefault();
|
||||
clearErr();
|
||||
|
||||
var agree = document.getElementById('adl-agree-privacy');
|
||||
if (!agree || !agree.checked) {
|
||||
showErr('Please agree to the terms to continue.');
|
||||
return;
|
||||
}
|
||||
|
||||
var submitBtn = document.getElementById('adl-register-submit');
|
||||
if (!submitBtn || submitBtn.disabled) return;
|
||||
|
||||
var password = document.getElementById('adl-password');
|
||||
var passRe = /^(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*(),.?":{}|<>]).{12,}$/;
|
||||
if (!password || !passRe.test(password.value)) {
|
||||
showErr('Password must be at least 12 characters long and include at least one uppercase letter, one number, and one special character.');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!ajaxUrl) {
|
||||
showErr('Registration API is not configured for this static preview.');
|
||||
return;
|
||||
}
|
||||
|
||||
submitBtn.disabled = true;
|
||||
submitBtn.textContent = 'Submitting...';
|
||||
|
||||
var countryCode = document.getElementById('adl-country-code-input');
|
||||
var phone = document.getElementById('adl-phone');
|
||||
var phoneFull = ((countryCode && countryCode.value) || '') + ' ' + ((phone && phone.value.trim()) || '');
|
||||
var body = new URLSearchParams();
|
||||
body.set('action', 'aifo_register');
|
||||
body.set('username', document.getElementById('adl-username').value.trim());
|
||||
body.set('email', document.getElementById('adl-email').value.trim());
|
||||
body.set('password', password.value);
|
||||
body.set('confirm', document.getElementById('adl-confirm-password').value);
|
||||
body.set('input_code', document.getElementById('adl-email-code').value.trim());
|
||||
body.set('phone', phoneFull.trim());
|
||||
body.set('agree_privacy', '1');
|
||||
body.set(
|
||||
'agree_subscribe',
|
||||
document.getElementById('adl-agree-subscribe').checked ? '1' : '0'
|
||||
);
|
||||
|
||||
fetch(ajaxUrl, { method: 'POST', body: body, credentials: 'same-origin' })
|
||||
.then(function (res) { return res.json(); })
|
||||
.then(function (res) {
|
||||
if (res && res.success) {
|
||||
var emailVal = document.getElementById('adl-email').value.trim();
|
||||
window.location.href = successUrl + '?email=' + encodeURIComponent(emailVal);
|
||||
return;
|
||||
}
|
||||
showErr(res && res.data && res.data.message ? res.data.message : 'Registration failed.');
|
||||
submitBtn.disabled = false;
|
||||
submitBtn.textContent = 'Sign up';
|
||||
})
|
||||
.catch(function () {
|
||||
showErr('Registration request failed. Please try again.');
|
||||
submitBtn.disabled = false;
|
||||
submitBtn.textContent = 'Sign up';
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', initAdlRegister);
|
||||
} else {
|
||||
initAdlRegister();
|
||||
}
|
||||
|
||||
document.addEventListener('aifo:adl-register-ready', initAdlRegister);
|
||||
})();
|
||||
@@ -0,0 +1,62 @@
|
||||
/**
|
||||
* Loads challenge-floor.section.html into #challenge-floor-module, then boots render scripts.
|
||||
*/
|
||||
(function () {
|
||||
var MODULE_URL = '/pages/modules/challenge-floor.section.html';
|
||||
var PROGRAM_DATA_URL = '/assets/js/challenge-floor-program-data.js';
|
||||
var RENDER_URL = '/assets/js/challenge-floor-render.js';
|
||||
|
||||
function loadScript(src) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
if (document.querySelector('script[src="' + src + '"]')) {
|
||||
resolve();
|
||||
return;
|
||||
}
|
||||
var script = document.createElement('script');
|
||||
script.src = src;
|
||||
script.onload = resolve;
|
||||
script.onerror = function () {
|
||||
reject(new Error('Failed to load ' + src));
|
||||
};
|
||||
document.body.appendChild(script);
|
||||
});
|
||||
}
|
||||
|
||||
function bootChallengeFloor() {
|
||||
window.CHALLENGE_FLOOR_BOOT = window.CHALLENGE_FLOOR_BOOT || {};
|
||||
if (!window.CHALLENGE_FLOOR_BOOT.assetBase) {
|
||||
window.CHALLENGE_FLOOR_BOOT.assetBase = '../assets/images/challenge/';
|
||||
}
|
||||
|
||||
return loadScript(PROGRAM_DATA_URL).then(function () {
|
||||
return loadScript(RENDER_URL);
|
||||
});
|
||||
}
|
||||
|
||||
function loadChallengeFloorModule() {
|
||||
var container = document.getElementById('challenge-floor-module');
|
||||
if (!container) return;
|
||||
|
||||
fetch(MODULE_URL, { credentials: 'same-origin' })
|
||||
.then(function (res) {
|
||||
if (!res.ok) throw new Error('Failed to load ' + MODULE_URL);
|
||||
return res.text();
|
||||
})
|
||||
.then(function (html) {
|
||||
container.innerHTML = html;
|
||||
return bootChallengeFloor();
|
||||
})
|
||||
.then(function () {
|
||||
document.dispatchEvent(new CustomEvent('aifo:challenge-floor-ready'));
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[challenge-floor-module.js]', err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', loadChallengeFloorModule);
|
||||
} else {
|
||||
loadChallengeFloorModule();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,46 @@
|
||||
/**
|
||||
* Loads home-hero-carousel.section.html into #home-hero-carousel-module
|
||||
*/
|
||||
(function () {
|
||||
var MODULE_URL = '/pages/modules/home-hero-carousel.section.html';
|
||||
|
||||
function loadHomeHeroCarouselModule() {
|
||||
var container = document.getElementById('home-hero-carousel-module');
|
||||
if (!container) return;
|
||||
|
||||
fetch(MODULE_URL, { credentials: 'same-origin' })
|
||||
.then(function (res) {
|
||||
if (!res.ok) throw new Error('Failed to load ' + MODULE_URL);
|
||||
return res.text();
|
||||
})
|
||||
.then(function (html) {
|
||||
container.innerHTML = html;
|
||||
var ensureScript = function () {
|
||||
if (window.AifoHomeHeroCarouselInit) {
|
||||
var root = container.querySelector('[data-home-hero-carousel]');
|
||||
if (root) window.AifoHomeHeroCarouselInit(root);
|
||||
return;
|
||||
}
|
||||
var script = document.createElement('script');
|
||||
script.src = '/js/home-hero-carousel.js';
|
||||
script.onload = function () {
|
||||
var root = container.querySelector('[data-home-hero-carousel]');
|
||||
if (root && window.AifoHomeHeroCarouselInit) {
|
||||
window.AifoHomeHeroCarouselInit(root);
|
||||
}
|
||||
};
|
||||
document.body.appendChild(script);
|
||||
};
|
||||
ensureScript();
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[home-hero-carousel-module.js]', err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', loadHomeHeroCarouselModule);
|
||||
} else {
|
||||
loadHomeHeroCarouselModule();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,153 @@
|
||||
/**
|
||||
* Home hero carousel — autoplay + dot navigation + mobile swipe
|
||||
*/
|
||||
(function () {
|
||||
var AUTOPLAY_MS = 5000;
|
||||
var SWIPE_THRESHOLD = 48;
|
||||
var MOBILE_MQ = '(max-width: 991.98px)';
|
||||
|
||||
function initHomeHeroCarousel(root) {
|
||||
if (root.getAttribute('data-carousel-ready') === 'true') return;
|
||||
root.setAttribute('data-carousel-ready', 'true');
|
||||
|
||||
var slides = root.querySelectorAll('[data-home-hero-slide]');
|
||||
var dots = root.querySelectorAll('[data-home-hero-dot]');
|
||||
var viewport = root.querySelector('.home-hero-carousel__viewport');
|
||||
if (!slides.length) return;
|
||||
|
||||
var index = 0;
|
||||
var timer = null;
|
||||
var touchStartX = 0;
|
||||
var touchStartY = 0;
|
||||
var touchTracking = false;
|
||||
|
||||
function setSlide(nextIndex) {
|
||||
index = (nextIndex + slides.length) % slides.length;
|
||||
|
||||
slides.forEach(function (slide, i) {
|
||||
var active = i === index;
|
||||
slide.classList.toggle('is-active', active);
|
||||
slide.setAttribute('aria-hidden', active ? 'false' : 'true');
|
||||
});
|
||||
|
||||
dots.forEach(function (dot, i) {
|
||||
var active = i === index;
|
||||
dot.classList.toggle('is-active', active);
|
||||
dot.setAttribute('aria-selected', active ? 'true' : 'false');
|
||||
});
|
||||
}
|
||||
|
||||
function startAutoplay() {
|
||||
stopAutoplay();
|
||||
timer = window.setInterval(function () {
|
||||
setSlide(index + 1);
|
||||
}, AUTOPLAY_MS);
|
||||
}
|
||||
|
||||
function stopAutoplay() {
|
||||
if (timer) {
|
||||
window.clearInterval(timer);
|
||||
timer = null;
|
||||
}
|
||||
}
|
||||
|
||||
function isMobileSwipeEnabled() {
|
||||
return window.matchMedia(MOBILE_MQ).matches;
|
||||
}
|
||||
|
||||
function bindTouchSwipe() {
|
||||
if (!viewport || viewport.getAttribute('data-swipe-ready') === 'true') return;
|
||||
viewport.setAttribute('data-swipe-ready', 'true');
|
||||
|
||||
viewport.addEventListener(
|
||||
'touchstart',
|
||||
function (e) {
|
||||
if (!isMobileSwipeEnabled() || !e.touches.length) return;
|
||||
touchStartX = e.touches[0].clientX;
|
||||
touchStartY = e.touches[0].clientY;
|
||||
touchTracking = true;
|
||||
stopAutoplay();
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
|
||||
viewport.addEventListener(
|
||||
'touchend',
|
||||
function (e) {
|
||||
if (!touchTracking) return;
|
||||
touchTracking = false;
|
||||
|
||||
if (!isMobileSwipeEnabled()) {
|
||||
startAutoplay();
|
||||
return;
|
||||
}
|
||||
|
||||
var touch = e.changedTouches[0];
|
||||
if (!touch) {
|
||||
startAutoplay();
|
||||
return;
|
||||
}
|
||||
|
||||
var dx = touch.clientX - touchStartX;
|
||||
var dy = touch.clientY - touchStartY;
|
||||
|
||||
if (Math.abs(dx) < SWIPE_THRESHOLD || Math.abs(dx) <= Math.abs(dy)) {
|
||||
startAutoplay();
|
||||
return;
|
||||
}
|
||||
|
||||
if (dx < 0) {
|
||||
setSlide(index + 1);
|
||||
} else {
|
||||
setSlide(index - 1);
|
||||
}
|
||||
startAutoplay();
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
|
||||
viewport.addEventListener(
|
||||
'touchcancel',
|
||||
function () {
|
||||
touchTracking = false;
|
||||
startAutoplay();
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
}
|
||||
|
||||
dots.forEach(function (dot) {
|
||||
dot.addEventListener('click', function () {
|
||||
var target = Number(dot.getAttribute('data-home-hero-dot'));
|
||||
if (Number.isNaN(target)) return;
|
||||
setSlide(target);
|
||||
startAutoplay();
|
||||
});
|
||||
});
|
||||
|
||||
root.addEventListener('mouseenter', stopAutoplay);
|
||||
root.addEventListener('mouseleave', startAutoplay);
|
||||
root.addEventListener('focusin', stopAutoplay);
|
||||
root.addEventListener('focusout', function (e) {
|
||||
if (!root.contains(e.relatedTarget)) startAutoplay();
|
||||
});
|
||||
|
||||
bindTouchSwipe();
|
||||
setSlide(0);
|
||||
startAutoplay();
|
||||
}
|
||||
|
||||
function boot() {
|
||||
document.querySelectorAll('[data-home-hero-carousel]').forEach(initHomeHeroCarousel);
|
||||
}
|
||||
|
||||
window.AifoHomeHeroCarouselInit = initHomeHeroCarousel;
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', boot);
|
||||
} else {
|
||||
boot();
|
||||
}
|
||||
|
||||
document.addEventListener('aifo:home-hero-carousel-reload', boot);
|
||||
})();
|
||||
@@ -0,0 +1,64 @@
|
||||
/**
|
||||
* Loads Leading V2 header/footer modules (separate from layout.js nav/footer).
|
||||
*/
|
||||
(function () {
|
||||
var HEADER_URL = "/components/leading-v2-header.html";
|
||||
var FOOTER_URL = "/components/leading-v2-footer.html";
|
||||
|
||||
function fetchText(url) {
|
||||
return fetch(url, { credentials: "same-origin" }).then(function (res) {
|
||||
if (!res.ok) throw new Error("Failed to load " + url + " (" + res.status + ")");
|
||||
return res.text();
|
||||
});
|
||||
}
|
||||
|
||||
function injectHtml(containerId, html) {
|
||||
var el = document.getElementById(containerId);
|
||||
if (!el) return null;
|
||||
el.innerHTML = html;
|
||||
return el;
|
||||
}
|
||||
|
||||
function updateCopyrightYear(root) {
|
||||
var year = String(new Date().getFullYear());
|
||||
root.querySelectorAll("[data-lv2-year]").forEach(function (el) {
|
||||
el.textContent = year;
|
||||
});
|
||||
}
|
||||
|
||||
function initLayoutV2() {
|
||||
var headerContainer = document.getElementById("header-v2-container");
|
||||
var footerContainer = document.getElementById("footer-v2-container");
|
||||
if (!headerContainer && !footerContainer) return;
|
||||
|
||||
var tasks = [];
|
||||
tasks.push(headerContainer ? fetchText(HEADER_URL) : Promise.resolve(null));
|
||||
tasks.push(footerContainer ? fetchText(FOOTER_URL) : Promise.resolve(null));
|
||||
|
||||
Promise.all(tasks)
|
||||
.then(function (parts) {
|
||||
var headerHtml = parts[0];
|
||||
var footerHtml = parts[1];
|
||||
|
||||
if (headerHtml) {
|
||||
injectHtml("header-v2-container", headerHtml);
|
||||
}
|
||||
|
||||
if (footerHtml) {
|
||||
var footerRoot = injectHtml("footer-v2-container", footerHtml);
|
||||
if (footerRoot) updateCopyrightYear(footerRoot);
|
||||
}
|
||||
|
||||
document.dispatchEvent(new CustomEvent("aifo:layout-v2-ready"));
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error("[layout-v2.js]", err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === "loading") {
|
||||
document.addEventListener("DOMContentLoaded", initLayoutV2);
|
||||
} else {
|
||||
initLayoutV2();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,34 @@
|
||||
/**
|
||||
* Partnership page — FAQ accordion.
|
||||
*/
|
||||
(function () {
|
||||
function initFaq(root) {
|
||||
if (!root) return;
|
||||
|
||||
root.querySelectorAll(".faq-header").forEach(function (header) {
|
||||
header.addEventListener("click", function () {
|
||||
var item = header.closest(".faq-item");
|
||||
if (!item) return;
|
||||
|
||||
var isActive = item.classList.contains("active");
|
||||
root.querySelectorAll(".faq-item").forEach(function (el) {
|
||||
el.classList.remove("active");
|
||||
});
|
||||
|
||||
if (!isActive) {
|
||||
item.classList.add("active");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function init() {
|
||||
initFaq(document.querySelector("#partnership-page .partnership-faq"));
|
||||
}
|
||||
|
||||
if (document.readyState === "loading") {
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,30 @@
|
||||
/**
|
||||
* Loads promo-compare.section.html into #promo-compare-module.
|
||||
*/
|
||||
(function () {
|
||||
var MODULE_URL = '/pages/modules/promo-compare.section.html';
|
||||
|
||||
function loadPromoCompareModule() {
|
||||
var container = document.getElementById('promo-compare-module');
|
||||
if (!container) return;
|
||||
|
||||
fetch(MODULE_URL, { credentials: 'same-origin' })
|
||||
.then(function (res) {
|
||||
if (!res.ok) throw new Error('Failed to load ' + MODULE_URL);
|
||||
return res.text();
|
||||
})
|
||||
.then(function (html) {
|
||||
container.innerHTML = html;
|
||||
document.dispatchEvent(new CustomEvent('aifo:promo-compare-ready'));
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[promo-compare-module.js]', err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', loadPromoCompareModule);
|
||||
} else {
|
||||
loadPromoCompareModule();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,260 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="Learn about AIFO — our mission, team, and the traders we support worldwide.">
|
||||
<title>About Us | AIFO</title>
|
||||
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
||||
<link href="../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-page-bg.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-section-glow.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="../assets/flagicon/css/flag-icons.min.css">
|
||||
<link type="text/css" href="../assets/css/about-us-2.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="about-us-2">
|
||||
<div class="top-code-bar bg-primary">
|
||||
<div class="container d-flex align-items-center justify-content-center h-100">
|
||||
<span class="top-code-label">Trading starts here. Ready to take the challenge?</span>
|
||||
<a href="#" class="btn btn-sm top-code-btn">Join Now</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="aifo-page-bg aifo-page-bg--grid">
|
||||
<div class="au2-page">
|
||||
<!-- Hero -->
|
||||
<section class="au2-hero" aria-labelledby="au2-hero-title">
|
||||
<div class="au2-hero__glow" aria-hidden="true"></div>
|
||||
<div class="au2-hero__inner">
|
||||
<h1 class="au2-hero__title" id="au2-hero-title">About AIFO</h1>
|
||||
<p class="au2-hero__desc">
|
||||
AIFO is a prop trading firm built to give traders transparent funding, professional tools,
|
||||
and a community that supports real growth — from your first challenge to funded success.
|
||||
</p>
|
||||
<div class="au2-hero__actions">
|
||||
<a href="#" class="au2-btn au2-btn--primary">Get Started</a>
|
||||
<a href="/pages/academy.html" class="au2-btn au2-btn--outline">Begin Learning</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Intro -->
|
||||
<section class="au2-intro" aria-labelledby="au2-intro-title">
|
||||
<div class="au2-intro__content">
|
||||
<p class="au2-label">About Us</p>
|
||||
<h2 class="au2-intro__title" id="au2-intro-title">AIFO was built for traders.</h2>
|
||||
<p class="au2-intro__text">
|
||||
Here at AIFO, our team consists of experienced traders and financial professionals who truly
|
||||
understand the markets. We're committed to supporting your growth with clear rules, practical
|
||||
tools, and quality educational resources. Our goal is simple: to help you become a more
|
||||
confident and consistent trader.
|
||||
</p>
|
||||
</div>
|
||||
<div class="au2-intro__visual">
|
||||
<img
|
||||
src="../assets/images/demo/about_us.png"
|
||||
alt="AIFO team in a modern trading office"
|
||||
width="560"
|
||||
height="360"
|
||||
decoding="async"
|
||||
>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Stats -->
|
||||
<section class="au2-stats" aria-label="AIFO achievements">
|
||||
<div class="au2-stats__bar">
|
||||
<div class="au2-stats__item">
|
||||
<p class="au2-stats__value">$25M+</p>
|
||||
<p class="au2-stats__label">Payouts Distributed</p>
|
||||
</div>
|
||||
<div class="au2-stats__item">
|
||||
<p class="au2-stats__value">4,200+</p>
|
||||
<p class="au2-stats__label">Active Traders</p>
|
||||
</div>
|
||||
<div class="au2-stats__item">
|
||||
<p class="au2-stats__value">85+</p>
|
||||
<p class="au2-stats__label">Countries Represented</p>
|
||||
</div>
|
||||
<div class="au2-stats__item">
|
||||
<p class="au2-stats__value">50+</p>
|
||||
<p class="au2-stats__label">Team Members</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- CTA Banner -->
|
||||
<section class="au2-cta aifo-section-glow-host" aria-labelledby="au2-cta-title">
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
<div class="au2-cta__glow" aria-hidden="true"></div>
|
||||
<div class="au2-cta__inner">
|
||||
<h2 class="au2-cta__title" id="au2-cta-title">
|
||||
<span class="text-orange">Ready</span> To Become A Prop Trader?
|
||||
</h2>
|
||||
<p class="au2-cta__desc">
|
||||
Join thousands of traders who are scaling their skills with AIFO's transparent funding programs.
|
||||
</p>
|
||||
<a href="#" class="au2-btn au2-btn--primary">Get Started</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Core Values -->
|
||||
<section class="au2-values" aria-labelledby="au2-values-title">
|
||||
<h2 class="au2-section-title au2-section-title--center" id="au2-values-title">Our Core Values</h2>
|
||||
<div class="au2-values__grid">
|
||||
<article class="au2-value-card">
|
||||
<div class="au2-value-card__icon" aria-hidden="true">
|
||||
<img src="../assets/images/backgrounds/icon/icon-em-1.svg" alt="" width="40" height="40">
|
||||
</div>
|
||||
<h3 class="au2-value-card__title">Education</h3>
|
||||
<p class="au2-value-card__text">
|
||||
Empowering traders with practical learning resources, expert guidance, and tools that turn
|
||||
market knowledge into consistent performance.
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-value-card">
|
||||
<div class="au2-value-card__icon" aria-hidden="true">
|
||||
<img src="../assets/images/backgrounds/icon/icon-em-2.svg" alt="" width="40" height="40">
|
||||
</div>
|
||||
<h3 class="au2-value-card__title">Community</h3>
|
||||
<p class="au2-value-card__text">
|
||||
A supportive network where traders share insights, learn together, and celebrate every step
|
||||
of the journey toward funded trading success.
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-value-card">
|
||||
<div class="au2-value-card__icon" aria-hidden="true">
|
||||
<img src="../assets/images/backgrounds/icon/icon-help.svg" alt="" width="40" height="40">
|
||||
</div>
|
||||
<h3 class="au2-value-card__title">Innovation</h3>
|
||||
<p class="au2-value-card__text">
|
||||
Cutting-edge technology and AI-powered guidance that help you trade with confidence, manage
|
||||
risk, and stay within the rules.
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Testimonials -->
|
||||
<section class="au2-testimonials" aria-labelledby="au2-testimonials-title">
|
||||
<h2 class="au2-section-title au2-section-title--center" id="au2-testimonials-title">
|
||||
What Traders Are <span class="text-orange">Saying</span>
|
||||
</h2>
|
||||
<p class="au2-section-desc au2-section-desc--center">
|
||||
Hear from real traders who have passed challenges and received payouts with AIFO.
|
||||
</p>
|
||||
<div class="au2-testimonials__grid">
|
||||
<article class="au2-testimonial">
|
||||
<div class="au2-testimonial__head">
|
||||
<span class="fi fi-gb au2-testimonial__flag" aria-hidden="true"></span>
|
||||
<div>
|
||||
<p class="au2-testimonial__name">David R.</p>
|
||||
<p class="au2-testimonial__meta">$100,000 Account</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="au2-testimonial__quote">
|
||||
"Clear rules, fast payouts, and a team that actually understands what traders need."
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-testimonial au2-testimonial--wide">
|
||||
<div class="au2-testimonial__head">
|
||||
<span class="fi fi-ca au2-testimonial__flag" aria-hidden="true"></span>
|
||||
<div>
|
||||
<p class="au2-testimonial__name">Marcus T.</p>
|
||||
<p class="au2-testimonial__meta">$50,000 Account</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="au2-testimonial__quote">
|
||||
"I've been trading for years, and this is by far the best experience I've had with a prop firm.
|
||||
The evaluation process is fair and the support team is responsive."
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-testimonial">
|
||||
<div class="au2-testimonial__head">
|
||||
<span class="fi fi-au au2-testimonial__flag" aria-hidden="true"></span>
|
||||
<div>
|
||||
<p class="au2-testimonial__name">Sarah L.</p>
|
||||
<p class="au2-testimonial__meta">$25,000 Account</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="au2-testimonial__quote">
|
||||
"AIFO helped me stay disciplined. The educational content made a real difference."
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-testimonial">
|
||||
<div class="au2-testimonial__head">
|
||||
<span class="fi fi-gb au2-testimonial__flag" aria-hidden="true"></span>
|
||||
<div>
|
||||
<p class="au2-testimonial__name">Alex M.</p>
|
||||
<p class="au2-testimonial__meta">$50,000 Account</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="au2-testimonial__quote">
|
||||
"AI Coach helped me control risk and stay within the rules. Highly recommend."
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-testimonial au2-testimonial--wide">
|
||||
<div class="au2-testimonial__head">
|
||||
<span class="fi fi-ca au2-testimonial__flag" aria-hidden="true"></span>
|
||||
<div>
|
||||
<p class="au2-testimonial__name">James K.</p>
|
||||
<p class="au2-testimonial__meta">$200,000 Account</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="au2-testimonial__quote">
|
||||
"From challenge to payout, everything was transparent. No hidden fees, no surprises —
|
||||
just a professional platform built for serious traders."
|
||||
</p>
|
||||
</article>
|
||||
<article class="au2-testimonial">
|
||||
<div class="au2-testimonial__head">
|
||||
<span class="fi fi-au au2-testimonial__flag" aria-hidden="true"></span>
|
||||
<div>
|
||||
<p class="au2-testimonial__name">Emma W.</p>
|
||||
<p class="au2-testimonial__meta">$25,000 Account</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="au2-testimonial__quote">
|
||||
"The community on Discord is incredibly supportive. You're never trading alone."
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Support -->
|
||||
<section class="au2-support" aria-labelledby="au2-support-title">
|
||||
<div class="au2-support__content">
|
||||
<h2 class="au2-support__title" id="au2-support-title">Not found what you're looking for?</h2>
|
||||
<p class="au2-support__desc">Chat with us directly or send us an email — we're here to help.</p>
|
||||
<div class="au2-support__actions">
|
||||
<a href="#" class="au2-btn au2-btn--primary">Chat with us</a>
|
||||
<a href="/pages/contact.html" class="au2-btn au2-btn--outline">Send us an email</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="au2-support__visual" aria-hidden="true">
|
||||
<img
|
||||
src="../assets/images/promotion-activity/hero-layer-3.png"
|
||||
alt=""
|
||||
width="400"
|
||||
height="400"
|
||||
decoding="async"
|
||||
>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div id="footer-container"></div>
|
||||
|
||||
<script src="../assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
||||
<script src="../assets/vendor/popper/popper.min.js"></script>
|
||||
<script src="../assets/js/bootstrap/bootstrap.min.js"></script>
|
||||
<script src="../assets/vendor/fontawesome/js/fontawesome-all.min.js" defer></script>
|
||||
<script src="../assets/js/theme.js"></script>
|
||||
<script src="/js/layout.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>Leading V2 | AIFO</title>
|
||||
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
||||
<link href="../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-page-bg.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/adl-register.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/promo-compare.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/leading-v2.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="leading-v2">
|
||||
<div id="header-v2-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<div class="leading-v2-page">
|
||||
<section class="lv2-hero">
|
||||
<h1 class="lv2-hero__title">
|
||||
Start Your Trading Journey <span class="lv2-hero__title-accent">at 50% OFF</span>
|
||||
</h1>
|
||||
<p class="lv2-hero__subtitle">Fail? Retry Free！</p>
|
||||
<div class="lv2-hero__form" id="adl-register-container"></div>
|
||||
</section>
|
||||
|
||||
<div
|
||||
id="promo-compare-module"
|
||||
class="promo-compare-module"
|
||||
data-promo-compare-module
|
||||
></div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div id="footer-v2-container"></div>
|
||||
|
||||
<script src="/js/layout-v2.js"></script>
|
||||
<script src="/js/adl-register-module.js"></script>
|
||||
<script src="/js/adl-register.js"></script>
|
||||
<script src="/js/promo-compare-module.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>ADL Register Module</title>
|
||||
<link href="../../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/modules/adl-register.css" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
background: #070400;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="adl-register-container"></div>
|
||||
|
||||
<script src="/js/adl-register-module.js"></script>
|
||||
<script src="/js/adl-register.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,83 @@
|
||||
<!-- ADL register form fragment — from section-adl-register.php (static) -->
|
||||
<section class="adl-register adl-register-top" id="register-now" data-adl-register-module>
|
||||
<div class="container">
|
||||
<div class="adl-register-box">
|
||||
<h2>Start Your Registration</h2>
|
||||
<p>Create your account now and begin your funded trading journey with AIFO.</p>
|
||||
|
||||
<form id="adl-register-form" class="adl-register-form" novalidate>
|
||||
<div class="adl-form-grid">
|
||||
<div class="adl-field">
|
||||
<label for="adl-username">Username</label>
|
||||
<input type="text" id="adl-username" name="username" required placeholder="Enter your name">
|
||||
</div>
|
||||
<div class="adl-field">
|
||||
<label for="adl-email">Email Address</label>
|
||||
<input type="email" id="adl-email" name="email" required placeholder="Enter your email">
|
||||
</div>
|
||||
<div class="adl-field">
|
||||
<label for="adl-phone">Phone Number</label>
|
||||
<div class="adl-phone-row">
|
||||
<div class="adl-phone-wrapper">
|
||||
<button type="button" class="adl-country-select" id="adl-country-select" aria-expanded="false" aria-haspopup="listbox">
|
||||
<span class="adl-country-flag" id="adl-country-flag">🇦🇺</span>
|
||||
<span class="adl-country-code" id="adl-country-code">+61</span>
|
||||
<span class="adl-country-arrow" aria-hidden="true">▾</span>
|
||||
</button>
|
||||
<div class="adl-country-menu" id="adl-country-menu" role="listbox" aria-label="Country code">
|
||||
<input type="text" id="adl-country-search" class="adl-country-search" placeholder="Search country..." aria-label="Search country">
|
||||
<div id="adl-country-list" class="adl-country-list"></div>
|
||||
</div>
|
||||
<input type="hidden" id="adl-country-code-input" name="country_code" value="+61">
|
||||
<input type="tel" id="adl-phone" name="phone" class="adl-phone-input" required placeholder="Enter your phone number">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="adl-field">
|
||||
<label for="adl-password">Password</label>
|
||||
<div class="adl-pass-wrap">
|
||||
<input type="password" id="adl-password" name="password" required placeholder="Enter your password">
|
||||
<button type="button" class="adl-eye-toggle" data-target="#adl-password" aria-label="Show password">
|
||||
<svg class="adl-eye-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="adl-field">
|
||||
<label for="adl-confirm-password">Confirm Password</label>
|
||||
<div class="adl-pass-wrap">
|
||||
<input type="password" id="adl-confirm-password" name="confirm_password" required placeholder="Confirm password">
|
||||
<button type="button" class="adl-eye-toggle" data-target="#adl-confirm-password" aria-label="Show password">
|
||||
<svg class="adl-eye-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="adl-field">
|
||||
<label for="adl-email-code">Email Verification Code</label>
|
||||
<div class="adl-code-row">
|
||||
<input type="text" id="adl-email-code" name="email_code" required placeholder="Enter code">
|
||||
<button type="button" id="adl-send-code" class="adl-btn adl-btn-primary">Get Code</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<label class="adl-check">
|
||||
<input type="checkbox" id="adl-agree-privacy" name="agree_privacy" required>
|
||||
I confirm that I am not located in a country where AIFO's services are unavailable, and that the information I've provided is accurate and matches my government-issued ID.
|
||||
</label>
|
||||
<label class="adl-check">
|
||||
<input type="checkbox" id="adl-agree-subscribe" name="agree_subscribe">
|
||||
Would you like to receive updates about our project? Join our newsletter and receive the latest news delivered to your inbox.
|
||||
</label>
|
||||
|
||||
<div id="adl-register-error" class="adl-register-error" role="alert"></div>
|
||||
<button type="submit" id="adl-register-submit" class="adl-btn adl-btn-primary adl-submit">Sign up</button>
|
||||
<p class="adl-login-hint">Already have an account? <a href="/pages/user_login.html">Log in</a></p>
|
||||
</form>
|
||||
|
||||
<div class="adl-register-actions">
|
||||
<a href="#" class="adl-btn adl-btn-ghost">View Trading Platforms</a>
|
||||
</div>
|
||||
<p class="adl-disclaimer">By registering, you agree to AIFO terms and challenge rules. Trading involves risk.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,10 @@
|
||||
<!--
|
||||
AIFO section glow — paste inside .aifo-section-glow-host or .aifo-page-glow-host
|
||||
See docs/aifo-section-glow.md
|
||||
|
||||
Right (vertical side glow):
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
|
||||
Left (top-left corner glow):
|
||||
<div class="left_bg_light" aria-hidden="true"></div>
|
||||
-->
|
||||
@@ -0,0 +1,32 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>Challenge Floor Module</title>
|
||||
<link type="text/css" href="../../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
||||
<link href="../../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/challenge.css" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
background: #070400;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
id="challenge-floor-module"
|
||||
class="challenge-floor-module"
|
||||
data-challenge-floor-module
|
||||
></div>
|
||||
|
||||
<script src="../../assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
||||
<script src="/js/challenge-floor-module.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,147 @@
|
||||
<!-- Challenge floor fragment — include inside #challenge-floor-module -->
|
||||
<section class="challenge-floor" id="section-challenge">
|
||||
<div class="container">
|
||||
<div class="challenge-hero">
|
||||
<div class="hero-title-wrapper">
|
||||
<div class="text-center">
|
||||
<h2 class="heading h1 fade-in show">Choose <img src="../assets/images/backgrounds/icon/section-icon-1.png" alt="Funded Trading" class="why-img floating-img"></h2>
|
||||
<h2 class="heading h1 fade-in show">Your <span class="text-orange">Challenge</span></h2>
|
||||
<div class="fluid-paragraph text-center">
|
||||
<p class="lead lh-180 fade-in show">
|
||||
Whether you're taking your first step or working toward larger accounts, AIFO has <span class="text-orange">flexible challenges</span> designed to match your style and support your growth.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center mb-4">
|
||||
<div class="tab-wrap">
|
||||
<button type="button" class="tab-btn" data-tab="1step">1 STEP</button>
|
||||
<div class="tab-btn-with-badge">
|
||||
<span class="challenge-tab-popular-badge" role="img" aria-label="Popular">
|
||||
<span class="icon iconfont icon-challenge_start" aria-hidden="true"></span>
|
||||
<span class="challenge-tab-popular-badge-label">Popular</span>
|
||||
</span>
|
||||
<button type="button" class="tab-btn active" data-tab="2step">2 STEP</button>
|
||||
</div>
|
||||
<button type="button" class="tab-btn" data-tab="3step">3 STEP</button>
|
||||
<div class="tab-btn-with-badge">
|
||||
<span class="challenge-tab-popular-badge" role="img" aria-label="Popular">
|
||||
<span class="icon iconfont icon-challenge_start" aria-hidden="true"></span>
|
||||
<span class="challenge-tab-popular-badge-label">Popular</span>
|
||||
</span>
|
||||
<button type="button" class="tab-btn" data-tab="instant">INSTANT</button>
|
||||
</div>
|
||||
<div class="tab-btn-with-24h-decor">
|
||||
<img
|
||||
class="challenge-tab-24h-new-img"
|
||||
src="../assets/images/challenge/challenge_icon_new.png"
|
||||
width="96"
|
||||
height="33"
|
||||
alt="NEW"
|
||||
decoding="async"
|
||||
/>
|
||||
<button type="button" class="tab-btn tab-btn--24h" data-tab="24h">
|
||||
<img
|
||||
class="challenge-tab-24h-frame-img"
|
||||
src="../assets/images/challenge/challenge_tab_24h_frame.svg"
|
||||
width="24"
|
||||
height="24"
|
||||
alt=""
|
||||
decoding="async"
|
||||
/>
|
||||
<span class="tab-btn-24h-text">24H</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="challengeInstantSubtabs" class="challenge-instant-subtabs d-none text-center">
|
||||
<div class="tab-wrap">
|
||||
<button type="button" class="challenge-instant-subtab" data-instant-mode="pro">AIFO Standard</button>
|
||||
<button type="button" class="challenge-instant-subtab" data-instant-mode="aifo">AIFO Elite</button>
|
||||
<button type="button" class="challenge-instant-subtab active" data-instant-mode="NoCommission">No Commission</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="challengeAifoliteSubtabs" class="challenge-instant-subtabs d-none text-center">
|
||||
<div class="tab-wrap">
|
||||
<button type="button" class="challenge-instant-subtab active" data-aifolite-mode="lite">AIFO Lite</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="challengeCurrencyTabs" class="challenge-currency-tabs d-flex flex-wrap justify-content-center" style="display: none !important;"></div>
|
||||
|
||||
<div id="challenge-floor-mount" class="challenge-floor-mount"></div>
|
||||
|
||||
<div class="row mt-2 challenge-floor-addons">
|
||||
<div class="col-12">
|
||||
<div class="text-center addons-title">Add-ons</div>
|
||||
<div class="addons-box">
|
||||
<div class="addon-item">
|
||||
<span class="addon-badge">+20%</span>
|
||||
<span>Profit split increase up to 95%</span>
|
||||
</div>
|
||||
<div class="addon-item">
|
||||
<span class="addon-badge">+10%</span>
|
||||
<span>Fast payout (payout on demand)</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div
|
||||
id="challengeCouponModal"
|
||||
class="challenge-coupon-modal"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="challengeCouponModalTitle"
|
||||
aria-hidden="true"
|
||||
hidden
|
||||
>
|
||||
<div class="challenge-coupon-modal__backdrop" data-coupon-modal-dismiss="true"></div>
|
||||
<div class="challenge-coupon-modal__panel">
|
||||
<div class="challenge-coupon-modal__panel-bg" aria-hidden="true"></div>
|
||||
<div class="challenge-coupon-modal__inner">
|
||||
<img
|
||||
class="challenge-coupon-modal__logo"
|
||||
src="../assets/images/challenge/challenge_coupon_modal_logo.png"
|
||||
width="68"
|
||||
height="26"
|
||||
alt="AIFO"
|
||||
decoding="async"
|
||||
onerror="this.onerror=null;this.src='../assets/images/challenge/challenge_coupon_modal_logo.svg';"
|
||||
/>
|
||||
<h2 id="challengeCouponModalTitle" class="challenge-coupon-modal__title">Coupon copied</h2>
|
||||
<p class="challenge-coupon-modal__text">Coupon has been applied to the clipboard.</p>
|
||||
<div class="challenge-coupon-modal__hero">
|
||||
<img
|
||||
class="challenge-coupon-modal__hero-img"
|
||||
src="../assets/images/challenge/challenge_coupon_modal_hero.png"
|
||||
alt=""
|
||||
width="280"
|
||||
height="168"
|
||||
decoding="async"
|
||||
onerror="this.onerror=null;this.style.visibility='hidden';"
|
||||
/>
|
||||
</div>
|
||||
<div class="challenge-coupon-modal__code" id="challengeCouponModalCode">AIFO50</div>
|
||||
<div class="challenge-coupon-modal__actions">
|
||||
<button type="button" class="challenge-coupon-modal__cta" id="challengeCouponModalOk">
|
||||
<span class="challenge-coupon-modal__cta-label">Get Started</span>
|
||||
<img
|
||||
class="challenge-coupon-modal__cta-arrow"
|
||||
src="../assets/images/challenge/challenge_coupon_modal_arrow.svg"
|
||||
alt=""
|
||||
width="20"
|
||||
height="20"
|
||||
decoding="async"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,29 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Home Hero Carousel Module</title>
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<link href="../../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/modules/home-hero-carousel.css" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
background: #070400;
|
||||
color: #fff;
|
||||
}
|
||||
#homepage {
|
||||
min-height: 100vh;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="aifo-bg-primary">
|
||||
<main class="main" id="homepage">
|
||||
<div id="home-hero-carousel-module"></div>
|
||||
</main>
|
||||
|
||||
<script src="/js/home-hero-carousel-module.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,116 @@
|
||||
<!-- Home hero carousel — from Serena/Figma HeroCarousel (3 slides, autoplay + dots) -->
|
||||
<section
|
||||
id="section-1"
|
||||
class="home-hero-carousel"
|
||||
data-home-hero-carousel
|
||||
aria-roledescription="carousel"
|
||||
aria-label="Homepage hero"
|
||||
>
|
||||
<div class="home-hero-carousel__glow" aria-hidden="true"></div>
|
||||
|
||||
<div class="home-hero-carousel__inner">
|
||||
<div class="home-hero-carousel__viewport">
|
||||
<article class="home-hero-carousel__slide is-active" data-home-hero-slide aria-hidden="false">
|
||||
<div class="home-hero-carousel__slide-grid">
|
||||
<div class="home-hero-carousel__content">
|
||||
<div class="home-hero-carousel__copy">
|
||||
<div class="home-hero-carousel__heading-group">
|
||||
<span class="home-hero-carousel__badge">
|
||||
<img src="./assets/images/banner/logo-1-icon.svg" alt="" class="home-hero-carousel__badge-icon" width="20" height="20" decoding="async" aria-hidden="true">
|
||||
Forex . Gold . Crypto
|
||||
</span>
|
||||
<h1 class="home-hero-carousel__title">
|
||||
Your Trading Journey <span class="text-primary-orange">Starts With AIFO</span>
|
||||
</h1>
|
||||
</div>
|
||||
<p class="home-hero-carousel__desc">Join thousands of traders who started with AIFO and discover the capital, tools, and expert guidance you need to grow and thrive.</p>
|
||||
</div>
|
||||
<div class="home-hero-carousel__actions">
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--primary">Start Challenge</a>
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--ghost">
|
||||
Learn To Trade
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
<a href="#" class="home-hero-carousel__ai-coach">
|
||||
<img src="./assets/images/banner/ChatGPT Image Jul 1, 2026, 01_34_31 PM.png" alt="" width="48" height="48" decoding="async">
|
||||
AI Coach
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="home-hero-carousel__visual">
|
||||
<img src="./assets/images/home-hero-carousel/slide-1.png" alt="AIFO trading globe" width="520" height="477" decoding="async">
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="home-hero-carousel__slide" data-home-hero-slide aria-hidden="true">
|
||||
<div class="home-hero-carousel__slide-grid">
|
||||
<div class="home-hero-carousel__content">
|
||||
<div class="home-hero-carousel__copy">
|
||||
<div class="home-hero-carousel__heading-group">
|
||||
<span class="home-hero-carousel__badge">
|
||||
<img src="./assets/images/banner/login-2-icon.svg" alt="" class="home-hero-carousel__badge-icon" width="20" height="20" decoding="async" aria-hidden="true">
|
||||
Real-time Market Analysis
|
||||
</span>
|
||||
<h2 class="home-hero-carousel__title">
|
||||
Meet <span class="text-primary-orange">AIFO Intelligence</span>
|
||||
</h2>
|
||||
</div>
|
||||
<p class="home-hero-carousel__desc">Begin using Prop Trading's very first AI Coach, designed to help you conduct complex market analysis and guide you toward becoming a funded trader.</p>
|
||||
</div>
|
||||
<div class="home-hero-carousel__actions">
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--primary">Try For Free</a>
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--ghost home-hero-carousel__btn--ai-coach">
|
||||
<img src="./assets/images/banner/ChatGPT Image Jul 1, 2026, 01_34_31 PM.png" alt="" width="45" height="45" decoding="async" aria-hidden="true">
|
||||
AI Coach
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="home-hero-carousel__visual">
|
||||
<img src="./assets/images/home-hero-carousel/slide-2.png" alt="AIFO AI Coach" width="520" height="477" decoding="async">
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="home-hero-carousel__slide" data-home-hero-slide aria-hidden="true">
|
||||
<div class="home-hero-carousel__slide-grid">
|
||||
<div class="home-hero-carousel__content">
|
||||
<div class="home-hero-carousel__copy">
|
||||
<div class="home-hero-carousel__heading-group">
|
||||
<span class="home-hero-carousel__badge">
|
||||
<img src="./assets/images/banner/login-3-icon.svg" alt="" class="home-hero-carousel__badge-icon" width="20" height="20" decoding="async" aria-hidden="true">
|
||||
Become a Funded Trader
|
||||
</span>
|
||||
<h2 class="home-hero-carousel__title">
|
||||
<span class="text-primary-orange">Flexible Challenges</span> Made For You
|
||||
</h2>
|
||||
</div>
|
||||
<p class="home-hero-carousel__desc">We offer a wide variety of different challenge types, from the traditional 1-step, 2-step, and 3-step challenges to our instant-access and Lite challenges, designed to suit your experience and goals.</p>
|
||||
</div>
|
||||
<div class="home-hero-carousel__actions">
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--primary">
|
||||
Choose Your Challenge
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 12V4M3 12l3-3M3 12l3 3M13 4v8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
<a href="#" class="home-hero-carousel__btn home-hero-carousel__btn--ghost home-hero-carousel__btn--ai-coach">
|
||||
<img src="./assets/images/banner/ChatGPT Image Jul 1, 2026, 01_34_31 PM.png" alt="" width="45" height="45" decoding="async" aria-hidden="true">
|
||||
AI Coach
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="home-hero-carousel__visual">
|
||||
<img src="./assets/images/home-hero-carousel/slide-3.png" alt="AIFO flexible challenges dashboard" width="520" height="477" decoding="async">
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="home-hero-carousel__dots" role="tablist" aria-label="Choose slide">
|
||||
<button type="button" class="home-hero-carousel__dot is-active" role="tab" aria-selected="true" aria-label="Go to slide 1" data-home-hero-dot="0"></button>
|
||||
<button type="button" class="home-hero-carousel__dot" role="tab" aria-selected="false" aria-label="Go to slide 2" data-home-hero-dot="1"></button>
|
||||
<button type="button" class="home-hero-carousel__dot" role="tab" aria-selected="false" aria-label="Go to slide 3" data-home-hero-dot="2"></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,45 @@
|
||||
<!-- Backup: original index.html #section-1 (before Figma home hero carousel) -->
|
||||
<section id="section-1" class="funded-trading-hero spotlight parallax bg-cover bg-size--cover">
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<h1 class="hero-title fade-in">
|
||||
<span class="line1 fade-in"><img src="./assets/images/backgrounds/img-02.png" alt="Funded Trading" class="hero-img floating-img"> Your First Step</span>
|
||||
<span class="line2 fade-in">Toward <span class="text-primary-orange">Funded Trading</span></span>
|
||||
</h1>
|
||||
|
||||
<div class="banner-contain d-flex align-items-center justify-content-center flex-wrap mt-6">
|
||||
<img src="./assets/images/backgrounds/img-03.png" alt="" class="img-fluid img-fluid-l me-5 floating-img fade-in">
|
||||
|
||||
<div class="text-center mx-4 fade-in">
|
||||
<div class="mb-3">
|
||||
<div class="banner-desc fade-in">
|
||||
Join thousands of traders who started with AIFO and discover the
|
||||
<span class="text-primary-orange">capital</span>,
|
||||
<span class="text-primary-orange">tools</span>, and
|
||||
<span class="text-primary-orange">expert </span><br><span class="text-primary-orange">guidance</span> you need to grow and thrive.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="trustpilot text-primary d-flex align-items-center justify-content-center gap-2 flex-wrap fade-in">
|
||||
<span>Rated Excellent </span>
|
||||
<span class="pd-lr-1"><img src="./assets/images/backgrounds/img-05.png" alt="Star" class="star-icon"></span>
|
||||
<span class="pd-lr-1 underline-text"> 43,636 reviews on</span>
|
||||
<span><a href="https://www.trustpilot.com/" target="_blank"><img src="./assets/images/backgrounds/Frame 427320868.svg" alt="Star" class="star-icon"></a></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="./assets/images/backgrounds/img-h-04.png" alt="" class="img-fluid img-fluid-r ms-5 floating-img fade-in">
|
||||
</div>
|
||||
|
||||
<div class="hero-buttons center-buttons fade-in">
|
||||
<a href="#" class="btn btn-start-challenge">Start Challenge</a>
|
||||
<a href="#" class="btn btn-free-trial">
|
||||
Free Trial
|
||||
<span class="btn-arrow">›</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,134 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Promo Compare Module</title>
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<link type="text/css" href="../../assets/css/modules/promo-compare.css" rel="stylesheet">
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
background: #070400;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
id="promo-compare-module"
|
||||
class="promo-compare-module"
|
||||
data-promo-compare-module
|
||||
>
|
||||
<div class="promo-compare-module__page">
|
||||
<section class="promo-section promo-section--compare aifo-section-glow-host">
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
<h2 class="promo-section__title promo-section__title--center">
|
||||
Why Traders Pass More <span class="text-orange">With AIFO</span>
|
||||
</h2>
|
||||
<div class="compare-table" role="table" aria-label="Comparison between other prop firms and AIFO">
|
||||
<div class="compare-table__header" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--head compare-table__cell--other" role="columnheader">
|
||||
Other Prop Firms
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--head compare-table__cell--aifo" role="columnheader">
|
||||
AIFO
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__body">
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>Trade alone</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>AI Coach included</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>No trade feedback</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>AI trade review</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>No risk analysis</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>AI risk analysis</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>No consistency score</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>Performance tracking</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>Pass or fail only</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>Learn & improve</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>Static dashboard</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>Personalized guidance</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,103 @@
|
||||
<!-- Promo compare table fragment — include inside #promo-compare-module -->
|
||||
<section class="promo-section promo-section--compare aifo-section-glow-host">
|
||||
<div class="aifo-glow-right" aria-hidden="true"></div>
|
||||
<h2 class="promo-section__title promo-section__title--center">
|
||||
Why Traders Pass More <span class="text-orange">With AIFO</span>
|
||||
</h2>
|
||||
<div class="compare-table" role="table" aria-label="Comparison between other prop firms and AIFO">
|
||||
<div class="compare-table__header" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--head compare-table__cell--other" role="columnheader">
|
||||
Other Prop Firms
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--head compare-table__cell--aifo" role="columnheader">
|
||||
AIFO
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__body">
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>Trade alone</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>AI Coach included</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>No trade feedback</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>AI trade review</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>No risk analysis</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>AI risk analysis</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>No consistency score</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>Performance tracking</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>Pass or fail only</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>Learn & improve</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="compare-table__row" role="row">
|
||||
<div class="compare-table__cell compare-table__cell--other" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--no" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</span>
|
||||
<span>Static dashboard</span>
|
||||
</div>
|
||||
<div class="compare-table__cell compare-table__cell--aifo" role="cell">
|
||||
<span class="compare-table__icon compare-table__icon--yes" aria-hidden="true">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.5 7.2 5.8 10.5 11.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</span>
|
||||
<span>Personalized guidance</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,154 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>Page Directory | AIFO</title>
|
||||
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
||||
<link href="../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/page-index.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="page-index">
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="page-index-main">
|
||||
<div class="page-index">
|
||||
<header class="page-index__header">
|
||||
<h1 class="page-index__title">Page <span class="text-orange">Directory</span></h1>
|
||||
<p class="page-index__desc">Central hub for all site pages. For internal preview and quick navigation.</p>
|
||||
</header>
|
||||
|
||||
<div class="page-index__grid">
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Home</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/index.html">Home<small>/index.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/index-user.html">Home (User)<small>/index-user.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/index1.html">Home Alt<small>/index1.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/Overview.html">Overview<small>/Overview.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/test.html">Test<small>/test.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Academy</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/academy.html">Academy<small>/pages/academy.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/academy_1.html">Academy 1<small>/pages/academy_1.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/academy_2.html">Academy 2<small>/pages/academy_2.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/live.html">Live<small>/pages/live.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/tags.html">Tags<small>/pages/tags.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/search_results.html">Search Results<small>/pages/search_results.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/you_tube_style_video_player_page.html">Video Player<small>/pages/you_tube_style_video_player_page.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Programs</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/funding_program.html">Funding Program<small>/pages/funding_program.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/payout.html">Payout<small>/pages/payout.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/pricing.html">Pricing<small>/pages/pricing.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/leaderboard.html">Leaderboard<small>/pages/leaderboard.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/Challenge%20desktop20260115a.html">Challenge 20260115a<small>/pages/Challenge desktop20260115a.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/Challenge%20desktop20260226a.html">Challenge 20260226a<small>/pages/Challenge desktop20260226a.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/Challenge%20desktop20260513.html">Challenge 20260513<small>/pages/Challenge desktop20260513.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Promotions</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/promotion-activity.html">Promotion Activity<small>/pages/promotion-activity.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/promotion-activity-1.html">Scaling Plan<small>/pages/promotion-activity-1.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/special-offer-50.html">Special Offer 50<small>/pages/special-offer-50.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/new-user-promotion.html">New User Promotion<small>/pages/new-user-promotion.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/leading-v2.html">Leading V2<small>/pages/leading-v2.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">About & Community</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/About%20Us.html">About Us<small>/pages/About Us.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/about-us-2.html">About Us 2<small>/pages/about-us-2.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/company_news.html">Company News<small>/pages/company_news.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/company_news_sub.html">Company News Sub<small>/pages/company_news_sub.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/contact.html">Contact<small>/pages/contact.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/affiliate.html">Affiliate<small>/pages/affiliate.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/partnership.html">Partnership<small>/pages/partnership.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/faq.html">FAQ<small>/pages/faq.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/faq_subpage.html">FAQ Subpage<small>/pages/faq_subpage.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/faq_subpage_blank.html">FAQ Subpage Blank<small>/pages/faq_subpage_blank.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/faq_subdirectory.html">FAQ Subdirectory<small>/pages/faq_subdirectory.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">User & Auth</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/user_login.html">User Login<small>/pages/user_login.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/user_signup.html">User Signup<small>/pages/user_signup.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/user_signup_success.html">User Signup Success<small>/pages/user_signup_success.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/user_signup_seccess.html">User Signup Success (typo)<small>/pages/user_signup_seccess.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/forgot_password.html">Forgot Password<small>/pages/forgot_password.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/reset_password.html">Reset Password<small>/pages/reset_password.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/reset_pwd_success.html">Reset Password Success<small>/pages/reset_pwd_success.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Affiliate Auth</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/affiliate_login.html">Affiliate Login<small>/pages/affiliate_login.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/affiliate_sigup.html">Affiliate Signup<small>/pages/affiliate_sigup.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/affiliate-question.html">Affiliate Question<small>/pages/affiliate-question.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/affiliate-verify-email.html">Affiliate Verify Email<small>/pages/affiliate-verify-email.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Modules</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/modules/payment-methods.html">Payment Methods<small>/pages/modules/payment-methods.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/modules/home-hero-carousel.html">Home Hero Carousel<small>/pages/modules/home-hero-carousel.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/modules/promo-compare.html">Promo Compare<small>/pages/modules/promo-compare.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/modules/challenge-floor.html">Challenge Floor<small>/pages/modules/challenge-floor.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/modules/adl-register.html">ADL Register<small>/pages/modules/adl-register.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Misc</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/pages/404page.html">404 Page<small>/pages/404page.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/template/section-10.html">Template Section 10<small>/pages/template/section-10.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="page-index__section">
|
||||
<h2 class="page-index__section-title">Components</h2>
|
||||
<ul class="page-index__list">
|
||||
<li><a class="page-index__link" href="/components/nav.html">Navigation (raw)<small>/components/nav.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/components/footer.html">Footer (raw)<small>/components/footer.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/components/leading-v2-header.html">Leading V2 Header<small>/components/leading-v2-header.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/components/leading-v2-footer.html">Leading V2 Footer<small>/components/leading-v2-footer.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div id="footer-container"></div>
|
||||
|
||||
<script src="../assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
||||
<script src="../assets/vendor/popper/popper.min.js"></script>
|
||||
<script src="../assets/js/bootstrap/bootstrap.min.js"></script>
|
||||
<script src="../assets/vendor/fontawesome/js/fontawesome-all.min.js" defer></script>
|
||||
<script src="../assets/js/theme.js"></script>
|
||||
<script src="/js/layout.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,255 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>Partnership | AIFO</title>
|
||||
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
||||
<link href="../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-page-bg.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/partnership.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="partnership-page">
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<div class="partnership-page">
|
||||
<section class="partnership-hero">
|
||||
<h1 class="partnership-hero__title">
|
||||
Partnership <span class="text-orange">Program</span>
|
||||
</h1>
|
||||
<p class="partnership-hero__desc">
|
||||
Choose the partnership model that fits your audience. Drive qualified traffic and grow with AIFO.
|
||||
</p>
|
||||
<a href="/pages/affiliate_sigup.html" class="partnership-btn">Become a Partner</a>
|
||||
</section>
|
||||
|
||||
<section class="partnership-section" aria-labelledby="partnership-tiers-title">
|
||||
<h2 class="partnership-section__title" id="partnership-tiers-title">
|
||||
Commission <span class="text-orange">Tiers</span>
|
||||
</h2>
|
||||
<div class="partnership-tiers">
|
||||
<article class="partnership-tier">
|
||||
<p class="partnership-tier__rate">5%</p>
|
||||
<p class="partnership-tier__label">Commission</p>
|
||||
<p class="partnership-tier__meta">30–50 referrals</p>
|
||||
</article>
|
||||
<article class="partnership-tier">
|
||||
<p class="partnership-tier__rate">10%</p>
|
||||
<p class="partnership-tier__label">Commission</p>
|
||||
<p class="partnership-tier__meta">50–100 referrals</p>
|
||||
</article>
|
||||
<article class="partnership-tier partnership-tier--featured">
|
||||
<span class="partnership-tier__badge" aria-hidden="true">
|
||||
<svg width="28" height="32" viewBox="0 0 28 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M14 0L27.32 8v16L14 32 .68 24V8L14 0z" fill="currentColor" opacity="0.25"/>
|
||||
<path d="M14 4l9.24 5.33v10.67L14 25.33 4.76 20V9.33L14 4z" fill="currentColor"/>
|
||||
</svg>
|
||||
</span>
|
||||
<p class="partnership-tier__rate">15%</p>
|
||||
<p class="partnership-tier__label">Commission</p>
|
||||
<p class="partnership-tier__meta">100+ referrals</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="partnership-section" aria-labelledby="partnership-why-title">
|
||||
<h2 class="partnership-section__title" id="partnership-why-title">
|
||||
Why become <span class="text-orange">AIFO partner</span>
|
||||
</h2>
|
||||
<div class="partnership-benefits">
|
||||
<article class="partnership-benefit">
|
||||
<div class="partnership-benefit__visual" aria-hidden="true">
|
||||
<img src="../assets/images/promotion-activity-1/bene-1.svg" alt="" width="120" height="120" loading="lazy">
|
||||
</div>
|
||||
<h3 class="partnership-benefit__title">Unbeatable Commissions</h3>
|
||||
<p class="partnership-benefit__desc">Earn industry-leading revenue share on every qualified sale you refer.</p>
|
||||
</article>
|
||||
<article class="partnership-benefit">
|
||||
<div class="partnership-benefit__visual" aria-hidden="true">
|
||||
<img src="../assets/images/promotion-activity-1/bene-2.svg" alt="" width="120" height="120" loading="lazy">
|
||||
</div>
|
||||
<h3 class="partnership-benefit__title">Super Fast Payouts</h3>
|
||||
<p class="partnership-benefit__desc">Get paid quickly with transparent tracking and reliable settlement cycles.</p>
|
||||
</article>
|
||||
<article class="partnership-benefit">
|
||||
<div class="partnership-benefit__visual" aria-hidden="true">
|
||||
<img src="../assets/images/promotion-activity-1/bene-3.svg" alt="" width="120" height="120" loading="lazy">
|
||||
</div>
|
||||
<h3 class="partnership-benefit__title">Ready-to-Use Assets</h3>
|
||||
<p class="partnership-benefit__desc">Launch faster with banners, links, and promotional materials built for conversion.</p>
|
||||
</article>
|
||||
<article class="partnership-benefit">
|
||||
<div class="partnership-benefit__visual" aria-hidden="true">
|
||||
<img src="../assets/images/promotion-activity-1/bene-4.svg" alt="" width="120" height="120" loading="lazy">
|
||||
</div>
|
||||
<h3 class="partnership-benefit__title">Dedicated Support</h3>
|
||||
<p class="partnership-benefit__desc">Work with affiliate managers who help you optimize traffic and grow sustainably.</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="partnership-section" aria-labelledby="partnership-how-title">
|
||||
<h2 class="partnership-section__title" id="partnership-how-title">
|
||||
How it <span class="text-orange">Works</span>
|
||||
</h2>
|
||||
<div class="partnership-steps">
|
||||
<article class="partnership-step">
|
||||
<div class="partnership-step__icon" aria-hidden="true">
|
||||
<span class="partnership-step__glyph">P</span>
|
||||
</div>
|
||||
<h3 class="partnership-step__title">Apply</h3>
|
||||
<p class="partnership-step__desc">Fill out our partnership application.</p>
|
||||
</article>
|
||||
<span class="partnership-steps__arrow" aria-hidden="true">›</span>
|
||||
<article class="partnership-step">
|
||||
<div class="partnership-step__icon" aria-hidden="true">
|
||||
<span class="icon iconfont icon-nav-faq"></span>
|
||||
</div>
|
||||
<h3 class="partnership-step__title">Review</h3>
|
||||
<p class="partnership-step__desc">Partnership applications are subject to team review.</p>
|
||||
</article>
|
||||
<span class="partnership-steps__arrow" aria-hidden="true">›</span>
|
||||
<article class="partnership-step">
|
||||
<div class="partnership-step__icon" aria-hidden="true">
|
||||
<span class="icon iconfont icon-nav-funding-programs"></span>
|
||||
</div>
|
||||
<h3 class="partnership-step__title">Launch</h3>
|
||||
<p class="partnership-step__desc">Register your AIFO account, get your links, dashboard and start promoting.</p>
|
||||
</article>
|
||||
<span class="partnership-steps__arrow" aria-hidden="true">›</span>
|
||||
<article class="partnership-step">
|
||||
<div class="partnership-step__icon" aria-hidden="true">
|
||||
<span class="icon iconfont icon-nav-payout"></span>
|
||||
</div>
|
||||
<h3 class="partnership-step__title">Track & Get Paid</h3>
|
||||
<p class="partnership-step__desc">Earn commissions based on eligible qualified sales.</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="partnership-section" aria-labelledby="partnership-who-title">
|
||||
<h2 class="partnership-section__title" id="partnership-who-title">
|
||||
<span class="text-orange">Who</span> This Is For
|
||||
</h2>
|
||||
<div class="partnership-audience">
|
||||
<article class="partnership-audience-card partnership-audience-card--fit">
|
||||
<p class="partnership-audience-card__label">Great Fit</p>
|
||||
<div class="partnership-audience-card__visual" aria-hidden="true">
|
||||
<img src="../assets/images/payment-methods/bitcoin.svg" alt="" width="40" height="40">
|
||||
<img src="../assets/images/payment-methods/ethereum.svg" alt="" width="40" height="40">
|
||||
<img src="../assets/images/payment-methods/tether.svg" alt="" width="40" height="40">
|
||||
<img src="../assets/images/payment-methods/usdc.svg" alt="" width="40" height="40">
|
||||
</div>
|
||||
<ul class="partnership-audience-card__list">
|
||||
<li>Real trading audience</li>
|
||||
<li>Qualified traffic sources</li>
|
||||
<li>Consistent trading content</li>
|
||||
<li>Compliant promotion methods</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="partnership-audience-card partnership-audience-card--not-fit">
|
||||
<p class="partnership-audience-card__label">Not a Fit</p>
|
||||
<div class="partnership-audience-card__visual partnership-audience-card__visual--warn" aria-hidden="true">
|
||||
<span class="partnership-audience-card__warn-icon">✕</span>
|
||||
</div>
|
||||
<ul class="partnership-audience-card__list">
|
||||
<li>Fake or low-quality traffic</li>
|
||||
<li>Non-genuine trading audience</li>
|
||||
<li>Misleading promotion methods</li>
|
||||
<li>Self-referrals or coupon abuse</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div id="payment-methods-container"></div>
|
||||
|
||||
<section class="partnership-section partnership-section--faq" aria-labelledby="partnership-faq-title">
|
||||
<h2 class="partnership-section__title partnership-section__title--center" id="partnership-faq-title">
|
||||
Frequently Asked <span class="text-orange">Questions</span>
|
||||
</h2>
|
||||
<div class="partnership-faq">
|
||||
<div class="faq-item">
|
||||
<button class="faq-header" type="button">
|
||||
<span class="faq-question">How do I apply for the partnership program?</span>
|
||||
<span class="faq-icon-box"><span class="faq-icon">+</span></span>
|
||||
</button>
|
||||
<div class="faq-body">
|
||||
<div class="faq-answer">
|
||||
<p>Click Become a Partner, complete the application form, and our team will review your profile within a few business days.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-header" type="button">
|
||||
<span class="faq-question">When do I receive commission payouts?</span>
|
||||
<span class="faq-icon-box"><span class="faq-icon">+</span></span>
|
||||
</button>
|
||||
<div class="faq-body">
|
||||
<div class="faq-answer">
|
||||
<p>Commissions are tracked in your affiliate dashboard and paid on a regular schedule once eligible sales are confirmed.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-header" type="button">
|
||||
<span class="faq-question">What traffic sources are allowed?</span>
|
||||
<span class="faq-icon-box"><span class="faq-icon">+</span></span>
|
||||
</button>
|
||||
<div class="faq-body">
|
||||
<div class="faq-answer">
|
||||
<p>We welcome organic content, communities, review sites, and compliant paid campaigns. Misleading or incentivized low-quality traffic is not permitted.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-header" type="button">
|
||||
<span class="faq-question">Can I promote AIFO with paid ads?</span>
|
||||
<span class="faq-icon-box"><span class="faq-icon">+</span></span>
|
||||
</button>
|
||||
<div class="faq-body">
|
||||
<div class="faq-answer">
|
||||
<p>Yes, when campaigns follow our brand guidelines and do not bid on restricted keywords or misrepresent AIFO offers.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-header" type="button">
|
||||
<span class="faq-question">Is there a minimum payout threshold?</span>
|
||||
<span class="faq-icon-box"><span class="faq-icon">+</span></span>
|
||||
</button>
|
||||
<div class="faq-body">
|
||||
<div class="faq-answer">
|
||||
<p>Minimum payout thresholds may apply depending on your payment method. Details are shown in your affiliate dashboard after approval.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="partnership-cta" aria-labelledby="partnership-cta-title">
|
||||
<h2 class="partnership-cta__title" id="partnership-cta-title">
|
||||
Ready to grow with <span class="text-orange">AIFO</span>?
|
||||
</h2>
|
||||
<p class="partnership-cta__desc">Join the partnership program and start earning from qualified referrals today.</p>
|
||||
<a href="/pages/affiliate_sigup.html" class="partnership-btn">Join Now</a>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div id="footer-container"></div>
|
||||
|
||||
<script src="../assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
||||
<script src="../assets/vendor/popper/popper.min.js"></script>
|
||||
<script src="../assets/js/bootstrap/bootstrap.min.js"></script>
|
||||
<script src="../assets/vendor/fontawesome/js/fontawesome-all.min.js" defer></script>
|
||||
<script src="../assets/js/theme.js"></script>
|
||||
<script src="/js/layout.js"></script>
|
||||
<script src="/js/load-payment-methods.js"></script>
|
||||
<script src="/js/partnership.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>Pricing | AIFO</title>
|
||||
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
||||
<link href="../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/index.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-page-bg.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/challenge.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/promo-compare.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/leading-v2.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/pricing.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="pricing-page">
|
||||
<div id="header-v2-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<div class="pricing-page">
|
||||
<div
|
||||
id="challenge-floor-module"
|
||||
class="challenge-floor-module"
|
||||
data-challenge-floor-module
|
||||
></div>
|
||||
|
||||
<div
|
||||
id="promo-compare-module"
|
||||
class="promo-compare-module"
|
||||
data-promo-compare-module
|
||||
></div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div id="footer-v2-container"></div>
|
||||
|
||||
<script src="../assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
||||
<script src="/js/layout-v2.js"></script>
|
||||
<script src="/js/challenge-floor-module.js"></script>
|
||||
<script src="/js/promo-compare-module.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user