udpate
This commit is contained in:
@@ -0,0 +1,336 @@
|
||||
/* AIFO $1 First Purchase Landing — page-specific */
|
||||
|
||||
#aifo-1-dollar-landing .aifo-page-bg {
|
||||
padding-top: 0;
|
||||
--aifo-page-content-offset: 0;
|
||||
}
|
||||
|
||||
/* Hero banner — flush under nav, full-width stage (same as free-retry) */
|
||||
#aifo-1-dollar-landing .dollar-hero {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__stage {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background: var(--bg-page);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__banner {
|
||||
position: relative;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
background: var(--bg-page);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__banner-media {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__banner-img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/*
|
||||
* Rectangle 488 @1140（旋转 -90° 后）：
|
||||
* 0–281px 文案区纯黑 + 281–975px（694px 宽）左→右渐隐
|
||||
* 此前误用 378px 作渐隐宽度且 left:281 导致左侧露图、281px 处硬边
|
||||
*/
|
||||
#aifo-1-dollar-landing .dollar-hero__banner::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -14px;
|
||||
left: 0;
|
||||
width: 85.53%;
|
||||
max-width: 975px;
|
||||
height: calc(100% + 14px);
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
var(--bg-page) 0%,
|
||||
var(--bg-page) 28.82%,
|
||||
rgba(7, 4, 0, 0) 100%
|
||||
);
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
/* Rectangle 466 — 右缘；Rectangle 467 — 底缘 */
|
||||
#aifo-1-dollar-landing .dollar-hero__banner::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(7, 4, 0, 0) 0%, var(--bg-page) 100%) no-repeat
|
||||
bottom center / min(81.32%, 927px) clamp(60px, 26%, 99px),
|
||||
linear-gradient(90deg, rgba(7, 4, 0, 0) 0%, var(--bg-page) 100%) no-repeat
|
||||
top right / min(31.93%, 364px) 100%;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__content {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 4;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: min(100%, 52%);
|
||||
max-width: 520px;
|
||||
padding: clamp(24px, 4.5vw, 48px) clamp(20px, 3.5vw, 40px);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .dollar-hero__banner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
* 原图左侧 ~35% 为桌面文案留白；移动端通过放大 + 左移裁掉留白，不修改原图。
|
||||
* 可视区域 ≈ 原图 x: 35%–100%，人物更居中。
|
||||
*/
|
||||
#aifo-1-dollar-landing .dollar-hero__banner-media {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: clamp(160px, 42vw, 240px);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__banner-img {
|
||||
width: 154%;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
object-position: 100% center;
|
||||
margin-left: -54%;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__banner::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__banner::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__content {
|
||||
position: relative;
|
||||
inset: auto;
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
justify-content: flex-start;
|
||||
padding: 20px 16px 28px;
|
||||
background: var(--bg-page);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__content .landing-hero__title {
|
||||
font-size: clamp(26px, 7vw, 36px);
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero .landing-v2-page {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero .landing-countdown {
|
||||
margin-top: 28px;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .landing-countdown {
|
||||
gap: 4px;
|
||||
--landing-countdown-digit-w: 36px;
|
||||
--landing-countdown-digit-h: 54px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown [data-countdown-days],
|
||||
#aifo-1-dollar-landing .landing-countdown [data-countdown-hours],
|
||||
#aifo-1-dollar-landing .landing-countdown [data-countdown-mins],
|
||||
#aifo-1-dollar-landing .landing-countdown [data-countdown-secs] {
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown__digit {
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown__sep {
|
||||
font-size: 14px;
|
||||
padding: 0 1px;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__title-line {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__title .landing-accent {
|
||||
font-size: 1.05em;
|
||||
}
|
||||
|
||||
/* Hero bullets — 148×61px 卡片；宽度不够时换行（与 PC 同高） */
|
||||
#aifo-1-dollar-landing .dollar-hero__bullets {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__bullets li {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex: 0 0 148px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0;
|
||||
width: 148px;
|
||||
min-width: 148px;
|
||||
max-width: 148px;
|
||||
min-height: 61px;
|
||||
height: auto;
|
||||
padding: 16px 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 1.25;
|
||||
color: var(--text-main);
|
||||
text-align: center;
|
||||
white-space: normal;
|
||||
border-radius: 9px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
overflow: hidden;
|
||||
background: url("../images/leading-v2/dollar_1_v1/item_bg_1.png") center / 100% 100% no-repeat;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .dollar-hero__bullets li::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .dollar-hero__bullets {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
/* Welcome rewards — promo card 背景图 */
|
||||
#aifo-1-dollar-landing .landing-promo-card {
|
||||
border: none;
|
||||
background: transparent;
|
||||
background-image: url("../images/backgrounds/new-user-offer-bg.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
box-shadow: 0 0 40px rgba(249, 135, 21, 0.1);
|
||||
}
|
||||
|
||||
/* 3 Simple Steps — claim grid (same visuals as free-retry; modules/claim-steps.css) */
|
||||
#aifo-1-dollar-landing .clain-section .claim-item:nth-child(1) {
|
||||
background-image: url("../images/leading-v2/Frame.png");
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .clain-section .claim-item:nth-child(2) {
|
||||
background-image: url("../images/leading-v2/Frame-1.png");
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .clain-section .claim-item:nth-child(3) {
|
||||
background-image: url("../images/leading-v2/Frame-2.png");
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .clain-section .landing-section__title {
|
||||
margin-bottom: 82px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .clain-section .landing-section__cta {
|
||||
margin-top: 48px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .clain-section .claim-item:nth-child(1),
|
||||
#aifo-1-dollar-landing .clain-section .claim-item:nth-child(2),
|
||||
#aifo-1-dollar-landing .clain-section .claim-item:nth-child(3) {
|
||||
background-image: url("../images/backgrounds/new-user-claim-card-bg-mobile.png");
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .clain-section .landing-section__title {
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .clain-section .landing-section__cta {
|
||||
margin-top: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Why section */
|
||||
#aifo-1-dollar-landing .landing-why-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-why-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
padding: 20px 24px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background: rgba(15, 15, 15, 0.55);
|
||||
}
|
||||
|
||||
@media (min-width: 769px) {
|
||||
#aifo-1-dollar-landing .landing-why-item {
|
||||
display: grid;
|
||||
grid-template-columns: 292px 1fr;
|
||||
|
||||
column-gap: 110px;
|
||||
align-items: center;
|
||||
padding: 24px 32px;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-why-item__title {
|
||||
margin: 0;
|
||||
font-size: 25px;
|
||||
font-weight: 700;
|
||||
line-height: 1.25;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-why-item__desc {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
color: rgba(255, 255, 255, 0.55);
|
||||
}
|
||||
|
||||
@media (min-width: 769px) {
|
||||
#aifo-1-dollar-landing .landing-why-item__desc {
|
||||
max-width: 360px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .landing-why-item {
|
||||
padding: 16px 18px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-why-item__title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-why-item__desc {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,374 @@
|
||||
/* AIFO Free Retry Landing — page-specific */
|
||||
|
||||
#aifo-free-retry-landing .aifo-page-bg {
|
||||
padding-top: 0;
|
||||
--aifo-page-content-offset: 0;
|
||||
}
|
||||
|
||||
/* Hero banner — flush under nav, full-width stage */
|
||||
#aifo-free-retry-landing .free-retry-hero {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__stage {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__banner {
|
||||
position: relative;
|
||||
max-width: 1140px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__banner-media {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__banner-img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* Figma Rectangle 467 — bottom fade (927×99, top 265px @ 1140px, vertical) */
|
||||
#aifo-free-retry-landing .free-retry-hero__banner::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
width: 81.32%;
|
||||
max-width: 927px;
|
||||
height: clamp(60px, 26%, 99px);
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
/* Figma Rectangle 466 — right edge fade (364×296, left 905px @ 1140px frame) */
|
||||
#aifo-free-retry-landing .free-retry-hero__banner::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 31.93%;
|
||||
max-width: 364px;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, #000 100%);
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__content {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 3;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: min(100%, 52%);
|
||||
max-width: 520px;
|
||||
padding: clamp(24px, 4.5vw, 48px) clamp(20px, 3.5vw, 40px);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-free-retry-landing .free-retry-hero__banner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
* 原图左侧 ~35% 为桌面文案留白；移动端通过放大 + 左移裁掉留白，不修改原图。
|
||||
* 可视区域 ≈ 原图 x: 35%–100%，人物更居中。
|
||||
*/
|
||||
#aifo-free-retry-landing .free-retry-hero__banner-media {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: clamp(160px, 42vw, 240px);
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__banner-img {
|
||||
width: 154%;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
object-position: 100% center;
|
||||
margin-left: -54%;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__banner::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__banner::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__content {
|
||||
position: relative;
|
||||
inset: auto;
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
justify-content: flex-start;
|
||||
padding: 20px 16px 28px;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__eyebrow,
|
||||
#aifo-free-retry-landing .free-retry-hero__title {
|
||||
font-size: clamp(26px, 7vw, 36px);
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__subtitle {
|
||||
font-size: clamp(18px, 4.5vw, 24px);
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__note {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero .landing-v2-page {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero .landing-countdown {
|
||||
margin-top: 28px;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-countdown__digit {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-free-retry-landing .landing-countdown {
|
||||
gap: 4px;
|
||||
--landing-countdown-digit-w: 36px;
|
||||
--landing-countdown-digit-h: 54px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-countdown [data-countdown-days],
|
||||
#aifo-free-retry-landing .landing-countdown [data-countdown-hours],
|
||||
#aifo-free-retry-landing .landing-countdown [data-countdown-mins],
|
||||
#aifo-free-retry-landing .landing-countdown [data-countdown-secs] {
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-countdown__digit {
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-countdown__sep {
|
||||
font-size: 14px;
|
||||
padding: 0 1px;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__eyebrow {
|
||||
margin: 0 0 4px;
|
||||
font-size: 45px;
|
||||
font-weight: 700;
|
||||
line-height: 1.2;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__title {
|
||||
margin: 0;
|
||||
font-size: 45px;
|
||||
line-height: 1.1;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__subtitle {
|
||||
margin: 10px 0 0;
|
||||
font-size: 30px;
|
||||
font-weight: 600;
|
||||
line-height: 1.35;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__badges {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 64px;
|
||||
padding: 8px 30px;
|
||||
border-radius: 8px;
|
||||
background: var(--aifo-btn-primary);
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__note {
|
||||
margin: 16px 0 0;
|
||||
max-width: 480px;
|
||||
font-size: 16px;
|
||||
line-height: 1.55;
|
||||
color: rgba(255, 255, 255, 0.55);
|
||||
}
|
||||
|
||||
/* How Free Retry Works — page overrides (shared claim layout: modules/claim-steps.css) */
|
||||
#aifo-free-retry-landing .clain-section .claim-item:nth-child(1) {
|
||||
background-image: url("../images/backgrounds/new-user-claim-01.png");
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .claim-item:nth-child(2) {
|
||||
background-image: url("../images/backgrounds/new-user-claim-02.png");
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .claim-item:nth-child(3) {
|
||||
background-image: url("../images/backgrounds/new-user-claim-03.png");
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .landing-section__title {
|
||||
margin-bottom: 82px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .landing-section__tagline {
|
||||
margin-top: 48px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .landing-section__cta {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
/* Mobile: match new-user-promotion — unified card bg + step-mark img (not desktop 01/02/03) */
|
||||
#aifo-free-retry-landing .clain-section .claim-item:nth-child(1),
|
||||
#aifo-free-retry-landing .clain-section .claim-item:nth-child(2),
|
||||
#aifo-free-retry-landing .clain-section .claim-item:nth-child(3) {
|
||||
background-image: url("../images/backgrounds/new-user-claim-card-bg-mobile.png");
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .landing-section__title {
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .landing-section__tagline {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .clain-section .landing-section__cta {
|
||||
margin-top: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
/* One Purchase Two Chances */
|
||||
#aifo-free-retry-landing .landing-chances {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__list {
|
||||
margin: 0 auto 40px;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__list li {
|
||||
font-size: clamp(18px, 2.63vw, 20px);
|
||||
line-height: 1.588;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__flow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: clamp(12px, 5vw, 112px);
|
||||
flex-wrap: nowrap;
|
||||
max-width: 1100px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__node {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
flex: 0 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__icon-img {
|
||||
display: block;
|
||||
width: clamp(88px, 14vw, 120px);
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__label {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 1.35;
|
||||
color: var(--text-main);
|
||||
max-width: 140px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__arrow {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 12px;
|
||||
height: 33px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__arrow img {
|
||||
display: block;
|
||||
width: 12px;
|
||||
height: 33px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-free-retry-landing .landing-chances__flow {
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
max-width: 240px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__arrow {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__list {
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .free-retry-hero__badge {
|
||||
min-width: 56px;
|
||||
padding: 7px 14px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-chances__icon-img {
|
||||
width: clamp(96px, 28vw, 120px);
|
||||
}
|
||||
}
|
||||
+36
-14
@@ -1,29 +1,35 @@
|
||||
/**
|
||||
* 页面顶部光晕背景（通用）
|
||||
* 源自 academy .academy-block-1::before，各页通过 CSS 变量调整高度与图片。
|
||||
* 页面背景（通用）
|
||||
*
|
||||
* 用法：
|
||||
* <main class="aifo-page-bg">
|
||||
* <div class="页面内容容器">...</div>
|
||||
* </main>
|
||||
* <main class="aifo-page-bg aifo-page-bg--top-glow">...</main>
|
||||
*
|
||||
* 注意：aifo-page-bg 应为全宽外层，勿与 max-width 内容容器写在同一元素上。
|
||||
* aifo-page-bg 只负责导航间距与定位；背景光晕三选一（勿混用）：
|
||||
* aifo-page-bg--top-glow 顶部全宽光晕（默认 academy 图）
|
||||
* aifo-page-bg--top-left-glow 左上角光晕
|
||||
* aifo-page-bg--grid 网格底纹（无光晕图）
|
||||
*
|
||||
* 按页覆盖光晕高度：
|
||||
* 按页覆盖 — 顶部全宽：
|
||||
* #my-page { --aifo-page-bg-height: 920px; }
|
||||
*
|
||||
* 按页覆盖背景图：
|
||||
* #my-page { --aifo-page-bg-image: url(../images/...); }
|
||||
*
|
||||
* 按页覆盖 — 左上角：
|
||||
* #my-page { --aifo-page-bg-top-left-top: 97px; }
|
||||
* #my-page { --aifo-page-bg-top-left-image: url(../images/...); }
|
||||
*
|
||||
* 按页增加导航下方内容间距（不含 header 高度）：
|
||||
* #my-page { --aifo-page-content-offset: 1.5rem; }
|
||||
*
|
||||
* 叠加网格底纹（可选）：
|
||||
* <main class="aifo-page-bg aifo-page-bg--grid">...</main>
|
||||
*/
|
||||
:root {
|
||||
/* 与 #academy-main margin-top、固定导航高度保持一致 */
|
||||
--aifo-nav-height: 5.9375rem;
|
||||
|
||||
/* 左上角光晕（默认 top:0，配合 .aifo-page-bg 的 margin-top 对齐导航下方） */
|
||||
--aifo-page-bg-top-left-top: 0;
|
||||
--aifo-page-bg-top-left-left: -2vw;
|
||||
--aifo-page-bg-top-left-size: min(60vw, 555px);
|
||||
--aifo-page-bg-top-left-max-height: min(52vh, 485px);
|
||||
--aifo-page-bg-top-left-image: url("../images/backgrounds/new-user-promo-corner-glow.png");
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
@@ -42,7 +48,8 @@
|
||||
padding-top: var(--aifo-page-content-offset, 0);
|
||||
}
|
||||
|
||||
.aifo-page-bg::before {
|
||||
/* 顶部全宽光晕 */
|
||||
.aifo-page-bg--top-glow::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@@ -56,12 +63,27 @@
|
||||
--aifo-page-bg-image,
|
||||
url("../images/backgrounds/academy/academy_bg_1.webp")
|
||||
);
|
||||
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
/* 左上角光晕 — 源自 special-offer-50；contain 完整显示 PNG，避免 cover 裁切硬边 */
|
||||
.aifo-page-bg--top-left-glow::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: var(--aifo-page-bg-top-left-top);
|
||||
left: var(--aifo-page-bg-top-left-left);
|
||||
width: var(--aifo-page-bg-top-left-size);
|
||||
height: var(--aifo-page-bg-top-left-size);
|
||||
max-height: var(--aifo-page-bg-top-left-max-height);
|
||||
pointer-events: none;
|
||||
z-index: 3;
|
||||
background: var(--aifo-page-bg-top-left-image) no-repeat left top;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
/* 网格底纹（无光晕图） */
|
||||
.aifo-page-bg--grid {
|
||||
background-image: image-set(
|
||||
url("../images/backgrounds/academy/bg_grid.webp") type("image/webp"),
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
#promotion-activity-1 {
|
||||
#aifo-scaling-plan {
|
||||
--primary: #f98715;
|
||||
--primary-hover: #f9a215;
|
||||
--bg-page: #070400;
|
||||
@@ -15,7 +15,7 @@
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .promo-page {
|
||||
#aifo-scaling-plan .promo-page {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 1140px;
|
||||
@@ -26,7 +26,7 @@
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero {
|
||||
#aifo-scaling-plan .scaling-hero {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
@@ -34,19 +34,19 @@
|
||||
padding: 109px 0 40px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__content {
|
||||
#aifo-scaling-plan .scaling-hero__content {
|
||||
flex: 1;
|
||||
max-width: 561px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__intro {
|
||||
#aifo-scaling-plan .scaling-hero__intro {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__title {
|
||||
#aifo-scaling-plan .scaling-hero__title {
|
||||
margin: 0;
|
||||
font-size: clamp(36px, 5vw, 56px);
|
||||
line-height: 1.25;
|
||||
@@ -54,7 +54,7 @@
|
||||
letter-spacing: -0.56px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__desc {
|
||||
#aifo-scaling-plan .scaling-hero__desc {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
line-height: 1.2;
|
||||
@@ -63,13 +63,13 @@
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__actions {
|
||||
#aifo-scaling-plan .scaling-hero__actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .btn-promo {
|
||||
#aifo-scaling-plan .btn-promo {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -88,25 +88,25 @@
|
||||
transition: background 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .btn-promo:hover {
|
||||
#aifo-scaling-plan .btn-promo: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;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .btn-promo--outline {
|
||||
#aifo-scaling-plan .btn-promo--outline {
|
||||
background: rgba(15, 15, 15, 0.5);
|
||||
border: 0.657px solid #666;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .btn-promo--outline:hover {
|
||||
#aifo-scaling-plan .btn-promo--outline:hover {
|
||||
background: rgba(15, 15, 15, 0.8);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-requirements__title {
|
||||
#aifo-scaling-plan .scaling-requirements__title {
|
||||
margin: 0 0 16px;
|
||||
font-size: 20px;
|
||||
line-height: 1.2;
|
||||
@@ -116,7 +116,7 @@
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-requirements__list {
|
||||
#aifo-scaling-plan .scaling-requirements__list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
@@ -125,7 +125,7 @@
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-requirements__item {
|
||||
#aifo-scaling-plan .scaling-requirements__item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
@@ -134,7 +134,7 @@
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-requirements__check {
|
||||
#aifo-scaling-plan .scaling-requirements__check {
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
@@ -146,13 +146,13 @@
|
||||
color: var(--bg-page);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-requirements__check svg {
|
||||
#aifo-scaling-plan .scaling-requirements__check svg {
|
||||
display: block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__visual {
|
||||
#aifo-scaling-plan .scaling-hero__visual {
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
width: min(100%, 510px);
|
||||
@@ -162,14 +162,14 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__visual img {
|
||||
#aifo-scaling-plan .scaling-hero__visual img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__badge {
|
||||
#aifo-scaling-plan .scaling-hero__badge {
|
||||
position: absolute;
|
||||
left: 9px;
|
||||
right: 9px;
|
||||
@@ -184,7 +184,7 @@
|
||||
backdrop-filter: blur(2px);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__badge-icon {
|
||||
#aifo-scaling-plan .scaling-hero__badge-icon {
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
@@ -196,12 +196,12 @@
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__badge-icon img {
|
||||
#aifo-scaling-plan .scaling-hero__badge-icon img {
|
||||
display: block;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__badge-label {
|
||||
#aifo-scaling-plan .scaling-hero__badge-label {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
line-height: 1.17;
|
||||
@@ -209,7 +209,7 @@
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__badge-value {
|
||||
#aifo-scaling-plan .scaling-hero__badge-value {
|
||||
margin: 5px 0 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.25;
|
||||
@@ -217,17 +217,17 @@
|
||||
color: var(--bg-page);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefits {
|
||||
#aifo-scaling-plan .scaling-benefits {
|
||||
padding: 40px 0 72px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefits__head {
|
||||
#aifo-scaling-plan .scaling-benefits__head {
|
||||
margin-bottom: 32px;
|
||||
padding-bottom: 16px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.16);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefits__title {
|
||||
#aifo-scaling-plan .scaling-benefits__title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
line-height: 1.2;
|
||||
@@ -235,40 +235,40 @@
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefits__grid {
|
||||
#aifo-scaling-plan .scaling-benefits__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 48px 32px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefit-card {
|
||||
#aifo-scaling-plan .scaling-benefit-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefit-card__icon {
|
||||
#aifo-scaling-plan .scaling-benefit-card__icon {
|
||||
display: inline-flex;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefit-card__icon img {
|
||||
#aifo-scaling-plan .scaling-benefit-card__icon img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefit-card__title {
|
||||
#aifo-scaling-plan .scaling-benefit-card__title {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.25;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefit-card__desc {
|
||||
#aifo-scaling-plan .scaling-benefit-card__desc {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
line-height: 1.29;
|
||||
@@ -278,7 +278,7 @@
|
||||
}
|
||||
|
||||
/* Growth Path modal */
|
||||
#promotion-activity-1 .growth-modal {
|
||||
#aifo-scaling-plan .growth-modal {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 1050;
|
||||
@@ -289,11 +289,11 @@
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal.is-open {
|
||||
#aifo-scaling-plan .growth-modal.is-open {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__panel {
|
||||
#aifo-scaling-plan .growth-modal__panel {
|
||||
width: 100%;
|
||||
max-width: 680px;
|
||||
max-height: 90vh;
|
||||
@@ -304,7 +304,7 @@
|
||||
background: #231f20;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__header {
|
||||
#aifo-scaling-plan .growth-modal__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@@ -312,14 +312,14 @@
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__header-title {
|
||||
#aifo-scaling-plan .growth-modal__header-title {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.25;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__close {
|
||||
#aifo-scaling-plan .growth-modal__close {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -333,22 +333,22 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__close:hover {
|
||||
#aifo-scaling-plan .growth-modal__close:hover {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__divider {
|
||||
#aifo-scaling-plan .growth-modal__divider {
|
||||
height: 1px;
|
||||
background: rgba(255, 255, 255, 0.16);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__body {
|
||||
#aifo-scaling-plan .growth-modal__body {
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
padding: 20px 16px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__intro {
|
||||
#aifo-scaling-plan .growth-modal__intro {
|
||||
margin: 0 0 24px;
|
||||
font-size: 14px;
|
||||
line-height: 1.29;
|
||||
@@ -357,19 +357,19 @@
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-table-wrap {
|
||||
#aifo-scaling-plan .growth-table-wrap {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-table {
|
||||
#aifo-scaling-plan .growth-table {
|
||||
width: 100%;
|
||||
min-width: 600px;
|
||||
border-collapse: collapse;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-table th,
|
||||
#promotion-activity-1 .growth-table td {
|
||||
#aifo-scaling-plan .growth-table th,
|
||||
#aifo-scaling-plan .growth-table td {
|
||||
padding: 16px 16px 16px 0;
|
||||
font-size: 12px;
|
||||
line-height: 1.17;
|
||||
@@ -378,17 +378,17 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-table th {
|
||||
#aifo-scaling-plan .growth-table th {
|
||||
color: #666;
|
||||
padding-top: 0;
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-table tbody tr {
|
||||
#aifo-scaling-plan .growth-table tbody tr {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.16);
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__footer {
|
||||
#aifo-scaling-plan .growth-modal__footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 16px;
|
||||
@@ -396,70 +396,70 @@
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
#promotion-activity-1 .scaling-hero {
|
||||
#aifo-scaling-plan .scaling-hero {
|
||||
flex-direction: column;
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__content {
|
||||
#aifo-scaling-plan .scaling-hero__content {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__visual {
|
||||
#aifo-scaling-plan .scaling-hero__visual {
|
||||
width: 100%;
|
||||
max-width: 510px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefits__grid {
|
||||
#aifo-scaling-plan .scaling-benefits__grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 32px 24px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#promotion-activity-1 {
|
||||
#aifo-scaling-plan {
|
||||
--aifo-page-content-offset: 1rem;
|
||||
--aifo-page-bg-height: 445px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .promo-page {
|
||||
#aifo-scaling-plan .promo-page {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
padding-bottom: 56px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__title {
|
||||
#aifo-scaling-plan .scaling-hero__title {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__desc {
|
||||
#aifo-scaling-plan .scaling-hero__desc {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-hero__actions {
|
||||
#aifo-scaling-plan .scaling-hero__actions {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .btn-promo {
|
||||
#aifo-scaling-plan .btn-promo {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefits__grid {
|
||||
#aifo-scaling-plan .scaling-benefits__grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 28px;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .scaling-benefit-card__desc-br {
|
||||
#aifo-scaling-plan .scaling-benefit-card__desc-br {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__footer {
|
||||
#aifo-scaling-plan .growth-modal__footer {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
#promotion-activity-1 .growth-modal__footer .btn-promo {
|
||||
#aifo-scaling-plan .growth-modal__footer .btn-promo {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@@ -456,8 +456,20 @@
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.aifo-foot__companies {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: stretch;
|
||||
gap: 0;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.aifo-foot__company {
|
||||
margin: 0;
|
||||
flex: 1 1 240px;
|
||||
max-width: 50%;
|
||||
padding-right: 40px;
|
||||
box-sizing: border-box;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
line-height: 14px;
|
||||
@@ -465,10 +477,31 @@
|
||||
color: var(--foot-muted-60);
|
||||
}
|
||||
|
||||
.aifo-foot__company:last-child {
|
||||
padding-right: 0;
|
||||
padding-left: 40px;
|
||||
border-left: 1px solid var(--foot-border);
|
||||
}
|
||||
|
||||
.aifo-foot__company p {
|
||||
margin: 0 0 4px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.aifo-foot__company {
|
||||
max-width: 100%;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.aifo-foot__company:last-child {
|
||||
padding-left: 0;
|
||||
border-left: none;
|
||||
margin-top: 16px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid var(--foot-border);
|
||||
}
|
||||
}
|
||||
|
||||
/* Payment chips */
|
||||
.aifo-foot__payments {
|
||||
display: flex;
|
||||
|
||||
@@ -0,0 +1,492 @@
|
||||
/**
|
||||
* Shared landing page styles (Leading V2 layout: header-v2 + aifo-page-bg + footer-v2).
|
||||
* Used by aifo-1-dollar-landing and aifo-free-retry-landing.
|
||||
*/
|
||||
#aifo-1-dollar-landing,
|
||||
#aifo-free-retry-landing {
|
||||
--primary: #f98715;
|
||||
--primary-hover: #f9a215;
|
||||
--bg-page: #070400;
|
||||
--text-main: #f9f9f9;
|
||||
--text-muted: #909090;
|
||||
--text-secondary: #ccc;
|
||||
--line: rgba(255, 255, 255, 0.12);
|
||||
--aifo-page-bg-height: 805px;
|
||||
--aifo-page-content-offset: 1.375rem;
|
||||
--lv2-header-height: 5.75rem;
|
||||
--landing-container: 1140px;
|
||||
background: var(--bg-page);
|
||||
color: var(--text-main);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing,
|
||||
#aifo-free-retry-landing {
|
||||
--aifo-nav-height: var(--lv2-header-height);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing,
|
||||
#aifo-free-retry-landing {
|
||||
--aifo-page-bg-height: 445px;
|
||||
--aifo-page-content-offset: 1rem;
|
||||
--lv2-header-height: 72px;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-v2-page,
|
||||
#aifo-free-retry-landing .landing-v2-page {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: var(--landing-container);
|
||||
margin: 0 auto;
|
||||
padding: 0 18px 48px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-accent,
|
||||
#aifo-free-retry-landing .landing-accent {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/* ── Hero (legacy side-by-side — free-retry uses full-width banner instead) ── */
|
||||
#aifo-free-retry-landing .landing-hero {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 40px;
|
||||
padding: 48px 0 32px;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
#aifo-free-retry-landing .landing-hero {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__content,
|
||||
#aifo-free-retry-landing .landing-hero__content {
|
||||
flex: 1;
|
||||
max-width: 560px;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
#aifo-free-retry-landing .landing-hero__content {
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__eyebrow,
|
||||
#aifo-free-retry-landing .landing-hero__eyebrow {
|
||||
margin: 0 0 8px;
|
||||
font-size: clamp(28px, 4vw, 40px);
|
||||
line-height: 1.2;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__title,
|
||||
#aifo-free-retry-landing .landing-hero__title {
|
||||
margin: 0;
|
||||
font-size: clamp(36px, 5vw, 56px);
|
||||
line-height: 1.15;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__subtitle,
|
||||
#aifo-free-retry-landing .landing-hero__subtitle {
|
||||
margin: 12px 0 0;
|
||||
font-size: clamp(18px, 2.5vw, 24px);
|
||||
line-height: 1.35;
|
||||
font-weight: 600;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__bullets,
|
||||
#aifo-free-retry-landing .landing-hero__bullets {
|
||||
margin: 24px 0 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-hero__bullets {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__bullets li,
|
||||
#aifo-free-retry-landing .landing-hero__bullets li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 15px;
|
||||
line-height: 1.4;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
#aifo-free-retry-landing .landing-hero__bullets li {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__bullets li::before,
|
||||
#aifo-free-retry-landing .landing-hero__bullets li::before {
|
||||
content: "";
|
||||
flex-shrink: 0;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 50%;
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__actions,
|
||||
#aifo-free-retry-landing .landing-hero__actions {
|
||||
margin-top: 28px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__note,
|
||||
#aifo-free-retry-landing .landing-hero__note {
|
||||
margin: 16px 0 0;
|
||||
max-width: 520px;
|
||||
font-size: 12px;
|
||||
line-height: 1.6;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
#aifo-1-dollar-landing .landing-hero__note,
|
||||
#aifo-free-retry-landing .landing-hero__note {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-hero__visual {
|
||||
flex-shrink: 0;
|
||||
width: min(100%, 480px);
|
||||
aspect-ratio: 4 / 5;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
background: #1a1a1a;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-hero__visual img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
/* ── Countdown ── */
|
||||
#aifo-1-dollar-landing .landing-countdown,
|
||||
#aifo-free-retry-landing .landing-countdown {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
margin: 8px auto 40px;
|
||||
padding: 0;
|
||||
--landing-countdown-digit-w: 57px;
|
||||
--landing-countdown-digit-h: 86px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing [data-countdown-days],
|
||||
#aifo-1-dollar-landing [data-countdown-hours],
|
||||
#aifo-1-dollar-landing [data-countdown-mins],
|
||||
#aifo-1-dollar-landing [data-countdown-secs],
|
||||
#aifo-free-retry-landing [data-countdown-days],
|
||||
#aifo-free-retry-landing [data-countdown-hours],
|
||||
#aifo-free-retry-landing [data-countdown-mins],
|
||||
#aifo-free-retry-landing [data-countdown-secs] {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown__digit,
|
||||
#aifo-free-retry-landing .landing-countdown__digit {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: var(--landing-countdown-digit-w);
|
||||
min-width: var(--landing-countdown-digit-w);
|
||||
height: var(--landing-countdown-digit-h);
|
||||
padding: 0;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
background: url("../images/leading-v2/time_bg.png") center / 100% 100% no-repeat;
|
||||
font-size: 40px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
font-variant-numeric: tabular-nums;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown__sep,
|
||||
#aifo-free-retry-landing .landing-countdown__sep {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
padding: 0 2px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .landing-countdown,
|
||||
#aifo-free-retry-landing .landing-countdown {
|
||||
--landing-countdown-digit-w: 46px;
|
||||
--landing-countdown-digit-h: 69px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown__digit,
|
||||
#aifo-free-retry-landing .landing-countdown__digit {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown__sep,
|
||||
#aifo-free-retry-landing .landing-countdown__sep {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Registration embed ── */
|
||||
#aifo-1-dollar-landing .landing-v2-register,
|
||||
#aifo-free-retry-landing .landing-v2-register {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
margin: 0 auto 96px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-v2-register .adl-register-top,
|
||||
#aifo-free-retry-landing .landing-v2-register .adl-register-top {
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-v2-register .adl-register .container,
|
||||
#aifo-free-retry-landing .landing-v2-register .adl-register .container {
|
||||
padding: 0;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
/* ── Section titles (Figma: 60px / lh 78.4 / ls -2.1 / weight 800) ── */
|
||||
#aifo-1-dollar-landing .landing-section,
|
||||
#aifo-free-retry-landing .landing-section {
|
||||
margin-bottom: 96px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__title,
|
||||
#aifo-free-retry-landing .landing-section__title {
|
||||
margin: 0 0 32px;
|
||||
font-size: clamp(32px, 5.26vw, 60px);
|
||||
line-height: 1.307;
|
||||
font-weight: 800;
|
||||
text-align: center;
|
||||
letter-spacing: -0.035em;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__desc,
|
||||
#aifo-free-retry-landing .landing-section__desc {
|
||||
margin: -8px auto 32px;
|
||||
max-width: 545px;
|
||||
text-align: center;
|
||||
font-size: clamp(18px, 2.63vw, 30px);
|
||||
line-height: 1.588;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* ── Steps grid ── */
|
||||
#aifo-1-dollar-landing .landing-steps,
|
||||
#aifo-free-retry-landing .landing-steps {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 32px;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .landing-steps,
|
||||
#aifo-free-retry-landing .landing-steps {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 28px;
|
||||
max-width: 360px;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-step-card,
|
||||
#aifo-free-retry-landing .landing-step-card {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
min-height: 160px;
|
||||
padding: 24px 20px;
|
||||
border-radius: 16px;
|
||||
border: 1px solid rgba(249, 135, 21, 0.28);
|
||||
background: rgba(15, 15, 15, 0.6);
|
||||
box-shadow:
|
||||
inset 0 2px 0 rgba(249, 135, 21, 0.45),
|
||||
inset 2px 0 0 rgba(249, 135, 21, 0.3);
|
||||
}
|
||||
|
||||
@media (min-width: 769px) {
|
||||
#aifo-1-dollar-landing .landing-step-card:not(:last-child)::after,
|
||||
#aifo-free-retry-landing .landing-step-card:not(:last-child)::after {
|
||||
content: "›";
|
||||
position: absolute;
|
||||
right: -22px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
color: var(--primary);
|
||||
pointer-events: none;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .landing-step-card:not(:last-child)::after,
|
||||
#aifo-free-retry-landing .landing-step-card:not(:last-child)::after {
|
||||
content: "›";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -22px;
|
||||
transform: translateX(-50%) rotate(90deg);
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
color: var(--primary);
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-step-card__num,
|
||||
#aifo-free-retry-landing .landing-step-card__num {
|
||||
font-size: 32px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-step-card__title,
|
||||
#aifo-free-retry-landing .landing-step-card__title {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-step-card__desc,
|
||||
#aifo-free-retry-landing .landing-step-card__desc {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
line-height: 1.45;
|
||||
color: #bc9467;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__cta,
|
||||
#aifo-free-retry-landing .landing-section__cta {
|
||||
margin-top: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__tagline,
|
||||
#aifo-free-retry-landing .landing-section__tagline {
|
||||
margin: 0 0 24px;
|
||||
max-width: 545px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
text-align: center;
|
||||
font-size: clamp(18px, 2.63vw, 30px);
|
||||
line-height: 1.588;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* ── Responsive (both landing pages) ── */
|
||||
@media (max-width: 992px) {
|
||||
#aifo-1-dollar-landing .landing-hero__actions .aifo-btn,
|
||||
#aifo-free-retry-landing .landing-hero__actions .aifo-btn {
|
||||
width: 100%;
|
||||
max-width: 320px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__cta .aifo-btn,
|
||||
#aifo-free-retry-landing .landing-section__cta .aifo-btn {
|
||||
width: 100%;
|
||||
max-width: 320px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#aifo-1-dollar-landing .landing-v2-page,
|
||||
#aifo-free-retry-landing .landing-v2-page {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-hero {
|
||||
padding-top: 24px;
|
||||
padding-bottom: 24px;
|
||||
gap: 28px;
|
||||
}
|
||||
|
||||
#aifo-free-retry-landing .landing-hero__visual {
|
||||
width: 100%;
|
||||
max-width: min(360px, 88vw);
|
||||
aspect-ratio: 4 / 5;
|
||||
order: -1;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__content,
|
||||
#aifo-free-retry-landing .landing-hero__content {
|
||||
order: 0;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-countdown,
|
||||
#aifo-free-retry-landing .landing-countdown {
|
||||
margin-bottom: 28px;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-v2-register,
|
||||
#aifo-free-retry-landing .landing-v2-register {
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section,
|
||||
#aifo-free-retry-landing .landing-section {
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__title,
|
||||
#aifo-free-retry-landing .landing-section__title {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-section__tagline,
|
||||
#aifo-free-retry-landing .landing-section__tagline {
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
#aifo-1-dollar-landing .landing-hero__title,
|
||||
#aifo-free-retry-landing .landing-hero__title {
|
||||
font-size: clamp(28px, 8vw, 36px);
|
||||
}
|
||||
|
||||
#aifo-1-dollar-landing .landing-hero__eyebrow,
|
||||
#aifo-free-retry-landing .landing-hero__eyebrow {
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,144 @@
|
||||
/**
|
||||
* How to claim — steps grid (shared by new-user-promotion & landing pages).
|
||||
* Wrap section with class .clain-section
|
||||
*/
|
||||
.clain-section .claim-grid {
|
||||
margin: 20px auto 0;
|
||||
max-width: 800px;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 80px;
|
||||
}
|
||||
|
||||
.clain-section .claim-item {
|
||||
position: relative;
|
||||
border-radius: 12px;
|
||||
|
||||
min-height: 190px;
|
||||
padding: 18px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
/* background-position: center; */
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.clain-section .claim-item:nth-child(1) {
|
||||
background-image: url("../../images/leading-v2/Frame.png");
|
||||
}
|
||||
|
||||
.clain-section .claim-item:nth-child(2) {
|
||||
background-image: url("../../images/leading-v2/Frame-1.png");
|
||||
}
|
||||
|
||||
.clain-section .claim-item:nth-child(3) {
|
||||
background-image: url("../../images/leading-v2/Frame-2.png");
|
||||
}
|
||||
|
||||
.clain-section .claim-item:not(:last-child)::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: -50px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 20px;
|
||||
height: 50px;
|
||||
background: url("../../images/backgrounds/new-user-claim-arrow.png") no-repeat center / contain;
|
||||
}
|
||||
|
||||
.clain-section .claim-text {
|
||||
margin: 0;
|
||||
padding-top: 90px;
|
||||
font-size: 16px;
|
||||
line-height: 1.45;
|
||||
color: #bc9467;
|
||||
}
|
||||
|
||||
.clain-section .claim-text strong {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
font-weight: 700;
|
||||
color: #d4a574;
|
||||
}
|
||||
|
||||
/* Desktop: step number is in card background; mobile uses claim-step-mark img */
|
||||
.clain-section .claim-step-mark {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.clain-section .claim-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.clain-section .claim-item:not(:last-child)::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.clain-section {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
.clain-section .claim-grid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 28px;
|
||||
max-width: min(360px, 92vw);
|
||||
margin: 8px auto 0;
|
||||
}
|
||||
|
||||
.clain-section .claim-item:nth-child(1),
|
||||
.clain-section .claim-item:nth-child(2),
|
||||
.clain-section .claim-item:nth-child(3) {
|
||||
background-image: url("../../images/backgrounds/new-user-claim-card-bg-mobile.png");
|
||||
}
|
||||
|
||||
.clain-section .claim-item {
|
||||
width: 100%;
|
||||
min-height: 152px;
|
||||
padding: 20px 18px 22px 22px;
|
||||
border-radius: 16px;
|
||||
border: 1px solid rgba(180, 110, 45, 0.28);
|
||||
box-shadow:
|
||||
inset 0 2px 0 rgba(249, 135, 21, 0.55),
|
||||
inset 2px 0 0 rgba(249, 135, 21, 0.42),
|
||||
0 10px 28px rgba(0, 0, 0, 0.35);
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.clain-section .claim-step-mark {
|
||||
display: block;
|
||||
width: clamp(76px, 22vw, 112px);
|
||||
height: auto;
|
||||
margin: 0 0 10px;
|
||||
align-self: flex-start;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.clain-section .claim-text {
|
||||
padding-top: 0;
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
color: #d4a574;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.clain-section .claim-item:not(:last-child)::after {
|
||||
display: block;
|
||||
left: 50%;
|
||||
right: auto;
|
||||
top: auto;
|
||||
bottom: -28px;
|
||||
transform: translateX(-50%);
|
||||
width: 28px;
|
||||
height: 22px;
|
||||
background: url("../../images/backgrounds/new-user-claim-arrow-down.png") no-repeat center / contain;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,171 @@
|
||||
/* Welcome rewards — reusable landing floor module */
|
||||
|
||||
.landing-welcome {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.landing-welcome__glow {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: calc((100% - 100vw) / 2);
|
||||
transform: translateY(-50%);
|
||||
width: min(82vw, 720px);
|
||||
height: 100vh;
|
||||
max-height: 100svh;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
background: radial-gradient(ellipse at right center, rgba(249, 135, 21, 0.18), transparent 70%);
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
.landing-welcome__inner {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 844px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.landing-promo-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
margin: 0 auto 20px;
|
||||
padding: 28px 32px;
|
||||
text-align: left;
|
||||
border-radius: 14px;
|
||||
border: 1px solid rgba(249, 135, 21, 0.35);
|
||||
background: linear-gradient(135deg, rgba(249, 135, 21, 0.28), rgba(60, 30, 0, 0.55));
|
||||
box-shadow: 0 0 40px rgba(249, 135, 21, 0.1);
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.landing-promo-card {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
.landing-promo-card__eyebrow {
|
||||
margin: 0 0 6px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.landing-promo-card__value {
|
||||
margin: 0 0 4px;
|
||||
font-size: clamp(32px, 5vw, 48px);
|
||||
font-weight: 900;
|
||||
line-height: 1;
|
||||
color: var(--primary, #f98715);
|
||||
}
|
||||
|
||||
.landing-promo-card__sub {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
letter-spacing: 0.08em;
|
||||
color: #fefefe;
|
||||
}
|
||||
|
||||
.landing-promo-card__right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 10px;
|
||||
min-width: 160px;
|
||||
}
|
||||
|
||||
.landing-promo-card__code-label {
|
||||
margin: 0 0 4px;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.landing-promo-card__code {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
padding: 12px 24px;
|
||||
border-radius: 8px;
|
||||
border: 1px dashed rgba(255, 255, 255, 0.45);
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.05em;
|
||||
color: inherit;
|
||||
font-family: inherit;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.2s ease, background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.landing-promo-card__code:hover {
|
||||
border-color: rgba(249, 135, 21, 0.65);
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
.landing-promo-card__code:focus-visible {
|
||||
outline: 2px solid var(--primary, #f98715);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.landing-promo-card__code.is-copied {
|
||||
border-color: rgba(249, 135, 21, 0.85);
|
||||
}
|
||||
|
||||
.landing-welcome-copy-toast {
|
||||
position: fixed;
|
||||
top: calc(var(--aifo-nav-height, 5.75rem) + 12px);
|
||||
right: 16px;
|
||||
z-index: 2000;
|
||||
max-width: min(320px, calc(100vw - 32px));
|
||||
padding: 12px 16px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(249, 135, 21, 0.45);
|
||||
background: rgba(20, 12, 0, 0.92);
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
color: #fff;
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
transform: translateY(-8px);
|
||||
transition: opacity 0.2s ease, transform 0.2s ease;
|
||||
}
|
||||
|
||||
.landing-welcome-copy-toast.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.landing-welcome .landing-note {
|
||||
margin: 24px auto 0;
|
||||
max-width: 813px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
line-height: 1.7;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.landing-promo-card {
|
||||
padding: 20px 18px;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.landing-promo-card__offer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.landing-promo-card__right {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.landing-promo-card__right .aifo-btn {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,162 @@
|
||||
/**
|
||||
* 24 Hours Payout — reusable floor module.
|
||||
* Used by pages/modules/payout-24h.section.html
|
||||
*/
|
||||
.payout-24h {
|
||||
--payout-24h-primary: #f98715;
|
||||
--payout-24h-amount: #f28c28;
|
||||
--payout-24h-paid: #22c55e;
|
||||
--payout-24h-card-bg: rgba(18, 18, 18, 0.85);
|
||||
--payout-24h-card-border: rgba(255, 255, 255, 0.08);
|
||||
margin-bottom: 96px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.payout-24h__title {
|
||||
margin: 0 0 12px;
|
||||
font-size: clamp(32px, 5.26vw, 60px);
|
||||
line-height: 1.307;
|
||||
font-weight: 800;
|
||||
text-align: center;
|
||||
letter-spacing: -0.035em;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
|
||||
.payout-24h__accent {
|
||||
color: var(--payout-24h-primary);
|
||||
}
|
||||
|
||||
.payout-24h__subtitle {
|
||||
margin: 0 auto 36px;
|
||||
|
||||
font-size: clamp(18px, 2.63vw, 30px);
|
||||
line-height: 1.588;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.payout-24h__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.payout-24h__grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
max-width: 640px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 560px) {
|
||||
.payout-24h__grid {
|
||||
grid-template-columns: 1fr;
|
||||
max-width: 360px;
|
||||
}
|
||||
}
|
||||
|
||||
.payout-24h__card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14px;
|
||||
padding: 16px 18px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid var(--payout-24h-card-border);
|
||||
background: var(--payout-24h-card-bg);
|
||||
transition: border-color 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
.payout-24h__card:hover {
|
||||
border-color: rgba(249, 135, 21, 0.25);
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
.payout-24h__card-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.payout-24h__amount {
|
||||
font-size: clamp(18px, 2.5vw, 22px);
|
||||
font-weight: 700;
|
||||
line-height: 1.2;
|
||||
letter-spacing: -0.02em;
|
||||
color: var(--payout-24h-amount);
|
||||
}
|
||||
|
||||
.payout-24h__badge {
|
||||
flex-shrink: 0;
|
||||
padding: 4px 10px;
|
||||
border-radius: 999px;
|
||||
background: rgba(34, 197, 94, 0.15);
|
||||
border: 1px solid rgba(34, 197, 94, 0.45);
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.06em;
|
||||
color: var(--payout-24h-paid);
|
||||
}
|
||||
|
||||
.payout-24h__card-bottom {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.payout-24h__avatar {
|
||||
flex-shrink: 0;
|
||||
align-self: flex-end;
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-bottom: 2px;
|
||||
border-radius: 0;
|
||||
object-fit: cover;
|
||||
border: none;
|
||||
background: #1a1a1a;
|
||||
}
|
||||
|
||||
.payout-24h__col {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.payout-24h__label {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 1.63;
|
||||
letter-spacing: 0;
|
||||
text-transform: uppercase;
|
||||
color: rgba(255, 255, 255, 0.55);
|
||||
}
|
||||
|
||||
.payout-24h__value {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 1.35;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.payout-24h {
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
.payout-24h__subtitle {
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
}
|
||||
+71
-16
@@ -19,6 +19,27 @@
|
||||
);
|
||||
--aifo-nav-icon-box-border: rgba(255, 255, 255, 0.16);
|
||||
--aifo-nav-icon-box-border-hover: #353132;
|
||||
/* Desktop: gap from logo to first menu item; tune per locale via body.lang-* */
|
||||
--aifo-nav-menu-offset: 1.5rem;
|
||||
--aifo-nav-menu-item-gap: 0.25rem;
|
||||
--aifo-nav-menu-link-padding-x: 1rem;
|
||||
}
|
||||
|
||||
/* Desktop: lock nav bar to layout offset used by .main / hero (6.100625rem) */
|
||||
@media (min-width: 768px) {
|
||||
#nav.aifo-nav {
|
||||
height: 6.100625rem;
|
||||
min-height: 6.100625rem;
|
||||
box-sizing: border-box;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#nav.aifo-nav > .container {
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
/* Desktop: logo | centered menu | right actions */
|
||||
@@ -32,9 +53,10 @@
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__menu {
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
gap: 0.25rem;
|
||||
flex: 0 1 auto;
|
||||
justify-content: flex-start;
|
||||
margin-left: var(--aifo-nav-menu-offset);
|
||||
gap: var(--aifo-nav-menu-item-gap);
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__actions {
|
||||
@@ -46,12 +68,23 @@
|
||||
|
||||
#nav.aifo-nav .aifo-nav__menu .nav-link {
|
||||
color: var(--aifo-nav-text);
|
||||
font-size: 1.2rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
padding: 0.5rem 1rem;
|
||||
padding: 0.5rem var(--aifo-nav-menu-link-padding-x);
|
||||
gap: 0.35rem;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
/* Example: tighter menu when labels are longer */
|
||||
/* body.lang-fr #nav.aifo-nav,
|
||||
body.lang-pt #nav.aifo-nav,
|
||||
body.lang-es #nav.aifo-nav {
|
||||
--aifo-nav-menu-offset: 1.25rem;
|
||||
--aifo-nav-menu-link-padding-x: 0.75rem;
|
||||
--aifo-nav-menu-item-gap: 0.125rem;
|
||||
} */
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__menu .nav-link .icon-a-arrow-down {
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.85;
|
||||
@@ -117,6 +150,7 @@
|
||||
margin: 0 !important;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__dropdown .dropdown-item + .dropdown-item {
|
||||
@@ -132,7 +166,7 @@
|
||||
padding: 8px;
|
||||
color: #fff;
|
||||
font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
font-size: 18px;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
line-height: 20px;
|
||||
letter-spacing: -0.16px;
|
||||
@@ -264,7 +298,7 @@
|
||||
gap: 6px;
|
||||
padding: 5px 9px;
|
||||
border-radius: 6px;
|
||||
font-size: 1.2rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 300;
|
||||
color: #fff;
|
||||
transition: background 0.2s ease;
|
||||
@@ -292,7 +326,7 @@
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
color: var(--aifo-nav-text);
|
||||
font-size: 1.2rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 300;
|
||||
padding: 0.5rem 0.25rem;
|
||||
}
|
||||
@@ -339,26 +373,34 @@
|
||||
|
||||
#nav.aifo-nav .aifo-nav__login {
|
||||
color: var(--aifo-nav-text);
|
||||
font-size: 1.2rem;
|
||||
font-size: 1rem;
|
||||
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
padding: 0.5rem 0;
|
||||
transition: color 0.2s ease;
|
||||
transition: background-color 0.2s ease, color 0.2s ease;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#nav.aifo-nav .aifo-nav__login {
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__login:hover,
|
||||
#nav.aifo-nav .aifo-nav__login:focus {
|
||||
color: #f98715;
|
||||
color: var(--aifo-nav-text);
|
||||
background-color: #353132;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Nav CTA — 42px height to match bar proportions */
|
||||
#nav.aifo-nav .aifo-nav__cta {
|
||||
padding: 0 1.25rem;
|
||||
min-height: 42px;
|
||||
height: 42px;
|
||||
font-size: 0.875rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
border-radius: 8px;
|
||||
white-space: nowrap;
|
||||
@@ -389,10 +431,23 @@
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__login {
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 0.75rem 0;
|
||||
#nav.aifo-nav .aifo-nav__login.d-lg-none {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-height: 42px;
|
||||
height: 42px;
|
||||
padding: 0 1.25rem;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #666;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__login:hover,
|
||||
#nav.aifo-nav .aifo-nav__login:focus {
|
||||
color: #f98715;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#nav.aifo-nav .aifo-nav__dropdown {
|
||||
|
||||
@@ -1,4 +1,9 @@
|
||||
/* Special Offer 50% — from temp/优惠页 (Figma export) */
|
||||
@import url("aifo-page-bg.css");
|
||||
|
||||
#special-offer-50.aifo-page-bg {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#special-offer-50 {
|
||||
--so-bg: #080808;
|
||||
@@ -14,24 +19,11 @@
|
||||
--so-btn-px: 28px;
|
||||
--so-btn-font-size: 0.95rem;
|
||||
--so-btn-radius: 8px;
|
||||
--aifo-page-bg-top-left-top: 97px;
|
||||
color: var(--so-text);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#special-offer-50::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 106px;
|
||||
left: -2vw;
|
||||
width: min(60vw, 555px);
|
||||
height: min(60vw, 555px);
|
||||
max-height: min(52vh, 485px);
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
background: url("../images/backgrounds/new-user-promo-corner-glow.png") no-repeat
|
||||
left top / cover;
|
||||
}
|
||||
|
||||
#special-offer-50 .so-container {
|
||||
width: 100%;
|
||||
max-width: var(--so-container);
|
||||
@@ -370,10 +362,10 @@
|
||||
grid-area: hero-note;
|
||||
}
|
||||
|
||||
#special-offer-50::before {
|
||||
padding-top: 72px;
|
||||
top: 72px
|
||||
#special-offer-50 {
|
||||
--aifo-page-bg-top-left-top: 72px;
|
||||
}
|
||||
|
||||
#special-offer-50 .so-hero {
|
||||
padding: 0;
|
||||
min-height: 0;
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 297 KiB |
|
Before Width: | Height: | Size: 586 B After Width: | Height: | Size: 586 B |
|
Before Width: | Height: | Size: 583 B After Width: | Height: | Size: 583 B |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 773 B After Width: | Height: | Size: 773 B |
|
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 324 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 79 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 343 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 363 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
@@ -0,0 +1,3 @@
|
||||
<svg width="12" height="33" viewBox="0 0 12 33" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.9035 16.0992L1.24572 0.334908C0.899686 -0.266273 0 0.000918285 0 0.668897V32.3311C0 32.9991 0.899686 33.2663 1.24572 32.6651L11.8343 16.834C12.0419 16.6336 12.0419 16.3664 11.9035 16.0992Z" fill="#F98715"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 323 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Vendored
+29
-6
@@ -56,10 +56,16 @@
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">nav-help-center</div>
|
||||
<div class="name">Bold</div>
|
||||
<div class="code-name">&#xe617;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">Shield Warning</div>
|
||||
<div class="code-name">&#xe612;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">contact-us</div>
|
||||
@@ -444,9 +450,9 @@
|
||||
<pre><code class="language-css"
|
||||
>@font-face {
|
||||
font-family: 'iconfont';
|
||||
src: url('iconfont.woff2?t=1783075781525') format('woff2'),
|
||||
url('iconfont.woff?t=1783075781525') format('woff'),
|
||||
url('iconfont.ttf?t=1783075781525') format('truetype');
|
||||
src: url('iconfont.woff2?t=1783664954990') format('woff2'),
|
||||
url('iconfont.woff?t=1783664954990') format('woff'),
|
||||
url('iconfont.ttf?t=1783664954990') format('truetype');
|
||||
}
|
||||
</code></pre>
|
||||
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
||||
@@ -472,10 +478,19 @@
|
||||
<div class="content font-class">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-nav-scaling-plan"></span>
|
||||
<div class="name">
|
||||
Bold
|
||||
</div>
|
||||
<div class="code-name">.icon-nav-scaling-plan
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-nav-help-center"></span>
|
||||
<div class="name">
|
||||
nav-help-center
|
||||
Shield Warning
|
||||
</div>
|
||||
<div class="code-name">.icon-nav-help-center
|
||||
</div>
|
||||
@@ -1057,11 +1072,19 @@
|
||||
<div class="content symbol">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-nav-scaling-plan"></use>
|
||||
</svg>
|
||||
<div class="name">Bold</div>
|
||||
<div class="code-name">#icon-nav-scaling-plan</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-nav-help-center"></use>
|
||||
</svg>
|
||||
<div class="name">nav-help-center</div>
|
||||
<div class="name">Shield Warning</div>
|
||||
<div class="code-name">#icon-nav-help-center</div>
|
||||
</li>
|
||||
|
||||
|
||||
Vendored
+8
-4
@@ -1,8 +1,8 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 5079339 */
|
||||
src: url('iconfont.woff2?t=1783075781525') format('woff2'),
|
||||
url('iconfont.woff?t=1783075781525') format('woff'),
|
||||
url('iconfont.ttf?t=1783075781525') format('truetype');
|
||||
src: url('iconfont.woff2?t=1783664954990') format('woff2'),
|
||||
url('iconfont.woff?t=1783664954990') format('woff'),
|
||||
url('iconfont.ttf?t=1783664954990') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
@@ -13,10 +13,14 @@
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-nav-help-center:before {
|
||||
.icon-nav-scaling-plan:before {
|
||||
content: "\e617";
|
||||
}
|
||||
|
||||
.icon-nav-help-center:before {
|
||||
content: "\e612";
|
||||
}
|
||||
|
||||
.icon-nav-contact-us:before {
|
||||
content: "\e637";
|
||||
}
|
||||
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+10
-3
@@ -6,12 +6,19 @@
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "47996453",
|
||||
"name": "nav-help-center",
|
||||
"font_class": "nav-help-center",
|
||||
"icon_id": "48041590",
|
||||
"name": "Bold",
|
||||
"font_class": "nav-scaling-plan",
|
||||
"unicode": "e617",
|
||||
"unicode_decimal": 58903
|
||||
},
|
||||
{
|
||||
"icon_id": "47999927",
|
||||
"name": "Shield Warning",
|
||||
"font_class": "nav-help-center",
|
||||
"unicode": "e612",
|
||||
"unicode_decimal": 58898
|
||||
},
|
||||
{
|
||||
"icon_id": "47996317",
|
||||
"name": "contact-us",
|
||||
|
||||
Vendored
BIN
Binary file not shown.
Vendored
BIN
Binary file not shown.
Vendored
BIN
Binary file not shown.
@@ -129,12 +129,20 @@
|
||||
<p class="aifo-foot__disclaimer">
|
||||
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="aifo-foot__companies">
|
||||
<div class="aifo-foot__company">
|
||||
<p>AIFO HOLDING LIMITED</p>
|
||||
<p>License No.80190485</p>
|
||||
<p>RM 4, 15/F SUNWISE IND BLDG, 16-26 WANG WO TSAI ST TSUEN WAN, HONG KONG</p>
|
||||
</div>
|
||||
|
||||
<div class="aifo-foot__company">
|
||||
<p>AIFO Global Ltd</p>
|
||||
<p>License No. L16175/AG</p>
|
||||
<p>Boulevard de Coalancanthe, Mutsamudu, Anjouan, Union of Comoros</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="aifo-foot__payments">
|
||||
<div class="aifo-foot__pay-group">
|
||||
<span class="aifo-foot__pay-chip"><img src="/assets/images/payment-methods/visa.svg" alt="Visa" /></span>
|
||||
|
||||
+22
-1
@@ -52,6 +52,24 @@
|
||||
Payouts
|
||||
</span>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/pages/aifo-scaling-plan.html">
|
||||
<span class="aifo-nav__drop-item">
|
||||
<span class="aifo-nav__icon-box" aria-hidden="true">
|
||||
<span class="icon iconfont icon-nav-scaling-plan" data-nav-icon="live-sessions"></span>
|
||||
</span>
|
||||
Scaling Plan
|
||||
</span>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/pages/page-index.html">
|
||||
<span class="aifo-nav__drop-item">
|
||||
<span class="aifo-nav__icon-box" aria-hidden="true">
|
||||
<span class="icon iconfont icon-nav-application-form" data-nav-icon="live-sessions"></span>
|
||||
</span>
|
||||
Overview
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
|
||||
@@ -86,6 +104,7 @@
|
||||
Live Sessions
|
||||
</span>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</li>
|
||||
|
||||
@@ -115,7 +134,9 @@
|
||||
<a class="dropdown-item" href="#">
|
||||
<span class="aifo-nav__drop-item">
|
||||
<span class="aifo-nav__icon-box" aria-hidden="true">
|
||||
<span class="icon iconfont icon-nav-trading-platform" data-nav-icon="metatrader-5"></span>
|
||||
<span class="aifo-nav__icon">
|
||||
<img src="/assets/images/icons/nav-metatrader-5.svg" alt="" width="24" height="24" loading="lazy">
|
||||
</span>
|
||||
</span>
|
||||
MetaTrader 5
|
||||
</span>
|
||||
|
||||
@@ -0,0 +1,179 @@
|
||||
{
|
||||
"project": {
|
||||
"name": "aifo",
|
||||
"id": "5079339",
|
||||
"platform": "https://www.iconfont.cn",
|
||||
"css_prefix": "icon-",
|
||||
"convention": "上传时 font_class 填 nav-{slug}；页面类名为 icon-nav-{slug}；与 WP convert_title_to_slug() 一致"
|
||||
},
|
||||
"slug_aliases": {
|
||||
"payouts": "nav-payout",
|
||||
"payout": "nav-payout",
|
||||
"payoff": "nav-payout",
|
||||
"faq": "nav-faq",
|
||||
"help-center": "nav-help-center"
|
||||
},
|
||||
"upload_checklist": [
|
||||
{
|
||||
"font_class": "nav-account-models",
|
||||
"display_name": "Account Models",
|
||||
"group": "Funding Programs",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-funding-programs"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-trading-courses",
|
||||
"display_name": "Trading Courses",
|
||||
"group": "Academy",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-academy"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-live-sessions",
|
||||
"display_name": "Live Sessions",
|
||||
"group": "Academy",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-live"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-ai-coach",
|
||||
"display_name": "AI-Coach",
|
||||
"group": "Platform",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-mind-growth"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-metatrader-5",
|
||||
"display_name": "MetaTrader 5",
|
||||
"group": "Platform",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-trading-platform"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-partnership",
|
||||
"display_name": "Partnership",
|
||||
"group": "Company",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-application-form"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-contact-us",
|
||||
"display_name": "Contact Us",
|
||||
"group": "Company",
|
||||
"status": "new",
|
||||
"note": "主题旧版为 icon-nav-contact，新版统一 nav-contact-us",
|
||||
"temp_fallback": "icon-nav-contact"
|
||||
},
|
||||
{
|
||||
"font_class": "nav-help-center",
|
||||
"display_name": "Help Center",
|
||||
"group": "Company",
|
||||
"status": "new",
|
||||
"temp_fallback": "icon-nav-faq"
|
||||
}
|
||||
],
|
||||
"existing_icons": [
|
||||
{ "font_class": "nav-payout", "labels": ["Payout", "Payouts"] },
|
||||
{ "font_class": "nav-about-us", "labels": ["About Us"] },
|
||||
{ "font_class": "nav-academy", "labels": ["Academy", "Trading Courses (fallback)"] },
|
||||
{ "font_class": "nav-live", "labels": ["Live", "Live Sessions (fallback)"] },
|
||||
{ "font_class": "nav-faq", "labels": ["FAQ", "Help Center (fallback)"] },
|
||||
{ "font_class": "nav-funding-programs", "labels": ["Funding Programs"] },
|
||||
{ "font_class": "nav-trading-platform", "labels": ["Trading Platform", "MetaTrader 5 (fallback)"] },
|
||||
{ "font_class": "nav-contact", "labels": ["Contact (legacy)"] },
|
||||
{ "font_class": "nav-mind-growth", "labels": ["Mind & Growth", "AI-Coach (fallback)"] },
|
||||
{ "font_class": "nav-application-form", "labels": ["Partnership (fallback)"] }
|
||||
],
|
||||
"menu": [
|
||||
{
|
||||
"group": "Funding Programs",
|
||||
"items": [
|
||||
{
|
||||
"label": "Account Models",
|
||||
"slug": "account-models",
|
||||
"font_class": "nav-account-models",
|
||||
"html_class": "icon-nav-account-models",
|
||||
"use_class": "icon-nav-funding-programs"
|
||||
},
|
||||
{
|
||||
"label": "Payouts",
|
||||
"slug": "payouts",
|
||||
"font_class": "nav-payout",
|
||||
"html_class": "icon-nav-payout",
|
||||
"use_class": "icon-nav-payout"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"group": "Academy",
|
||||
"items": [
|
||||
{
|
||||
"label": "Trading Courses",
|
||||
"slug": "trading-courses",
|
||||
"font_class": "nav-trading-courses",
|
||||
"html_class": "icon-nav-trading-courses",
|
||||
"use_class": "icon-nav-academy"
|
||||
},
|
||||
{
|
||||
"label": "Live Sessions",
|
||||
"slug": "live-sessions",
|
||||
"font_class": "nav-live-sessions",
|
||||
"html_class": "icon-nav-live-sessions",
|
||||
"use_class": "icon-nav-live"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"group": "Platform",
|
||||
"items": [
|
||||
{
|
||||
"label": "AI-Coach",
|
||||
"slug": "ai-coach",
|
||||
"font_class": "nav-ai-coach",
|
||||
"html_class": "icon-nav-ai-coach",
|
||||
"use_class": "icon-nav-mind-growth"
|
||||
},
|
||||
{
|
||||
"label": "MetaTrader 5",
|
||||
"slug": "metatrader-5",
|
||||
"font_class": "nav-metatrader-5",
|
||||
"html_class": "icon-nav-metatrader-5",
|
||||
"use_class": "icon-nav-trading-platform"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"group": "Company",
|
||||
"items": [
|
||||
{
|
||||
"label": "About Us",
|
||||
"slug": "about-us",
|
||||
"font_class": "nav-about-us",
|
||||
"html_class": "icon-nav-about-us",
|
||||
"use_class": "icon-nav-about-us"
|
||||
},
|
||||
{
|
||||
"label": "Partnership",
|
||||
"slug": "partnership",
|
||||
"font_class": "nav-partnership",
|
||||
"html_class": "icon-nav-partnership",
|
||||
"use_class": "icon-nav-application-form"
|
||||
},
|
||||
{
|
||||
"label": "Contact Us",
|
||||
"slug": "contact-us",
|
||||
"font_class": "nav-contact-us",
|
||||
"html_class": "icon-nav-contact-us",
|
||||
"use_class": "icon-nav-contact"
|
||||
},
|
||||
{
|
||||
"label": "Help Center",
|
||||
"slug": "help-center",
|
||||
"font_class": "nav-help-center",
|
||||
"html_class": "icon-nav-help-center",
|
||||
"use_class": "icon-nav-faq"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,72 @@
|
||||
/**
|
||||
* Flip-style countdown for landing pages.
|
||||
* Usage:
|
||||
* <div class="landing-countdown" data-countdown data-countdown-end="2026-12-31T23:59:59">
|
||||
* <div class="landing-countdown" data-countdown data-countdown-days="10">
|
||||
*/
|
||||
(function () {
|
||||
function pad2(n) {
|
||||
return String(Math.max(0, n)).padStart(2, "0");
|
||||
}
|
||||
|
||||
function renderDigits(container, value) {
|
||||
var digits = container.querySelectorAll("[data-countdown-digit]");
|
||||
var str = pad2(value);
|
||||
digits[0].textContent = str[0];
|
||||
digits[1].textContent = str[1];
|
||||
}
|
||||
|
||||
function resolveEndTime(el) {
|
||||
var daysAttr = el.getAttribute("data-countdown-days");
|
||||
if (daysAttr != null && daysAttr !== "") {
|
||||
var days = parseInt(daysAttr, 10);
|
||||
if (!Number.isNaN(days) && days >= 0) {
|
||||
var end = new Date();
|
||||
end.setDate(end.getDate() + days);
|
||||
end.setHours(23, 59, 59, 999);
|
||||
return end.getTime();
|
||||
}
|
||||
}
|
||||
|
||||
var endStr = el.getAttribute("data-countdown-end");
|
||||
if (!endStr) return NaN;
|
||||
return new Date(endStr).getTime();
|
||||
}
|
||||
|
||||
function initCountdown(el) {
|
||||
var end = resolveEndTime(el);
|
||||
if (Number.isNaN(end)) return;
|
||||
|
||||
var daysEl = el.querySelector("[data-countdown-days]");
|
||||
var hoursEl = el.querySelector("[data-countdown-hours]");
|
||||
var minsEl = el.querySelector("[data-countdown-mins]");
|
||||
var secsEl = el.querySelector("[data-countdown-secs]");
|
||||
|
||||
function tick() {
|
||||
var diff = Math.max(0, end - Date.now());
|
||||
var totalSec = Math.floor(diff / 1000);
|
||||
var days = Math.floor(totalSec / 86400);
|
||||
var hours = Math.floor((totalSec % 86400) / 3600);
|
||||
var mins = Math.floor((totalSec % 3600) / 60);
|
||||
var secs = totalSec % 60;
|
||||
|
||||
if (daysEl) renderDigits(daysEl, days);
|
||||
if (hoursEl) renderDigits(hoursEl, hours);
|
||||
if (minsEl) renderDigits(minsEl, mins);
|
||||
if (secsEl) renderDigits(secsEl, secs);
|
||||
}
|
||||
|
||||
tick();
|
||||
setInterval(tick, 1000);
|
||||
}
|
||||
|
||||
function initAll() {
|
||||
document.querySelectorAll("[data-countdown]").forEach(initCountdown);
|
||||
}
|
||||
|
||||
if (document.readyState === "loading") {
|
||||
document.addEventListener("DOMContentLoaded", initAll);
|
||||
} else {
|
||||
initAll();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,199 @@
|
||||
/**
|
||||
* Welcome rewards floor — loads landing-welcome-rewards.section.html
|
||||
* and fills copy from data-* on the placeholder node.
|
||||
*
|
||||
* Placeholder example:
|
||||
* <div
|
||||
* data-landing-welcome-rewards
|
||||
* data-welcome-title-id="dollar-welcome-title"
|
||||
* data-welcome-title-before="Welcome"
|
||||
* data-welcome-title-accent="rewards"
|
||||
* data-welcome-eyebrow="Limited-time offer"
|
||||
* data-welcome-value="$1"
|
||||
* data-welcome-sub="ALL CHALLENGES*"
|
||||
* data-welcome-code-label="Use code"
|
||||
* data-welcome-code="AIFOPROM"
|
||||
* data-welcome-cta-text="Claim Now"
|
||||
* data-welcome-cta-href="#register-now"
|
||||
* data-welcome-copy-success="Code copied!"
|
||||
* ></div>
|
||||
*/
|
||||
(function () {
|
||||
var MODULE_URL = '/pages/modules/landing-welcome-rewards.section.html';
|
||||
var DEFAULT_COPY_SUCCESS = 'Code copied to clipboard!';
|
||||
var copyToastTimer;
|
||||
|
||||
function readConfig(el) {
|
||||
return {
|
||||
titleId: el.getAttribute('data-welcome-title-id') || 'landing-welcome-title',
|
||||
titleBefore: el.getAttribute('data-welcome-title-before') || '',
|
||||
titleAccent: el.getAttribute('data-welcome-title-accent') || '',
|
||||
eyebrow: el.getAttribute('data-welcome-eyebrow') || '',
|
||||
value: el.getAttribute('data-welcome-value') || '',
|
||||
sub: el.getAttribute('data-welcome-sub') || '',
|
||||
codeLabel: el.getAttribute('data-welcome-code-label') || '',
|
||||
code: el.getAttribute('data-welcome-code') || '',
|
||||
ctaText: el.getAttribute('data-welcome-cta-text') || '',
|
||||
ctaHref: el.getAttribute('data-welcome-cta-href') || '#register-now',
|
||||
note: el.getAttribute('data-welcome-note') || '',
|
||||
copySuccess: el.getAttribute('data-welcome-copy-success') || DEFAULT_COPY_SUCCESS,
|
||||
};
|
||||
}
|
||||
|
||||
function copyText(text) {
|
||||
if (!text) return Promise.resolve();
|
||||
if (navigator.clipboard && typeof navigator.clipboard.writeText === 'function') {
|
||||
return navigator.clipboard.writeText(text);
|
||||
}
|
||||
return new Promise(function (resolve, reject) {
|
||||
var ta = document.createElement('textarea');
|
||||
ta.value = text;
|
||||
ta.setAttribute('readonly', '');
|
||||
ta.style.position = 'fixed';
|
||||
ta.style.left = '-9999px';
|
||||
document.body.appendChild(ta);
|
||||
ta.select();
|
||||
try {
|
||||
if (document.execCommand('copy')) resolve();
|
||||
else reject(new Error('copy failed'));
|
||||
} catch (err) {
|
||||
reject(err);
|
||||
} finally {
|
||||
document.body.removeChild(ta);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getCopyToast() {
|
||||
var toast = document.getElementById('landing-welcome-copy-toast');
|
||||
if (toast) return toast;
|
||||
|
||||
toast = document.createElement('div');
|
||||
toast.id = 'landing-welcome-copy-toast';
|
||||
toast.className = 'landing-welcome-copy-toast';
|
||||
toast.setAttribute('role', 'status');
|
||||
toast.setAttribute('aria-live', 'polite');
|
||||
document.body.appendChild(toast);
|
||||
return toast;
|
||||
}
|
||||
|
||||
function showCopyToast(message) {
|
||||
var toast = getCopyToast();
|
||||
toast.textContent = message;
|
||||
toast.classList.add('is-visible');
|
||||
window.clearTimeout(copyToastTimer);
|
||||
copyToastTimer = window.setTimeout(function () {
|
||||
toast.classList.remove('is-visible');
|
||||
}, 2400);
|
||||
}
|
||||
|
||||
function bindPromoCodeCopy(codeEl, config) {
|
||||
if (!codeEl || !config.code) return;
|
||||
|
||||
codeEl.setAttribute('aria-label', 'Copy promo code ' + config.code);
|
||||
|
||||
codeEl.addEventListener('click', function () {
|
||||
copyText(config.code)
|
||||
.then(function () {
|
||||
codeEl.classList.add('is-copied');
|
||||
showCopyToast(config.copySuccess);
|
||||
window.setTimeout(function () {
|
||||
codeEl.classList.remove('is-copied');
|
||||
}, 1200);
|
||||
})
|
||||
.catch(function () {
|
||||
showCopyToast('Copy failed. Please copy manually.');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function setText(node, value) {
|
||||
if (!node) return;
|
||||
node.textContent = value;
|
||||
}
|
||||
|
||||
function populateSection(section, config) {
|
||||
section.setAttribute('aria-labelledby', config.titleId);
|
||||
|
||||
var titleEl = section.querySelector('[data-welcome-title]');
|
||||
if (titleEl) {
|
||||
titleEl.id = config.titleId;
|
||||
titleEl.textContent = '';
|
||||
|
||||
if (config.titleBefore) {
|
||||
titleEl.appendChild(document.createTextNode(config.titleBefore));
|
||||
}
|
||||
|
||||
if (config.titleAccent) {
|
||||
if (config.titleBefore) {
|
||||
titleEl.appendChild(document.createTextNode(' '));
|
||||
}
|
||||
var accent = document.createElement('span');
|
||||
accent.className = 'landing-accent';
|
||||
accent.textContent = config.titleAccent;
|
||||
titleEl.appendChild(accent);
|
||||
}
|
||||
}
|
||||
|
||||
setText(section.querySelector('[data-welcome-eyebrow]'), config.eyebrow);
|
||||
setText(section.querySelector('[data-welcome-value]'), config.value);
|
||||
setText(section.querySelector('[data-welcome-sub]'), config.sub);
|
||||
|
||||
var codeWrap = section.querySelector('[data-welcome-code-wrap]');
|
||||
if (codeWrap && (config.codeLabel || config.code)) {
|
||||
codeWrap.hidden = false;
|
||||
setText(section.querySelector('[data-welcome-code-label]'), config.codeLabel);
|
||||
var codeEl = section.querySelector('[data-welcome-code]');
|
||||
setText(codeEl, config.code);
|
||||
bindPromoCodeCopy(codeEl, config);
|
||||
}
|
||||
|
||||
var cta = section.querySelector('[data-welcome-cta]');
|
||||
if (cta && config.ctaText) {
|
||||
cta.hidden = false;
|
||||
cta.textContent = config.ctaText;
|
||||
cta.href = config.ctaHref;
|
||||
}
|
||||
|
||||
var note = section.querySelector('[data-welcome-note]');
|
||||
if (note && config.note) {
|
||||
note.hidden = false;
|
||||
note.textContent = config.note;
|
||||
}
|
||||
}
|
||||
|
||||
function loadLandingWelcomeRewardsModule() {
|
||||
var placeholder = document.querySelector('[data-landing-welcome-rewards]');
|
||||
if (!placeholder) return;
|
||||
|
||||
var config = readConfig(placeholder);
|
||||
var parent = placeholder.parentNode;
|
||||
|
||||
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) {
|
||||
var wrap = document.createElement('div');
|
||||
wrap.innerHTML = html.trim();
|
||||
var section = wrap.firstElementChild;
|
||||
if (!section || !parent) return;
|
||||
|
||||
populateSection(section, config);
|
||||
parent.replaceChild(section, placeholder);
|
||||
document.dispatchEvent(
|
||||
new CustomEvent('aifo:landing-welcome-rewards-ready', { detail: { config: config } })
|
||||
);
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[landing-welcome-rewards-module.js]', err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', loadLandingWelcomeRewardsModule);
|
||||
} else {
|
||||
loadLandingWelcomeRewardsModule();
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,30 @@
|
||||
/**
|
||||
* Loads payout-24h.section.html into #payout-24h-container.
|
||||
*/
|
||||
(function () {
|
||||
var MODULE_URL = '/pages/modules/payout-24h.section.html';
|
||||
|
||||
function loadPayout24hModule() {
|
||||
var container = document.getElementById('payout-24h-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:payout-24h-ready'));
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[payout-24h-module.js]', err);
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', loadPayout24hModule);
|
||||
} else {
|
||||
loadPayout24hModule();
|
||||
}
|
||||
})();
|
||||
@@ -25,7 +25,7 @@
|
||||
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="aifo-page-bg aifo-page-bg--grid">
|
||||
<main class="aifo-page-bg aifo-page-bg--top-glow">
|
||||
<div class="au2-page">
|
||||
<!-- Hero -->
|
||||
<section class="au2-hero" aria-labelledby="au2-hero-title">
|
||||
|
||||
@@ -0,0 +1,196 @@
|
||||
<!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="$1 gets you $10,000 — start your AIFO challenge for only $1. Limited-time offer.">
|
||||
<title>$1 Challenge | 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-btn.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/adl-register.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/claim-steps.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/landing-welcome-rewards.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/leading-v2.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/landing-v2-base.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-1-dollar-landing.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="aifo-1-dollar-landing">
|
||||
<div id="header-v2-container"></div>
|
||||
|
||||
<main class="aifo-page-bg aifo-page-bg--top-left-glow">
|
||||
<!-- Hero banner — full width, flush under nav (same pattern as free-retry) -->
|
||||
<section class="dollar-hero" aria-labelledby="dollar-hero-title">
|
||||
<div class="dollar-hero__stage">
|
||||
<div class="dollar-hero__banner">
|
||||
<div class="dollar-hero__banner-media" aria-hidden="true">
|
||||
<img
|
||||
class="dollar-hero__banner-img"
|
||||
src="../assets/images/leading-v2/dollar_1_v1/bg_1.png"
|
||||
alt=""
|
||||
width="1140"
|
||||
height="496"
|
||||
decoding="async"
|
||||
>
|
||||
</div>
|
||||
<div class="dollar-hero__content">
|
||||
<h1 class="landing-hero__title" id="dollar-hero-title">
|
||||
<span class="landing-accent">$1</span> GETS
|
||||
<span class="landing-hero__title-line">YOU $10,000</span>
|
||||
</h1>
|
||||
<ul class="landing-hero__bullets dollar-hero__bullets">
|
||||
<li>Only $1 to Start</li>
|
||||
<li>Get the Challenge<br>You Desire</li>
|
||||
<li>Background Check<br>is Free</li>
|
||||
</ul>
|
||||
<div class="landing-hero__actions">
|
||||
<a href="#adl-register-container" class="aifo-btn aifo-btn--primary">Claim Your Account</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="landing-v2-page">
|
||||
<!-- Countdown -->
|
||||
<div
|
||||
class="landing-countdown"
|
||||
data-countdown
|
||||
data-countdown-end="2026-08-31T23:59:59"
|
||||
aria-label="Promotion countdown"
|
||||
>
|
||||
<div data-countdown-days aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
<span class="landing-countdown__sep" aria-hidden="true">:</span>
|
||||
<div data-countdown-hours aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
<span class="landing-countdown__sep" aria-hidden="true">:</span>
|
||||
<div data-countdown-mins aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
<span class="landing-countdown__sep" aria-hidden="true">:</span>
|
||||
<div data-countdown-secs aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Registration -->
|
||||
<div class="landing-v2-register" id="adl-register-container"></div>
|
||||
|
||||
<!-- Welcome rewards -->
|
||||
<div
|
||||
data-landing-welcome-rewards
|
||||
data-welcome-title-id="dollar-welcome-title"
|
||||
data-welcome-title-before="Welcome"
|
||||
data-welcome-title-accent="rewards"
|
||||
data-welcome-eyebrow="Limited-time offer"
|
||||
data-welcome-value="$1"
|
||||
data-welcome-sub="ALL CHALLENGES*"
|
||||
data-welcome-code-label="Use code"
|
||||
data-welcome-code="AIFOPROM"
|
||||
data-welcome-cta-text="Claim Now"
|
||||
data-welcome-cta-href="#register-now"
|
||||
></div>
|
||||
|
||||
<!-- 3 Simple Steps -->
|
||||
<section class="landing-section clain-section" aria-labelledby="dollar-steps-title">
|
||||
<h2 class="landing-section__title" id="dollar-steps-title">
|
||||
Start Trading in <br><span class="landing-accent">3 Simple Steps</span>
|
||||
</h2>
|
||||
<div class="claim-grid">
|
||||
<article class="claim-item">
|
||||
<img
|
||||
class="claim-step-mark"
|
||||
src="../assets/images/backgrounds/new-user-claim-step-01.png"
|
||||
width="120"
|
||||
height="120"
|
||||
alt=""
|
||||
decoding="async"
|
||||
>
|
||||
<p class="claim-text">
|
||||
<strong>Pay $1</strong>
|
||||
Complete your first payment and unlock your Challenge Account.
|
||||
</p>
|
||||
</article>
|
||||
<article class="claim-item">
|
||||
<img
|
||||
class="claim-step-mark"
|
||||
src="../assets/images/backgrounds/new-user-claim-step-02.png"
|
||||
width="120"
|
||||
height="120"
|
||||
alt=""
|
||||
decoding="async"
|
||||
>
|
||||
<p class="claim-text">
|
||||
<strong>Trade Your Challenge</strong>
|
||||
Follow the rules and show your trading ability.
|
||||
</p>
|
||||
</article>
|
||||
<article class="claim-item">
|
||||
<img
|
||||
class="claim-step-mark"
|
||||
src="../assets/images/backgrounds/new-user-claim-step-03.png"
|
||||
width="120"
|
||||
height="120"
|
||||
alt=""
|
||||
decoding="async"
|
||||
>
|
||||
<p class="claim-text">
|
||||
<strong>Pass & Get Funded</strong>
|
||||
Complete the Challenge and move closer to becoming a funded trader.
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="landing-section__cta">
|
||||
<a href="#register-now" class="aifo-btn aifo-btn--primary">Get Started Now</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Why section -->
|
||||
<section class="landing-section" aria-labelledby="dollar-why-title">
|
||||
<h2 class="landing-section__title" id="dollar-why-title">
|
||||
Why Start With AIFO<br>
|
||||
<span class="landing-accent">$1 Challenge?</span>
|
||||
</h2>
|
||||
<div class="landing-why-list">
|
||||
<article class="landing-why-item">
|
||||
<h3 class="landing-why-item__title">Low Entry Cost</h3>
|
||||
<p class="landing-why-item__desc">
|
||||
Try a real Challenge experience without a big upfront payment.
|
||||
</p>
|
||||
</article>
|
||||
<article class="landing-why-item">
|
||||
<h3 class="landing-why-item__title">Real Trading Opportunity</h3>
|
||||
<p class="landing-why-item__desc">
|
||||
Trade with a $10,000 Challenge Account and test your strategy.
|
||||
</p>
|
||||
</article>
|
||||
<article class="landing-why-item">
|
||||
<h3 class="landing-why-item__title">Built For Traders</h3>
|
||||
<p class="landing-why-item__desc">
|
||||
Access AIFO's professional trading environment.
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</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/landing-welcome-rewards-module.js"></script>
|
||||
<script src="/js/landing-countdown.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,207 @@
|
||||
<!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="Fail your first AIFO challenge? Get a free retry on the same account size — one purchase, two chances.">
|
||||
<title>Free Retry | 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-btn.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/adl-register.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/payout-24h.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/modules/claim-steps.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/leading-v2.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/landing-v2-base.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-free-retry-landing.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="aifo-free-retry-landing">
|
||||
<div id="header-v2-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<!-- Hero banner — full width, flush under nav -->
|
||||
<section class="free-retry-hero" aria-labelledby="retry-hero-title">
|
||||
<div class="free-retry-hero__stage">
|
||||
<div class="free-retry-hero__banner">
|
||||
<div class="free-retry-hero__banner-media" aria-hidden="true">
|
||||
<img
|
||||
class="free-retry-hero__banner-img"
|
||||
src="../assets/images/leading-v2/free1_v1/hero-banner.png"
|
||||
alt=""
|
||||
width="1140"
|
||||
height="380"
|
||||
decoding="async"
|
||||
>
|
||||
</div>
|
||||
<div class="free-retry-hero__content">
|
||||
<p class="free-retry-hero__eyebrow">Fail Your First Challenge?</p>
|
||||
<h1 class="free-retry-hero__title" id="retry-hero-title">
|
||||
<span class="landing-accent">Retry FREE</span>
|
||||
</h1>
|
||||
<p class="free-retry-hero__subtitle">One Purchase. Two Chances.</p>
|
||||
<div class="free-retry-hero__badges" aria-label="Eligible account sizes">
|
||||
<span class="free-retry-hero__badge">10K</span>
|
||||
<span class="free-retry-hero__badge">25K</span>
|
||||
<span class="free-retry-hero__badge">50K</span>
|
||||
</div>
|
||||
<p class="free-retry-hero__note">
|
||||
Buy once, get a free retry with the SAME<br>
|
||||
account size if your first attempt fails.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="landing-v2-page">
|
||||
<!-- Countdown -->
|
||||
<div
|
||||
class="landing-countdown"
|
||||
data-countdown
|
||||
data-countdown-days="10"
|
||||
aria-label="Promotion countdown"
|
||||
>
|
||||
<div data-countdown-days aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
<span class="landing-countdown__sep" aria-hidden="true">:</span>
|
||||
<div data-countdown-hours aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
<span class="landing-countdown__sep" aria-hidden="true">:</span>
|
||||
<div data-countdown-mins aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
<span class="landing-countdown__sep" aria-hidden="true">:</span>
|
||||
<div data-countdown-secs aria-hidden="true">
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
<span class="landing-countdown__digit" data-countdown-digit>0</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Registration -->
|
||||
<div class="landing-v2-register" id="adl-register-container"></div>
|
||||
|
||||
<!-- How Free Retry Works -->
|
||||
<section class="landing-section clain-section" aria-labelledby="retry-steps-title">
|
||||
<h2 class="landing-section__title" id="retry-steps-title">
|
||||
How Free <span class="landing-accent">Retry Works</span>
|
||||
</h2>
|
||||
<div class="claim-grid">
|
||||
<article class="claim-item">
|
||||
<img
|
||||
class="claim-step-mark"
|
||||
src="../assets/images/backgrounds/new-user-claim-step-01.png"
|
||||
width="120"
|
||||
height="120"
|
||||
alt=""
|
||||
decoding="async"
|
||||
>
|
||||
<p class="claim-text"><strong>Buy</strong>Purchase any eligible Challenge account.</p>
|
||||
</article>
|
||||
<article class="claim-item">
|
||||
<img
|
||||
class="claim-step-mark"
|
||||
src="../assets/images/backgrounds/new-user-claim-step-02.png"
|
||||
width="120"
|
||||
height="120"
|
||||
alt=""
|
||||
decoding="async"
|
||||
>
|
||||
<p class="claim-text"><strong>Trade</strong>Complete your first Challenge.</p>
|
||||
</article>
|
||||
<article class="claim-item">
|
||||
<img
|
||||
class="claim-step-mark"
|
||||
src="../assets/images/backgrounds/new-user-claim-step-03.png"
|
||||
width="120"
|
||||
height="120"
|
||||
alt=""
|
||||
decoding="async"
|
||||
>
|
||||
<p class="claim-text">
|
||||
<strong>Retry FREE</strong>
|
||||
Didn't pass? Receive another Challenge of the same size at no extra cost.
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<p class="landing-section__tagline">One payment. Two chances to pass.</p>
|
||||
<div class="landing-section__cta">
|
||||
<a href="/pages/user_signup.html" class="aifo-btn aifo-btn--primary">Get Started Now</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 24 Hours Payout (reusable module) -->
|
||||
<div id="payout-24h-container"></div>
|
||||
|
||||
<!-- One Purchase Two Chances -->
|
||||
<section class="landing-section landing-chances" aria-labelledby="retry-chances-title">
|
||||
<h2 class="landing-section__title" id="retry-chances-title">
|
||||
One Purchase<br>
|
||||
<span class="landing-accent">Two Chances</span>
|
||||
</h2>
|
||||
<ul class="landing-chances__list">
|
||||
<li>Free Retry on Your First Failed Challenge</li>
|
||||
<li>Same Account Size Included</li>
|
||||
<li>No Extra Cost</li>
|
||||
</ul>
|
||||
<div class="landing-chances__flow">
|
||||
<div class="landing-chances__node">
|
||||
<img
|
||||
class="landing-chances__icon-img"
|
||||
src="../assets/images/leading-v2/free1_v1/chances-icon-first-attempt.png"
|
||||
alt=""
|
||||
width="120"
|
||||
height="120"
|
||||
decoding="async"
|
||||
>
|
||||
<p class="landing-chances__label">First Attempt</p>
|
||||
</div>
|
||||
<span class="landing-chances__arrow" aria-hidden="true">
|
||||
<img src="../assets/images/leading-v2/free1_v1/vector.svg" alt="" width="12" height="33">
|
||||
</span>
|
||||
<div class="landing-chances__node">
|
||||
<img
|
||||
class="landing-chances__icon-img"
|
||||
src="../assets/images/leading-v2/free1_v1/chances-icon-failed.png"
|
||||
alt=""
|
||||
width="120"
|
||||
height="120"
|
||||
decoding="async"
|
||||
>
|
||||
<p class="landing-chances__label">Failed?</p>
|
||||
</div>
|
||||
<span class="landing-chances__arrow" aria-hidden="true">
|
||||
<img src="../assets/images/leading-v2/free1_v1/vector.svg" alt="" width="12" height="33">
|
||||
</span>
|
||||
<div class="landing-chances__node">
|
||||
<img
|
||||
class="landing-chances__icon-img"
|
||||
src="../assets/images/leading-v2/free1_v1/chances-icon-gift.png"
|
||||
alt=""
|
||||
width="120"
|
||||
height="120"
|
||||
decoding="async"
|
||||
>
|
||||
<p class="landing-chances__label">Same Challenge FREE</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</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/payout-24h-module.js"></script>
|
||||
<script src="/js/landing-countdown.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -9,12 +9,12 @@
|
||||
<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/promotion-activity-1.css" rel="stylesheet">
|
||||
<link type="text/css" href="../assets/css/aifo-scaling-plan.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="aifo-bg-primary" id="promotion-activity-1">
|
||||
<body class="aifo-bg-primary" id="aifo-scaling-plan">
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<main class="aifo-page-bg aifo-page-bg--top-glow">
|
||||
<div class="promo-page">
|
||||
<section class="scaling-hero">
|
||||
<div class="scaling-hero__content">
|
||||
@@ -60,7 +60,7 @@
|
||||
|
||||
<div class="scaling-hero__visual">
|
||||
<img
|
||||
src="../assets/images/promotion-activity-1/hero-scaling.png"
|
||||
src="../assets/images/aifo-scaling-plan/hero-scaling.png"
|
||||
alt="AIFO scaling plan illustration"
|
||||
width="510"
|
||||
height="560"
|
||||
@@ -69,7 +69,7 @@
|
||||
<div class="scaling-hero__badge">
|
||||
<span class="scaling-hero__badge-icon" aria-hidden="true">
|
||||
<img
|
||||
src="../assets/images/promotion-activity-1/logo-icon.png"
|
||||
src="../assets/images/aifo-scaling-plan/logo-icon.png"
|
||||
alt=""
|
||||
width="22"
|
||||
height="22"
|
||||
@@ -92,7 +92,7 @@
|
||||
<article class="scaling-benefit-card">
|
||||
<span class="scaling-benefit-card__icon" aria-hidden="true">
|
||||
<img
|
||||
src="../assets/images/promotion-activity-1/bene-1.svg"
|
||||
src="../assets/images/aifo-scaling-plan/bene-1.svg"
|
||||
alt=""
|
||||
width="24"
|
||||
height="24"
|
||||
@@ -106,7 +106,7 @@
|
||||
<article class="scaling-benefit-card">
|
||||
<span class="scaling-benefit-card__icon" aria-hidden="true">
|
||||
<img
|
||||
src="../assets/images/promotion-activity-1/bene-2.svg"
|
||||
src="../assets/images/aifo-scaling-plan/bene-2.svg"
|
||||
alt=""
|
||||
width="24"
|
||||
height="24"
|
||||
@@ -120,7 +120,7 @@
|
||||
<article class="scaling-benefit-card">
|
||||
<span class="scaling-benefit-card__icon" aria-hidden="true">
|
||||
<img
|
||||
src="../assets/images/promotion-activity-1/bene-3.svg"
|
||||
src="../assets/images/aifo-scaling-plan/bene-3.svg"
|
||||
alt=""
|
||||
width="24"
|
||||
height="24"
|
||||
@@ -134,7 +134,7 @@
|
||||
<article class="scaling-benefit-card">
|
||||
<span class="scaling-benefit-card__icon" aria-hidden="true">
|
||||
<img
|
||||
src="../assets/images/promotion-activity-1/bene-4.svg"
|
||||
src="../assets/images/aifo-scaling-plan/bene-4.svg"
|
||||
alt=""
|
||||
width="24"
|
||||
height="24"
|
||||
@@ -17,7 +17,7 @@
|
||||
<body class="aifo-bg-primary" id="leading-v2">
|
||||
<div id="header-v2-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<main class="aifo-page-bg aifo-page-bg--top-glow">
|
||||
<div class="leading-v2-page">
|
||||
<section class="lv2-hero">
|
||||
<h1 class="lv2-hero__title">
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
<section class="landing-section landing-welcome" data-landing-welcome-rewards-module aria-labelledby="">
|
||||
<div class="landing-welcome__glow" aria-hidden="true"></div>
|
||||
<div class="landing-welcome__inner">
|
||||
<h2 class="landing-section__title" data-welcome-title></h2>
|
||||
<div class="landing-promo-card">
|
||||
<div class="landing-promo-card__offer">
|
||||
<p class="landing-promo-card__eyebrow" data-welcome-eyebrow></p>
|
||||
<p class="landing-promo-card__value" data-welcome-value></p>
|
||||
<p class="landing-promo-card__sub" data-welcome-sub></p>
|
||||
</div>
|
||||
<div class="landing-promo-card__right">
|
||||
<div class="landing-promo-card__code-wrap" data-welcome-code-wrap hidden>
|
||||
<p class="landing-promo-card__code-label" data-welcome-code-label></p>
|
||||
<button type="button" class="landing-promo-card__code" data-welcome-code aria-live="polite"></button>
|
||||
</div>
|
||||
<a href="#" class="aifo-btn aifo-btn--primary aifo-btn--sm" data-welcome-cta hidden></a>
|
||||
</div>
|
||||
</div>
|
||||
<p class="landing-note" data-welcome-note hidden></p>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!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>24 Hours Payout Module</title>
|
||||
<link href="../../assets/css/style.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/landing-v2-base.css" rel="stylesheet">
|
||||
<link type="text/css" href="../../assets/css/modules/payout-24h.css" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 48px 16px;
|
||||
background: #070400;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body id="payout-24h-demo">
|
||||
<div id="payout-24h-container"></div>
|
||||
|
||||
<script src="/js/payout-24h-module.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,159 @@
|
||||
<!-- 24 Hours Payout — reusable floor module -->
|
||||
<section class="payout-24h landing-section" data-payout-24h-module aria-labelledby="payout-24h-title">
|
||||
<h2 class="payout-24h__title" id="payout-24h-title">
|
||||
24 Hours <span class="payout-24h__accent">Payout</span>
|
||||
</h2>
|
||||
<p class="payout-24h__subtitle">Real Payouts. Real Traders. Real Proof.</p>
|
||||
|
||||
<div class="payout-24h__grid">
|
||||
<article class="payout-24h__card">
|
||||
<div class="payout-24h__card-top">
|
||||
<span class="payout-24h__amount">$1,250</span>
|
||||
<span class="payout-24h__badge">PAID</span>
|
||||
</div>
|
||||
<div class="payout-24h__card-bottom">
|
||||
<img
|
||||
class="payout-24h__avatar"
|
||||
src="/assets/images/leading-v2/free1_v1/payout-avatar-1.png"
|
||||
alt=""
|
||||
width="40"
|
||||
height="40"
|
||||
decoding="async"
|
||||
>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Method</span>
|
||||
<span class="payout-24h__value">LTC</span>
|
||||
</div>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Time</span>
|
||||
<span class="payout-24h__value">43 min</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="payout-24h__card">
|
||||
<div class="payout-24h__card-top">
|
||||
<span class="payout-24h__amount">$6,750</span>
|
||||
<span class="payout-24h__badge">PAID</span>
|
||||
</div>
|
||||
<div class="payout-24h__card-bottom">
|
||||
<img
|
||||
class="payout-24h__avatar"
|
||||
src="/assets/images/leading-v2/free1_v1/payout-avatar-2.png"
|
||||
alt=""
|
||||
width="40"
|
||||
height="40"
|
||||
decoding="async"
|
||||
>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Method</span>
|
||||
<span class="payout-24h__value">USDT</span>
|
||||
</div>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Time</span>
|
||||
<span class="payout-24h__value">Under 2h</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="payout-24h__card">
|
||||
<div class="payout-24h__card-top">
|
||||
<span class="payout-24h__amount">$2,430</span>
|
||||
<span class="payout-24h__badge">PAID</span>
|
||||
</div>
|
||||
<div class="payout-24h__card-bottom">
|
||||
<img
|
||||
class="payout-24h__avatar"
|
||||
src="/assets/images/leading-v2/free1_v1/payout-avatar-3.png"
|
||||
alt=""
|
||||
width="40"
|
||||
height="40"
|
||||
decoding="async"
|
||||
>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Method</span>
|
||||
<span class="payout-24h__value">BTC</span>
|
||||
</div>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Time</span>
|
||||
<span class="payout-24h__value">7h 12m</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="payout-24h__card">
|
||||
<div class="payout-24h__card-top">
|
||||
<span class="payout-24h__amount">$8,200</span>
|
||||
<span class="payout-24h__badge">PAID</span>
|
||||
</div>
|
||||
<div class="payout-24h__card-bottom">
|
||||
<img
|
||||
class="payout-24h__avatar"
|
||||
src="/assets/images/leading-v2/free1_v1/payout-avatar-4.png"
|
||||
alt=""
|
||||
width="40"
|
||||
height="40"
|
||||
decoding="async"
|
||||
>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Method</span>
|
||||
<span class="payout-24h__value">Bank Transfer</span>
|
||||
</div>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Time</span>
|
||||
<span class="payout-24h__value">Under 4h</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="payout-24h__card">
|
||||
<div class="payout-24h__card-top">
|
||||
<span class="payout-24h__amount">$3,150</span>
|
||||
<span class="payout-24h__badge">PAID</span>
|
||||
</div>
|
||||
<div class="payout-24h__card-bottom">
|
||||
<img
|
||||
class="payout-24h__avatar"
|
||||
src="/assets/images/leading-v2/free1_v1/payout-avatar-5.png"
|
||||
alt=""
|
||||
width="40"
|
||||
height="40"
|
||||
decoding="async"
|
||||
>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Method</span>
|
||||
<span class="payout-24h__value">USDT</span>
|
||||
</div>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Time</span>
|
||||
<span class="payout-24h__value">1h ago</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="payout-24h__card">
|
||||
<div class="payout-24h__card-top">
|
||||
<span class="payout-24h__amount">$5,600</span>
|
||||
<span class="payout-24h__badge">PAID</span>
|
||||
</div>
|
||||
<div class="payout-24h__card-bottom">
|
||||
<img
|
||||
class="payout-24h__avatar"
|
||||
src="/assets/images/leading-v2/free1_v1/payout-avatar-6.png"
|
||||
alt=""
|
||||
width="40"
|
||||
height="40"
|
||||
decoding="async"
|
||||
>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Method</span>
|
||||
<span class="payout-24h__value">BTC</span>
|
||||
</div>
|
||||
<div class="payout-24h__col">
|
||||
<span class="payout-24h__label">Time</span>
|
||||
<span class="payout-24h__value">45 min</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
@@ -23,7 +23,7 @@
|
||||
#new-user-promo::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 106px;
|
||||
top: 90px;
|
||||
left: -2vw;
|
||||
width: min(60vw, 555px);
|
||||
height: min(60vw, 555px);
|
||||
|
||||
@@ -63,10 +63,12 @@
|
||||
<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/aifo-scaling-plan.html">Scaling Plan<small>/pages/aifo-scaling-plan.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>
|
||||
<li><a class="page-index__link" href="/pages/aifo-1-dollar-landing.html">$1 Challenge Landing<small>/pages/aifo-1-dollar-landing.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/aifo-free-retry-landing.html">Free Retry Landing<small>/pages/aifo-free-retry-landing.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
@@ -118,6 +120,7 @@
|
||||
<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>
|
||||
<li><a class="page-index__link" href="/pages/modules/payout-24h.html">24 Hours Payout<small>/pages/modules/payout-24h.html</small></a></li>
|
||||
<li><a class="page-index__link" href="/pages/modules/support-cta.html">Support CTA<small>/pages/modules/support-cta.html</small></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<body class="aifo-bg-primary" id="partnership-page">
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<main class="aifo-page-bg aifo-page-bg--top-glow">
|
||||
<div class="partnership-page">
|
||||
<div class="partnership-page__glow" aria-hidden="true"></div>
|
||||
|
||||
|
||||
+1
-1
@@ -19,7 +19,7 @@
|
||||
<body class="aifo-bg-primary" id="pricing-page">
|
||||
<div id="header-v2-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<main class="aifo-page-bg aifo-page-bg--top-glow">
|
||||
<div class="pricing-page">
|
||||
<div
|
||||
id="challenge-floor-module"
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<body class="aifo-bg-primary" id="promotion-activity">
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main class="aifo-page-bg">
|
||||
<main class="aifo-page-bg aifo-page-bg--top-glow">
|
||||
<div class="promo-page">
|
||||
<section class="promo-hero">
|
||||
<div class="promo-hero__content">
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
<body class="aifo-bg-primary">
|
||||
<div id="nav-container"></div>
|
||||
|
||||
<main id="special-offer-50">
|
||||
<main id="special-offer-50" class="aifo-page-bg aifo-page-bg--top-left-glow">
|
||||
<!-- Hero -->
|
||||
<section class="so-hero" aria-labelledby="so-hero-title">
|
||||
<div class="so-container so-hero__inner">
|
||||
|
||||
Reference in New Issue
Block a user