← ai signal saham US
03-carousel-designer
Run: 2026-06-03T17:13:36 · 20757 in / 15010 out tokens · 285.6s
# CAROUSEL 1: Terminal Pagi Buka, Portofolio Lo Udah -8%
## METADATA
- Topic: Pre-market ritual fatal — trade execution tanpa cek overnight news
- Audience focus: Active trader saham US, usia 25-38, trade dari Indonesia, sering loss karena FOMO market open
- Slide count: 10
- Suggested caption: Kalau lo pernah buka posisi 30 detik setelah market open terus langsung merah, ini buat lo. Save buat besok pagi. 📉
<!-- IMAGE_BRIEF -->
```json
{
"topic": "Pre-market ritual fatal",
"subject_hint": "Young Indonesian trader staring at laptop screen with multiple charts, stressed expression, dark room with glowing monitors showing red candles, early morning vibe (5-6 AM)",
"emotion": "anxious, rushed, regretful",
"headline": "Terminal Pagi Buka, Portofolio Lo Udah -8%",
"headline_pre": "Terminal Pagi Buka,",
"headline_serif_part": "Portofolio Lo Udah -8%",
"subheadline": "Ini yang lo skip sebelum klik BUY",
"label_top": "ZETA AI · TRADING SERIES",
"cta_pill": "LIHAT CHECKLIST"
}
```
<!-- /IMAGE_BRIEF -->
<!-- SLIDE_1_HTML_FALLBACK -->
<section class="slide slide-1 carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg);">
<div class="number-badge">01 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:48px;">
<!-- Terminal-style ticker bar decorative -->
<div style="font-family:'JetBrains Mono',monospace; font-size:16px; padding:10px 20px; background:#0a0a0a; color:#ef4444; border-radius:6px; letter-spacing:0.1em;">SPY ▼ 582.30 (-1.2%)</div>
<!-- Hero composition C — Geometric Burst with red accent -->
<div style="position:relative; width:280px; height:280px; margin:0 auto;">
<svg style="position:absolute; inset:0; width:100%; height:100%;" viewBox="0 0 280 280">
<path d="M40 140 A100 100 0 0 1 240 140" stroke="var(--danger)" stroke-width="4" fill="none" stroke-linecap="round" opacity="0.3"/>
<path d="M70 140 A70 70 0 0 1 210 140" stroke="var(--danger)" stroke-width="6" fill="none" stroke-linecap="round" opacity="0.6"/>
<circle cx="140" cy="140" r="40" fill="var(--danger)"/>
<circle cx="140" cy="40" r="8" fill="var(--danger)" opacity="0.8"/>
<circle cx="220" cy="80" r="6" fill="var(--danger)" opacity="0.5"/>
<circle cx="60" cy="80" r="4" fill="var(--danger)" opacity="0.4"/>
<line x1="240" y1="60" x2="270" y2="40" stroke="var(--danger)" stroke-width="4" stroke-linecap="round"/>
<line x1="20" y1="220" x2="50" y2="240" stroke="var(--danger)" stroke-width="4" stroke-linecap="round" opacity="0.5"/>
</svg>
</div>
<h1 class="hero" style="max-width:800px;">Terminal Pagi Buka,<br><span style="font-family:'Crimson Pro',serif; font-style:italic; color:var(--danger);">Portofolio Lo Udah -8%</span></h1>
<p class="sub" style="color:var(--muted); max-width:600px;">Ini yang lo skip sebelum klik BUY</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- /SLIDE_1_HTML_FALLBACK -->
## HTML
```html
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Terminal Pagi Buka, Portofolio Lo Udah -8% — Zeta AI</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;700;800&family=Inter:wght@400;500;600;700&family=Crimson+Pro:ital,wght@1,500;1,600;1,700&family=JetBrains+Mono:wght@400;600;700&display=swap" rel="stylesheet">
<style>
:root {
--bg: #FDF8F3;
--bg-soft: #F1ECE3;
--bg-white: #FFFFFF;
--bg-dark: #1A1A1A;
--ink: #1A1A1A;
--ink-on-dark: #FAFAFA;
--muted: #5A5A5A;
--line: #E5E0D6;
--highlight: #FEF08A;
--primary: #4915C1;
--secondary: #1A1A1A;
--accent: #10B981;
--danger: #EF4444;
--neutral-light: #FAFAFA;
--neutral-dark: #0A0A0A;
--neutral-mid: #525252;
--brand: var(--primary);
--soft-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
--soft-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.10);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #E5E5E5; font-family: 'Inter', sans-serif; -webkit-font-smoothing: antialiased; }
.slide {
width: 1080px; height: 1350px;
background: var(--bg); color: var(--ink);
padding: 80px;
display: flex; flex-direction: column; justify-content: center;
page-break-after: always;
margin: 20px auto;
position: relative; overflow: hidden;
box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.slide.bg-white { background: var(--bg-white); }
.slide.bg-dark { background: var(--bg-dark); color: var(--ink-on-dark); }
.slide.bg-primary { background: var(--primary); color: var(--bg-white); }
.slide.bg-secondary { background: var(--secondary); color: var(--ink-on-dark); }
.hero { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 96px; line-height: 1.05; letter-spacing: -0.02em; font-weight: 800; }
.headline { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 56px; line-height: 1.15; font-weight: 800; letter-spacing: -0.01em; }
.sub { font-size: 32px; line-height: 1.4; font-weight: 400; color: var(--ink); }
.body { font-size: 28px; line-height: 1.5; font-weight: 400; color: var(--ink); }
.caption { font-size: 22px; line-height: 1.5; color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }
.stat-num { font-family: 'JetBrains Mono', monospace; font-size: 220px; line-height: 0.9; font-weight: 800; letter-spacing: -0.04em; }
.quote-text { font-family: 'Crimson Pro', serif; font-style: italic; font-size: 88px; line-height: 1.1; font-weight: 600; }
.highlight { background: linear-gradient(180deg, transparent 60%, var(--highlight) 60%); padding: 0 6px; font-weight: 700; }
.accent-word { color: var(--primary); font-weight: 800; }
.number-badge { position: absolute; top: 48px; right: 48px; font-family: 'Inter', monospace; font-size: 22px; color: var(--muted); letter-spacing: 0.08em; font-weight: 600; }
.brand-ribbon { position: absolute; bottom: 48px; left: 80px; font-size: 22px; color: var(--muted); letter-spacing: 0.05em; font-weight: 600; }
.stripe { height: 6px; width: 64px; background: var(--primary); border-radius: 3px; }
.icon-mega { width: 320px; height: 320px; max-width: 320px; max-height: 320px; flex-shrink: 0; stroke-width: 2.5; display: block; }
.icon-hero { width: 240px; height: 240px; max-width: 240px; max-height: 240px; flex-shrink: 0; stroke-width: 2.5; display: block; }
.icon-inline { width: 36px; height: 36px; max-width: 36px; max-height: 36px; flex-shrink: 0; display: inline-block; vertical-align: middle; }
.icon-circle { width: 320px; height: 320px; max-width: 320px; max-height: 320px; flex-shrink: 0; background: var(--bg-soft); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 40px; box-shadow: var(--soft-shadow-lg); position: relative; }
.icon-circle::before { content: ''; position: absolute; inset: -8px; border: 2px dashed rgba(73,21,193,0.4); border-radius: 50%; animation: rotate-slow 60s linear infinite; }
@keyframes rotate-slow { to { transform: rotate(360deg); } }
.slide svg:not([class*="icon-"]) { max-width: 64px; max-height: 64px; }
.slide.bg-dark .icon-circle { background: rgba(255,255,255,0.08); }
.slide.bg-dark .icon-hero, .slide.bg-dark .icon-mega { color: var(--ink-on-dark); }
.soft-card { background: var(--bg-white); border-radius: 16px; padding: 28px 32px; box-shadow: var(--soft-shadow); display: flex; gap: 20px; align-items: flex-start; margin-bottom: 24px; }
.terminal-bar { font-family: 'JetBrains Mono', monospace; font-size: 15px; padding: 10px 18px; background: #0a0a0a; border-radius: 6px; letter-spacing: 0.08em; display: inline-block; }
.badge-gain { display: inline-block; padding: 6px 14px; background: var(--accent); color: #fff; font-family: 'JetBrains Mono', monospace; font-weight: 700; border-radius: 4px; font-size: 16px; }
.badge-loss { display: inline-block; padding: 6px 14px; background: var(--danger); color: #fff; font-family: 'JetBrains Mono', monospace; font-weight: 700; border-radius: 4px; font-size: 16px; }
@media print {
body { background: #FFFFFF; }
.slide { margin: 0; box-shadow: none; }
}
</style>
<style>
/* === Image hook slide 1 overlay (injected by carousel_composer) === */
/* Format-responsive: slide dimensions come from html data-format attribute
(set by slide_renderer via format.json). Defaults to 1:1 if no attr. */
.slide { aspect-ratio: 1 / 1; }
html[data-format="4:5"] .slide,
.slide[data-format="4:5"] { aspect-ratio: 4 / 5; }
.slide.slide-1.hook-image {
padding: 0 !important;
position: relative;
overflow: hidden;
}
.slide.slide-1 .hook-bg {
position: absolute; inset: 0;
width: 100%; height: 100%;
object-fit: cover;
z-index: 1;
}
.slide.slide-1 .hook-overlay {
position: relative;
z-index: 2;
width: 100%; height: 100%;
padding: 80px;
display: flex;
flex-direction: column;
justify-content: space-between;
color: #fff;
text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45);
background: linear-gradient(180deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.32) 100%);
}
.slide.slide-1 .hook-label {
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.18em;
text-transform: uppercase;
opacity: 0.95;
}
.slide.slide-1 .hook-content {
display: flex; flex-direction: column; gap: 18px;
}
.slide.slide-1 .hook-title {
font-family: 'Plus Jakarta Sans', sans-serif;
font-weight: 800;
font-size: 124px;
line-height: 1.0;
letter-spacing: -0.02em;
max-width: 90%;
margin: 0;
}
.slide.slide-1 .hook-title .serif-italic {
font-family: 'Crimson Pro', 'Playfair Display', serif;
font-weight: 600;
font-style: italic;
font-size: 130px;
letter-spacing: 0;
}
.slide.slide-1 .hook-sub {
font-family: 'Inter', sans-serif;
font-size: 30px;
font-weight: 500;
max-width: 75%;
line-height: 1.3;
opacity: 0.94;
margin: 0;
}
.slide.slide-1 .hook-cta {
align-self: flex-start;
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
padding: 14px 26px;
background: rgba(255, 255, 255, 0.95);
color: #1a1a1a;
border-radius: 999px;
text-shadow: none;
}
/* Typography variants */
.slide.slide-1.modern-sans-tight .hook-title,
.slide.slide-1.modern-sans-tight .hook-title .serif-italic {
font-family: 'Inter', sans-serif;
font-weight: 800;
letter-spacing: -0.04em;
font-style: normal;
}
.slide.slide-1.minimal-display .hook-title {
font-family: 'Bricolage Grotesque', 'Plus Jakarta Sans', sans-serif;
font-weight: 800;
}
.slide.slide-1.minimal-display .hook-title .serif-italic {
font-family: 'Bricolage Grotesque', sans-serif;
font-style: italic;
}
</style>
<style>
/* === Image hook v2 typography (injected by carousel_composer) === */
:root {
--slide1-primary-font: 'Inter, DM Sans, or Montserrat', 'Plus Jakarta Sans', 'Inter', 'Helvetica Neue', system-ui, sans-serif;
--slide1-accent-font: 'Inter, Open Sans, or Roboto', 'Plus Jakarta Sans', 'Inter', 'Helvetica Neue', system-ui, sans-serif;
--slide1-primary-weight: 800;
--slide1-accent-style: italic;
}
.slide.slide-1 .hook-title {
font-family: var(--slide1-primary-font) !important;
font-weight: var(--slide1-primary-weight) !important;
}
.slide.slide-1 .hook-title .serif-italic,
.slide.slide-1 .accent {
font-family: var(--slide1-accent-font) !important;
font-style: var(--slide1-accent-style) !important;
}
</style>
</head>
<body>
<section class="slide slide-1 carousel-slide hook-image editorial-bold-serif">
<img src="/brands/ai-signal-saham-us/file/content/carousels/2026-06-03-carousel-terminal-pagi-buka-portofolio-lo-udah-8-1/_assets/slide-1.png" class="hook-bg" alt="TRADER RETAIL · PRE-MARKET RITUAL" loading="eager">
<div class="hook-overlay">
<div class="hook-label">TRADER RETAIL · PRE-MARKET RITUAL</div>
<div class="hook-content">
<h1 class="hook-title">Terminal Pagi Buka, <em class="serif-italic">Portofolio Lo Udah</em></h1>
<p class="hook-sub">Ini yang lo skip sebelum klik BUY</p>
</div>
<div class="hook-cta">Swipe → →</div>
</div>
</section>
<!-- Slide 1: SKIPPED — backend inject image hook here -->
<!-- Slide 2: Hook restate (Layout D2) -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">02 / 10</div>
<!-- Dotted pattern overlay -->
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px; position:relative; z-index:2;">
<!-- Candlestick bearish decorative -->
<div style="display:flex; gap:12px; margin-bottom:20px;">
<svg width="40" height="80" viewBox="0 0 40 80">
<line x1="20" y1="0" x2="20" y2="80" stroke="#ef4444" stroke-width="2"/>
<rect x="10" y="20" width="20" height="40" fill="#ef4444"/>
</svg>
<svg width="40" height="80" viewBox="0 0 40 80">
<line x1="20" y1="0" x2="20" y2="80" stroke="#ef4444" stroke-width="2"/>
<rect x="10" y="15" width="20" height="50" fill="#ef4444"/>
</svg>
<svg width="40" height="80" viewBox="0 0 40 80">
<line x1="20" y1="0" x2="20" y2="80" stroke="#ef4444" stroke-width="2"/>
<rect x="10" y="25" width="20" height="35" fill="#ef4444"/>
</svg>
</div>
<h2 class="headline">Lo pernah buka<br>posisi <span class="highlight">30 detik</span><br>setelah market open?</h2>
<p class="body" style="color:var(--muted); max-width:720px;">Terus 5 menit kemudian udah merah -4%. Itu bukan karena entry lo salah — itu karena lo skip checklist pre-market.</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 3: Setup (Layout D2 with terminal bar) -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">03 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px;">
<span class="caption" style="color:var(--primary);">Konteks</span>
<div class="icon-circle" style="width:280px; height:280px; max-width:280px; max-height:280px;">
<!-- Clock icon (time, urgency) -->
<svg class="icon-hero" viewBox="0 0 24 24" fill="none" stroke="var(--primary)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"/>
<polyline points="12 6 12 12 16 14"/>
</svg>
</div>
<h2 class="headline">Market open =<br><span style="color:var(--danger);">chaos window.</span></h2>
<p class="body" style="color:var(--muted); max-width:720px;">5 menit pertama itu bukan waktu buat trade — itu waktu buat <span style="font-weight:700; color:var(--ink);">observasi.</span> Algo hunting stop-loss. Liquidity tipis. Spread melebar.</p>
<div class="terminal-bar" style="color:var(--muted);">09:30-09:35 EST = DO NOT TRADE ZONE</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 4: Value 1 (Layout D3 numbered with soft-card) -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">04 / 10</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;">
<span class="caption" style="margin-bottom:32px; color:var(--primary);">Pre-Market Checklist</span>
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">1</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;">Cek <span style="color:var(--primary);">overnight news</span></h3>
<p class="body" style="color:var(--muted);">Fed statement? Earnings surprise? Geopolitical shock? Kalau lo skip ini, lo trade blind. Buka Bloomberg/Reuters 10 menit sebelum open.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 5: Value 2 -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">05 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--secondary); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">2</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;">Cek <span style="color:var(--secondary);">pre-market volume</span></h3>
<p class="body" style="color:var(--muted);">Volume pre-market rendah = harga fake. Satu order besar bisa gerakin price 2-3%. Tunggu sampai volume normal (biasanya 09:40-09:45).</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 6: Value 3 -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(16,185,129,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(16,185,129,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">06 / 10</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">3</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;">Cek <span style="color:var(--accent);">gap pergerakan</span></h3>
<p class="body" style="color:var(--muted);">Gap up/down >2%? Itu bukan signal buat entry — itu signal buat <span style="font-weight:700; color:var(--ink);">wait.</span> Gap biasanya diisi dalam 30-60 menit pertama. Jangan FOMO.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 7: Value 4 (dark pause slide) -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at center, rgba(73,21,193,0.35), transparent 60%), var(--bg-dark); color:var(--ink-on-dark);">
<div class="number-badge" style="color:rgba(255,255,255,0.6);">07 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:48px;">
<!-- Alert triangle icon -->
<svg style="width:120px; height:120px;" viewBox="0 0 24 24" fill="none" stroke="var(--danger)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/>
<path d="M12 9v4"/>
<path d="M12 17h.01"/>
</svg>
<h2 class="quote-text" style="color:#fff; max-width:720px; font-size:80px;">Kalau lo trade <span style="color:var(--danger);">tanpa checklist,</span> lo bukan trader — lo gambler.</h2>
<div style="width:24px; height:24px; background:var(--danger); border-radius:50%;"></div>
</div>
<div class="brand-ribbon" style="color:rgba(255,255,255,0.6);">@zeta_ai.pro</div>
</section>
<!-- Slide 8: Value 5 (stat slide) -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">08 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:32px;">
<span class="caption" style="color:var(--primary);">Data Point</span>
<div class="stat-num" style="color:var(--danger);">68<span style="font-size:120px;">%</span></div>
<p class="body" style="max-width:640px; color:var(--ink);">trader retail yang loss di market open trade <span style="font-weight:700;">tanpa pre-market analysis.</span></p>
<div class="badge-loss">-$2,400 avg per trader/bulan</div>
<p style="font-size:20px; color:var(--muted); font-style:italic; margin-top:12px;">Source: NYSE trader behavior study 2024</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 9: Connector -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">09 / 10</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px; position:relative; z-index:2;">
<!-- Mini chart downtrend decorative -->
<div style="margin-bottom:20px;">
<svg width="200" height="60" viewBox="0 0 200 60">
<polyline points="0,10 30,20 60,18 90,35 120,45 150,42 180,50 200,55" stroke="#ef4444" stroke-width="4" fill="none"/>
<circle cx="200" cy="55" r="6" fill="#ef4444"/>
</svg>
</div>
<h2 class="headline">Jadi inget:</h2>
<p class="body" style="color:var(--muted); max-width:720px;">Market open bukan <span style="font-weight:700; color:var(--ink);">race.</span> Lo ga dapat award karena trade paling pagi. Yang dapat cuan adalah yang <span class="highlight">paling sabar.</span></p>
<div class="terminal-bar" style="color:var(--accent);">WAIT = WEALTH</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 10: CTA -->
<section class="slide carousel-slide" style="background: var(--primary); color:#fff;">
<div class="number-badge" style="color:rgba(255,255,255,0.7);">10 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:48px;">
<div style="height:8px; width:120px; background:#fff; border-radius:4px; opacity:0.8;"></div>
<h2 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:68px; line-height:1.15; font-weight:800; max-width:800px;">Save post ini.<br>Buka <span style="font-style:italic; font-family:'Crimson Pro',serif; font-size:76px;">besok pagi</span><br>sebelum lo klik BUY.</h2>
<p style="font-size:36px; line-height:1.4; opacity:0.9; max-width:720px;">Atau share ke 1 trader yang sering FOMO market open — lo tau siapa orangnya.</p>
<!-- Bull tag decorative -->
<div style="display:inline-flex; align-items:center; gap:10px; padding:10px 20px; background:rgba(255,255,255,0.15); color:#fff; border-radius:24px; font-weight:700; font-size:16px; text-transform:uppercase; letter-spacing:0.08em; align-self:flex-start;">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 4l8 8h-5v8h-6v-8H4z"/></svg>
DISCIPLINE WINS
</div>
</div>
<div style="position:absolute; bottom:48px; left:80px; right:80px; display:flex; justify-content:space-between; align-items:center;">
<span style="font-size:32px; font-weight:800; letter-spacing:0.02em;">ZETA AI</span>
<span style="font-size:22px; opacity:0.8; letter-spacing:0.05em;">@zeta_ai.pro</span>
</div>
</section>
</body>
</html>
```
---
# CAROUSEL 2: Lo Udah 6 Bulan Trade, Kok Masih -12%?
## METADATA
- Topic: Survivorship bias — trader retail fokus ke winning trade, skip tracking losers
- Audience focus: Intermediate trader (6-18 bulan trading), stuck di breakeven atau slight loss, belum track performance sistematis
- Slide count: 10
- Suggested caption: Kalau lo ga track loss lo dengan detail yang sama kayak win lo, lo cuma nge-lie ke diri sendiri. Reality check. 📊
<!-- IMAGE_BRIEF -->
```json
{
"topic": "Survivorship bias in trading",
"subject_hint": "Trading journal notebook with red pen marking losses, laptop screen showing negative P&L chart, frustrated young trader reviewing data, dim lighting with charts in background",
"emotion": "frustrated, reflective, determined",
"headline": "Lo Udah 6 Bulan Trade, Kok Masih -12%?",
"headline_pre": "Lo Udah 6 Bulan Trade,",
"headline_serif_part": "Kok Masih -12%?",
"subheadline": "Karena lo cuma inget yang hijau doang",
"label_top": "ZETA AI · TRADING SERIES",
"cta_pill": "TRACK SEKARANG"
}
```
<!-- /IMAGE_BRIEF -->
<!-- SLIDE_1_HTML_FALLBACK -->
<section class="slide slide-1 carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(239,68,68,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(239,68,68,0.05), transparent 40%), var(--bg);">
<div class="number-badge">01 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:48px;">
<div class="terminal-bar" style="color:#ef4444;">YTD P&L: -12.4%</div>
<div style="position:relative; width:280px; height:280px; margin:0 auto;">
<div style="font-family:'JetBrains Mono',monospace; font-size:240px; line-height:0.9; font-weight:800; color:rgba(239,68,68,0.15); letter-spacing:-0.04em; text-align:center;">-12</div>
<div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);">
<svg style="width:160px; height:160px;" viewBox="0 0 24 24" fill="none" stroke="var(--danger)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<polyline points="23 18 13.5 8.5 8.5 13.5 1 6"/>
<polyline points="17 18 23 18 23 12"/>
</svg>
</div>
</div>
<h1 class="hero" style="max-width:800px;">Lo Udah 6 Bulan Trade,<br><span style="font-family:'Crimson Pro',serif; font-style:italic; color:var(--danger);">Kok Masih -12%?</span></h1>
<p class="sub" style="color:var(--muted); max-width:600px;">Karena lo cuma inget yang hijau doang</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- /SLIDE_1_HTML_FALLBACK -->
## HTML
```html
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lo Udah 6 Bulan Trade, Kok Masih -12%? — Zeta AI</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;700;800&family=Inter:wght@400;500;600;700&family=Crimson+Pro:ital,wght@1,500;1,600;1,700&family=JetBrains+Mono:wght@400;600;700&display=swap" rel="stylesheet">
<style>
:root {
--bg: #FDF8F3; --bg-soft: #F1ECE3; --bg-white: #FFFFFF; --bg-dark: #1A1A1A;
--ink: #1A1A1A; --ink-on-dark: #FAFAFA; --muted: #5A5A5A; --line: #E5E0D6; --highlight: #FEF08A;
--primary: #4915C1; --secondary: #1A1A1A; --accent: #10B981; --danger: #EF4444;
--neutral-light: #FAFAFA; --neutral-dark: #0A0A0A; --neutral-mid: #525252;
--brand: var(--primary); --soft-shadow: 0 4px 16px rgba(0, 0, 0, 0.06); --soft-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.10);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #E5E5E5; font-family: 'Inter', sans-serif; -webkit-font-smoothing: antialiased; }
.slide { width: 1080px; height: 1350px; background: var(--bg); color: var(--ink); padding: 80px; display: flex; flex-direction: column; justify-content: center; page-break-after: always; margin: 20px auto; position: relative; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
.slide.bg-white { background: var(--bg-white); }
.slide.bg-dark { background: var(--bg-dark); color: var(--ink-on-dark); }
.slide.bg-primary { background: var(--primary); color: var(--bg-white); }
.slide.bg-secondary { background: var(--secondary); color: var(--ink-on-dark); }
.hero { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 96px; line-height: 1.05; letter-spacing: -0.02em; font-weight: 800; }
.headline { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 56px; line-height: 1.15; font-weight: 800; letter-spacing: -0.01em; }
.sub { font-size: 32px; line-height: 1.4; font-weight: 400; color: var(--ink); }
.body { font-size: 28px; line-height: 1.5; font-weight: 400; color: var(--ink); }
.caption { font-size: 22px; line-height: 1.5; color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }
.stat-num { font-family: 'JetBrains Mono', monospace; font-size: 220px; line-height: 0.9; font-weight: 800; letter-spacing: -0.04em; }
.quote-text { font-family: 'Crimson Pro', serif; font-style: italic; font-size: 88px; line-height: 1.1; font-weight: 600; }
.highlight { background: linear-gradient(180deg, transparent 60%, var(--highlight) 60%); padding: 0 6px; font-weight: 700; }
.accent-word { color: var(--primary); font-weight: 800; }
.number-badge { position: absolute; top: 48px; right: 48px; font-family: 'Inter', monospace; font-size: 22px; color: var(--muted); letter-spacing: 0.08em; font-weight: 600; }
.brand-ribbon { position: absolute; bottom: 48px; left: 80px; font-size: 22px; color: var(--muted); letter-spacing: 0.05em; font-weight: 600; }
.stripe { height: 6px; width: 64px; background: var(--primary); border-radius: 3px; }
.icon-mega { width: 320px; height: 320px; max-width: 320px; max-height: 320px; flex-shrink: 0; stroke-width: 2.5; display: block; }
.icon-hero { width: 240px; height: 240px; max-width: 240px; max-height: 240px; flex-shrink: 0; stroke-width: 2.5; display: block; }
.icon-inline { width: 36px; height: 36px; max-width: 36px; max-height: 36px; flex-shrink: 0; display: inline-block; vertical-align: middle; }
.icon-circle { width: 320px; height: 320px; max-width: 320px; max-height: 320px; flex-shrink: 0; background: var(--bg-soft); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 40px; box-shadow: var(--soft-shadow-lg); position: relative; }
.icon-circle::before { content: ''; position: absolute; inset: -8px; border: 2px dashed rgba(73,21,193,0.4); border-radius: 50%; animation: rotate-slow 60s linear infinite; }
@keyframes rotate-slow { to { transform: rotate(360deg); } }
.slide svg:not([class*="icon-"]) { max-width: 64px; max-height: 64px; }
.slide.bg-dark .icon-circle { background: rgba(255,255,255,0.08); }
.slide.bg-dark .icon-hero, .slide.bg-dark .icon-mega { color: var(--ink-on-dark); }
.soft-card { background: var(--bg-white); border-radius: 16px; padding: 28px 32px; box-shadow: var(--soft-shadow); display: flex; gap: 20px; align-items: flex-start; margin-bottom: 24px; }
.terminal-bar { font-family: 'JetBrains Mono', monospace; font-size: 15px; padding: 10px 18px; background: #0a0a0a; border-radius: 6px; letter-spacing: 0.08em; display: inline-block; }
.badge-gain { display: inline-block; padding: 6px 14px; background: var(--accent); color: #fff; font-family: 'JetBrains Mono', monospace; font-weight: 700; border-radius: 4px; font-size: 16px; }
.badge-loss { display: inline-block; padding: 6px 14px; background: var(--danger); color: #fff; font-family: 'JetBrains Mono', monospace; font-weight: 700; border-radius: 4px; font-size: 16px; }
@media print { body { background: #FFFFFF; } .slide { margin: 0; box-shadow: none; } }
</style>
<style>
/* === Image hook slide 1 overlay (injected by carousel_composer) === */
/* Format-responsive: slide dimensions come from html data-format attribute
(set by slide_renderer via format.json). Defaults to 1:1 if no attr. */
.slide { aspect-ratio: 1 / 1; }
html[data-format="4:5"] .slide,
.slide[data-format="4:5"] { aspect-ratio: 4 / 5; }
.slide.slide-1.hook-image {
padding: 0 !important;
position: relative;
overflow: hidden;
}
.slide.slide-1 .hook-bg {
position: absolute; inset: 0;
width: 100%; height: 100%;
object-fit: cover;
z-index: 1;
}
.slide.slide-1 .hook-overlay {
position: relative;
z-index: 2;
width: 100%; height: 100%;
padding: 80px;
display: flex;
flex-direction: column;
justify-content: space-between;
color: #fff;
text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45);
background: linear-gradient(180deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.32) 100%);
}
.slide.slide-1 .hook-label {
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.18em;
text-transform: uppercase;
opacity: 0.95;
}
.slide.slide-1 .hook-content {
display: flex; flex-direction: column; gap: 18px;
}
.slide.slide-1 .hook-title {
font-family: 'Plus Jakarta Sans', sans-serif;
font-weight: 800;
font-size: 124px;
line-height: 1.0;
letter-spacing: -0.02em;
max-width: 90%;
margin: 0;
}
.slide.slide-1 .hook-title .serif-italic {
font-family: 'Crimson Pro', 'Playfair Display', serif;
font-weight: 600;
font-style: italic;
font-size: 130px;
letter-spacing: 0;
}
.slide.slide-1 .hook-sub {
font-family: 'Inter', sans-serif;
font-size: 30px;
font-weight: 500;
max-width: 75%;
line-height: 1.3;
opacity: 0.94;
margin: 0;
}
.slide.slide-1 .hook-cta {
align-self: flex-start;
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
padding: 14px 26px;
background: rgba(255, 255, 255, 0.95);
color: #1a1a1a;
border-radius: 999px;
text-shadow: none;
}
/* Typography variants */
.slide.slide-1.modern-sans-tight .hook-title,
.slide.slide-1.modern-sans-tight .hook-title .serif-italic {
font-family: 'Inter', sans-serif;
font-weight: 800;
letter-spacing: -0.04em;
font-style: normal;
}
.slide.slide-1.minimal-display .hook-title {
font-family: 'Bricolage Grotesque', 'Plus Jakarta Sans', sans-serif;
font-weight: 800;
}
.slide.slide-1.minimal-display .hook-title .serif-italic {
font-family: 'Bricolage Grotesque', sans-serif;
font-style: italic;
}
</style>
<style>
/* === Image hook v2 typography (injected by carousel_composer) === */
:root {
--slide1-primary-font: 'Inter, DM Sans, or Montserrat', 'Plus Jakarta Sans', 'Inter', 'Helvetica Neue', system-ui, sans-serif;
--slide1-accent-font: 'Inter, Open Sans, or Roboto', 'Plus Jakarta Sans', 'Inter', 'Helvetica Neue', system-ui, sans-serif;
--slide1-primary-weight: 800;
--slide1-accent-style: italic;
}
.slide.slide-1 .hook-title {
font-family: var(--slide1-primary-font) !important;
font-weight: var(--slide1-primary-weight) !important;
}
.slide.slide-1 .hook-title .serif-italic,
.slide.slide-1 .accent {
font-family: var(--slide1-accent-font) !important;
font-style: var(--slide1-accent-style) !important;
}
</style>
</head>
<body>
<section class="slide slide-1 carousel-slide hook-image modern-sans-tight">
<img src="/brands/ai-signal-saham-us/file/content/carousels/2026-06-03-carousel-lo-udah-6-bulan-trade-kok-masih-12-2/_assets/slide-1.png" class="hook-bg" alt="TRADER Indonesia · BIAS SERIES" loading="eager">
<div class="hook-overlay">
<div class="hook-label">TRADER Indonesia · BIAS SERIES</div>
<div class="hook-content">
<h1 class="hook-title">Lo Udah 6 Bulan Trade, Kok <em class="serif-italic">Masih -12%?</em></h1>
<p class="hook-sub">Karena lo cuma inget yang hijau doang</p>
</div>
<div class="hook-cta">Lihat Selengkapnya →</div>
</div>
</section>
<!-- Slide 1: SKIPPED — backend inject image hook here -->
<!-- Slide 2: Hook -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">02 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px;">
<div style="display:flex; gap:16px; margin-bottom:20px;">
<div class="badge-gain">+18%</div>
<div class="badge-gain">+12%</div>
<div class="badge-loss">-24%</div>
<div class="badge-gain">+9%</div>
<div class="badge-loss">-31%</div>
</div>
<h2 class="headline">Lo inget 4 trade hijau<br>tapi <span style="color:var(--danger);">lupa</span> 2 trade<br>merah yang lebih gede.</h2>
<p class="body" style="color:var(--muted); max-width:720px;">Itu bukan memory lo yang jelek — itu <span class="highlight">survivorship bias.</span> Otak manusia hardwired buat inget win, suppress loss.</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 3: Setup -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">03 / 10</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px; position:relative; z-index:2;">
<span class="caption" style="color:var(--primary);">Konteks</span>
<div class="icon-circle">
<svg class="icon-hero" viewBox="0 0 24 24" fill="none" stroke="var(--primary)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<path d="M9.5 2A2.5 2.5 0 0 1 12 4.5v15a2.5 2.5 0 0 1-4.96.44 2.5 2.5 0 0 1-2.96-3.08 3 3 0 0 1-.34-5.58 2.5 2.5 0 0 1 1.32-4.24 2.5 2.5 0 0 1 4.44-2.04A2.5 2.5 0 0 1 9.5 2Z"/>
<path d="M14.5 2A2.5 2.5 0 0 0 12 4.5v15a2.5 2.5 0 0 0 4.96.44 2.5 2.5 0 0 0 2.96-3.08 3 3 0 0 0 .34-5.58 2.5 2.5 0 0 0-1.32-4.24 2.5 2.5 0 0 0-4.44-2.04A2.5 2.5 0 0 0 14.5 2Z"/>
</svg>
</div>
<h2 class="headline">Trader yang profit<br>konsisten punya<br>1 kesamaan:</h2>
<p class="body" style="color:var(--muted); max-width:720px;">Mereka track <span style="font-weight:700; color:var(--ink);">SEMUA</span> trade dengan detail yang sama. Win rate, avg win, avg loss, max drawdown, recovery time.</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 4-7: Numbered list tracking metrics -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">04 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center;">
<span class="caption" style="margin-bottom:32px; color:var(--primary);">4 Metrics Lo Harus Track</span>
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">1</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--primary);">Win rate</span> (tapi jangan obsessed)</h3>
<p class="body" style="color:var(--muted);">Win rate 40% bisa profitable kalau avg win lo 3x avg loss. Win rate 70% bisa bangkrut kalau 1 loss nge-wipe 5 win. Track both sides.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(16,185,129,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(16,185,129,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">05 / 10</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">2</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--accent);">Risk-reward ratio</span> aktual</h3>
<p class="body" style="color:var(--muted);">Bukan yg lo plan — yg sebenernya terjadi. Kalau planned RR 1:3 tapi actual average cuma 1:1.2, lo punya execution problem.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">06 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--secondary); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">3</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--secondary);">Max drawdown</span> + recovery time</h3>
<p class="body" style="color:var(--muted);">Lo turun -25%, butuh +33% buat balik modal. Track berapa lama recovery lo. Kalau >3 bulan, system lo punya issue fundamental.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(239,68,68,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(239,68,68,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">07 / 10</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--danger); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">4</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--danger);">Emotional state</span> per trade</h3>
<p class="body" style="color:var(--muted);">FOMO? Revenge trade? Overconfident? Mark it. Pattern bakal muncul: 80% loss lo terjadi saat emotional, bukan strategic.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 8: Dark pause -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at center, rgba(239,68,68,0.35), transparent 60%), var(--bg-dark); color:var(--ink-on-dark);">
<div class="number-badge" style="color:rgba(255,255,255,0.6);">08 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:48px;">
<svg style="width:120px; height:120px;" viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/>
<circle cx="9" cy="7" r="4"/>
<path d="M22 21v-2a4 4 0 0 0-3-3.87"/>
<path d="M16 3.13a4 4 0 0 1 0 7.75"/>
</svg>
<h2 class="quote-text" style="color:#fff; max-width:720px; font-size:80px;">Yang lo <span style="color:var(--danger);">track,</span> lo bisa improve. Yang lo ignore, lo cuma <span style="color:var(--danger);">repeat.</span></h2>
<div style="width:24px; height:24px; background:var(--danger); border-radius:50%;"></div>
</div>
<div class="brand-ribbon" style="color:rgba(255,255,255,0.6);">@zeta_ai.pro</div>
</section>
<!-- Slide 9: Connector -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">09 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px;">
<div style="margin-bottom:20px;">
<svg width="200" height="60" viewBox="0 0 200 60">
<polyline points="0,50 30,45 60,48 90,35 120,25 150,28 180,20 200,15" stroke="#10b981" stroke-width="4" fill="none"/>
<circle cx="200" cy="15" r="6" fill="#10b981"/>
</svg>
</div>
<h2 class="headline">Mulai hari ini:</h2>
<p class="body" style="color:var(--muted); max-width:720px;">Buka spreadsheet. Bikin 6 kolom: Date | Ticker | Entry | Exit | P&L | Emotional State. <span class="highlight">Isi setiap trade.</span> No exception.</p>
<div class="terminal-bar" style="color:var(--accent);">DATA > EGO</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 10: CTA -->
<section class="slide carousel-slide" style="background: var(--accent); color:#fff;">
<div class="number-badge" style="color:rgba(255,255,255,0.7);">10 / 10</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:48px;">
<div style="height:8px; width:120px; background:#fff; border-radius:4px; opacity:0.8;"></div>
<h2 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:68px; line-height:1.15; font-weight:800; max-width:800px;">Save post ini.<br>Mulai <span style="font-style:italic; font-family:'Crimson Pro',serif; font-size:76px;">tracking hari ini</span> — bukan besok.</h2>
<p style="font-size:36px; line-height:1.4; opacity:0.9; max-width:720px;">Lo butuh minimum 30 trade buat lihat pattern. Semakin cepat mulai, semakin cepat profitable.</p>
</div>
<div style="position:absolute; bottom:48px; left:80px; right:80px; display:flex; justify-content:space-between; align-items:center;">
<span style="font-size:32px; font-weight:800; letter-spacing:0.02em;">ZETA AI</span>
<span style="font-size:22px; opacity:0.8; letter-spacing:0.05em;">@zeta_ai.pro</span>
</div>
</section>
</body>
</html>
```
---
# CAROUSEL 3: Kenapa Signal Gratis Selalu "Win 8/10 Trade"?
## METADATA
- Topic: Signal provider scam anatomy — manipulated win rate disclosure
- Audience focus: Beginner trader (0-6 bulan), sering join grup signal gratis, belum paham cherry-picking data
- Slide count: 9
- Suggested caption: Kalau lo pernah join grup signal yang claim 80%+ win rate tapi lo sendiri loss, ini penjelasannya. Wake up call. 🚨
<!-- IMAGE_BRIEF -->
```json
{
"topic": "Signal provider scam anatomy",
"subject_hint": "Smartphone screen showing fake trading signal Telegram group with cherry-picked winning trades, shadowy hand holding phone, dark skeptical mood, red flags metaphor",
"emotion": "skeptical, wary, enlightened",
"headline": "Kenapa Signal Gratis Selalu 'Win 8/10 Trade'?",
"headline_pre": "Kenapa Signal Gratis Selalu",
"headline_serif_part": "'Win 8/10 Trade'?",
"subheadline": "Karena lo ga lihat 20 signal yang di-delete",
"label_top": "ZETA AI · TRADING SERIES",
"cta_pill": "LIHAT TRIKNYA"
}
```
<!-- /IMAGE_BRIEF -->
<!-- SLIDE_1_HTML_FALLBACK -->
<section class="slide slide-1 carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg);">
<div class="number-badge">01 / 09</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:48px;">
<div style="display:inline-flex; align-items:center; gap:10px; padding:10px 20px; background:rgba(239,68,68,0.1); color:var(--danger); border-radius:24px; font-weight:700; font-size:18px; text-transform:uppercase; letter-spacing:0.08em;">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/>
<path d="M12 9v4"/><path d="M12 17h.01"/>
</svg>
RED FLAG
</div>
<div style="position:relative; width:280px; height:280px; margin:0 auto;">
<svg style="position:absolute; inset:0; width:100%; height:100%;" viewBox="0 0 280 280">
<path d="M40 140 A100 100 0 0 1 240 140" stroke="var(--danger)" stroke-width="4" fill="none" stroke-linecap="round" opacity="0.3"/>
<path d="M70 140 A70 70 0 0 1 210 140" stroke="var(--danger)" stroke-width="6" fill="none" stroke-linecap="round" opacity="0.6"/>
<circle cx="140" cy="140" r="40" fill="var(--danger)"/>
<line x1="100" y1="100" x2="180" y2="180" stroke="#fff" stroke-width="8" stroke-linecap="round"/>
<line x1="180" y1="100" x2="100" y2="180" stroke="#fff" stroke-width="8" stroke-linecap="round"/>
</svg>
</div>
<h1 class="hero" style="max-width:900px;">Kenapa Signal Gratis Selalu <span style="font-family:'Crimson Pro',serif; font-style:italic; color:var(--danger);">'Win 8/10 Trade'?</span></h1>
<p class="sub" style="color:var(--muted); max-width:600px;">Karena lo ga lihat 20 signal yang di-delete</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- /SLIDE_1_HTML_FALLBACK -->
## HTML
```html
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kenapa Signal Gratis Selalu 'Win 8/10 Trade'? — Zeta AI</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;700;800&family=Inter:wght@400;500;600;700&family=Crimson+Pro:ital,wght@1,500;1,600;1,700&family=JetBrains+Mono:wght@400;600;700&display=swap" rel="stylesheet">
<style>
:root {
--bg: #FDF8F3; --bg-soft: #F1ECE3; --bg-white: #FFFFFF; --bg-dark: #1A1A1A;
--ink: #1A1A1A; --ink-on-dark: #FAFAFA; --muted: #5A5A5A; --line: #E5E0D6; --highlight: #FEF08A;
--primary: #4915C1; --secondary: #1A1A1A; --accent: #10B981; --danger: #EF4444;
--neutral-light: #FAFAFA; --neutral-dark: #0A0A0A; --neutral-mid: #525252;
--brand: var(--primary); --soft-shadow: 0 4px 16px rgba(0, 0, 0, 0.06); --soft-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.10);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #E5E5E5; font-family: 'Inter', sans-serif; -webkit-font-smoothing: antialiased; }
.slide { width: 1080px; height: 1350px; background: var(--bg); color: var(--ink); padding: 80px; display: flex; flex-direction: column; justify-content: center; page-break-after: always; margin: 20px auto; position: relative; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
.slide.bg-white { background: var(--bg-white); }
.slide.bg-dark { background: var(--bg-dark); color: var(--ink-on-dark); }
.slide.bg-primary { background: var(--primary); color: var(--bg-white); }
.hero { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 96px; line-height: 1.05; letter-spacing: -0.02em; font-weight: 800; }
.headline { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 56px; line-height: 1.15; font-weight: 800; letter-spacing: -0.01em; }
.sub { font-size: 32px; line-height: 1.4; font-weight: 400; color: var(--ink); }
.body { font-size: 28px; line-height: 1.5; font-weight: 400; color: var(--ink); }
.caption { font-size: 22px; line-height: 1.5; color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }
.stat-num { font-family: 'JetBrains Mono', monospace; font-size: 220px; line-height: 0.9; font-weight: 800; letter-spacing: -0.04em; }
.quote-text { font-family: 'Crimson Pro', serif; font-style: italic; font-size: 88px; line-height: 1.1; font-weight: 600; }
.highlight { background: linear-gradient(180deg, transparent 60%, var(--highlight) 60%); padding: 0 6px; font-weight: 700; }
.number-badge { position: absolute; top: 48px; right: 48px; font-family: 'Inter', monospace; font-size: 22px; color: var(--muted); letter-spacing: 0.08em; font-weight: 600; }
.brand-ribbon { position: absolute; bottom: 48px; left: 80px; font-size: 22px; color: var(--muted); letter-spacing: 0.05em; font-weight: 600; }
.icon-mega { width: 320px; height: 320px; max-width: 320px; max-height: 320px; flex-shrink: 0; stroke-width: 2.5; display: block; }
.icon-hero { width: 240px; height: 240px; max-width: 240px; max-height: 240px; flex-shrink: 0; stroke-width: 2.5; display: block; }
.icon-circle { width: 320px; height: 320px; max-width: 320px; max-height: 320px; flex-shrink: 0; background: var(--bg-soft); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 40px; box-shadow: var(--soft-shadow-lg); position: relative; }
.icon-circle::before { content: ''; position: absolute; inset: -8px; border: 2px dashed rgba(73,21,193,0.4); border-radius: 50%; animation: rotate-slow 60s linear infinite; }
@keyframes rotate-slow { to { transform: rotate(360deg); } }
.slide svg:not([class*="icon-"]) { max-width: 64px; max-height: 64px; }
.soft-card { background: var(--bg-white); border-radius: 16px; padding: 28px 32px; box-shadow: var(--soft-shadow); display: flex; gap: 20px; align-items: flex-start; margin-bottom: 24px; }
.terminal-bar { font-family: 'JetBrains Mono', monospace; font-size: 15px; padding: 10px 18px; background: #0a0a0a; border-radius: 6px; letter-spacing: 0.08em; display: inline-block; }
.badge-loss { display: inline-block; padding: 6px 14px; background: var(--danger); color: #fff; font-family: 'JetBrains Mono', monospace; font-weight: 700; border-radius: 4px; font-size: 16px; }
@media print { body { background: #FFFFFF; } .slide { margin: 0; box-shadow: none; } }
</style>
<style>
/* === Image hook slide 1 overlay (injected by carousel_composer) === */
/* Format-responsive: slide dimensions come from html data-format attribute
(set by slide_renderer via format.json). Defaults to 1:1 if no attr. */
.slide { aspect-ratio: 1 / 1; }
html[data-format="4:5"] .slide,
.slide[data-format="4:5"] { aspect-ratio: 4 / 5; }
.slide.slide-1.hook-image {
padding: 0 !important;
position: relative;
overflow: hidden;
}
.slide.slide-1 .hook-bg {
position: absolute; inset: 0;
width: 100%; height: 100%;
object-fit: cover;
z-index: 1;
}
.slide.slide-1 .hook-overlay {
position: relative;
z-index: 2;
width: 100%; height: 100%;
padding: 80px;
display: flex;
flex-direction: column;
justify-content: space-between;
color: #fff;
text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45);
background: linear-gradient(180deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.32) 100%);
}
.slide.slide-1 .hook-label {
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.18em;
text-transform: uppercase;
opacity: 0.95;
}
.slide.slide-1 .hook-content {
display: flex; flex-direction: column; gap: 18px;
}
.slide.slide-1 .hook-title {
font-family: 'Plus Jakarta Sans', sans-serif;
font-weight: 800;
font-size: 124px;
line-height: 1.0;
letter-spacing: -0.02em;
max-width: 90%;
margin: 0;
}
.slide.slide-1 .hook-title .serif-italic {
font-family: 'Crimson Pro', 'Playfair Display', serif;
font-weight: 600;
font-style: italic;
font-size: 130px;
letter-spacing: 0;
}
.slide.slide-1 .hook-sub {
font-family: 'Inter', sans-serif;
font-size: 30px;
font-weight: 500;
max-width: 75%;
line-height: 1.3;
opacity: 0.94;
margin: 0;
}
.slide.slide-1 .hook-cta {
align-self: flex-start;
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
padding: 14px 26px;
background: rgba(255, 255, 255, 0.95);
color: #1a1a1a;
border-radius: 999px;
text-shadow: none;
}
/* Typography variants */
.slide.slide-1.modern-sans-tight .hook-title,
.slide.slide-1.modern-sans-tight .hook-title .serif-italic {
font-family: 'Inter', sans-serif;
font-weight: 800;
letter-spacing: -0.04em;
font-style: normal;
}
.slide.slide-1.minimal-display .hook-title {
font-family: 'Bricolage Grotesque', 'Plus Jakarta Sans', sans-serif;
font-weight: 800;
}
.slide.slide-1.minimal-display .hook-title .serif-italic {
font-family: 'Bricolage Grotesque', sans-serif;
font-style: italic;
}
</style>
<style>
/* === Image hook v2 typography (injected by carousel_composer) === */
:root {
--slide1-primary-font: 'Inter, DM Sans, or Montserrat', 'Plus Jakarta Sans', 'Inter', 'Helvetica Neue', system-ui, sans-serif;
--slide1-accent-font: 'Inter, Open Sans, or Roboto', 'Plus Jakarta Sans', 'Inter', 'Helvetica Neue', system-ui, sans-serif;
--slide1-primary-weight: 800;
--slide1-accent-style: italic;
}
.slide.slide-1 .hook-title {
font-family: var(--slide1-primary-font) !important;
font-weight: var(--slide1-primary-weight) !important;
}
.slide.slide-1 .hook-title .serif-italic,
.slide.slide-1 .accent {
font-family: var(--slide1-accent-font) !important;
font-style: var(--slide1-accent-style) !important;
}
</style>
</head>
<body>
<section class="slide slide-1 carousel-slide hook-image editorial-bold-serif">
<img src="/brands/ai-signal-saham-us/file/content/carousels/2026-06-03-carousel-kenapa-signal-gratis-selalu-win-8-10-trade-3/_assets/slide-1.png" class="hook-bg" alt="SIGNAL ANALYSIS · SCAM ANATOMY" loading="eager">
<div class="hook-overlay">
<div class="hook-label">SIGNAL ANALYSIS · SCAM ANATOMY</div>
<div class="hook-content">
<h1 class="hook-title">Kenapa Signal Gratis <em class="serif-italic">Selalu 'Win 8/10 Trade'?</em></h1>
<p class="hook-sub">Karena lo ga lihat 20 signal yang di-delete</p>
</div>
<div class="hook-cta">Swipe → →</div>
</div>
</section>
<!-- Slide 1: SKIPPED -->
<!-- Slide 2: Hook -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">02 / 09</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px;">
<h2 class="headline">Lo join grup signal<br>gratis yang claim<br><span class="highlight">82% win rate.</span></h2>
<p class="body" style="color:var(--muted); max-width:720px;">Setiap hari ada screenshot profit. Tapi pas lo follow, kok lo loss terus? Ini bukan kebetulan — ini <span style="font-weight:700; color:var(--ink);">systematic manipulation.</span></p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 3: Setup -->
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(239,68,68,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(239,68,68,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">03 / 09</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:40px; position:relative; z-index:2;">
<span class="caption" style="color:var(--danger);">Konteks</span>
<div class="icon-circle">
<svg class="icon-hero" viewBox="0 0 24 24" fill="none" stroke="var(--danger)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/>
<path d="M12 9v4"/><path d="M12 17h.01"/>
</svg>
</div>
<h2 class="headline">Signal provider punya<br>1 senjata utama:</h2>
<p class="body" style="color:var(--muted); max-width:720px;"><span style="font-weight:700; color:var(--ink);">Cherry-picking data.</span> Post 10 signal. 8 loss, 2 win besar. Delete 8 yang loss. Brag tentang 2 yang win. Repeat.</p>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 4-7: Trik anatomy -->
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">04 / 09</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center;">
<span class="caption" style="margin-bottom:32px; color:var(--danger);">4 Trik Cherry-Picking</span>
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--danger); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">1</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--danger);">Multi-direction signal</span></h3>
<p class="body" style="color:var(--muted);">Post "BUY AAPL" di channel A. Post "SELL AAPL" di channel B. Salah satu pasti profit. Screenshot yang win, delete yang loss. Dua channel, double illusion.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(73,21,193,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(73,21,193,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">05 / 09</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">2</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--primary);">Vague TP/SL</span></h3>
<p class="body" style="color:var(--muted);">"Entry 150-155" — harga touch 151 lalu drop. Screenshot "Entry 155" (never triggered). Claim win. Lo yang execute di 151? Lo loss sendirian.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<section class="slide carousel-slide" style="background: linear-gradient(to right, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(to bottom, rgba(26,26,26,0.04) 1px, transparent 1px) 0 0 / 48px 48px, var(--bg-white);">
<div class="number-badge">06 / 09</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--secondary); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">3</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--secondary);">Demo account screenshot</span></h3>
<p class="body" style="color:var(--muted);">Profit +$12,000 di screenshot. Platform demo. No slippage, no real money, no risk. Tapi screenshot look real — lo percaya.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<section class="slide carousel-slide" style="background: radial-gradient(circle at 20% 80%, rgba(16,185,129,0.08), transparent 50%), radial-gradient(circle at 80% 20%, rgba(16,185,129,0.05), transparent 40%), var(--bg); position:relative;">
<div class="number-badge">07 / 09</div>
<div style="content:''; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(26,26,26,0.08) 1px, transparent 1px); background-size:24px 24px; opacity:0.4; pointer-events:none;"></div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;">
<div class="soft-card">
<div style="width:80px; height:80px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Plus Jakarta Sans',sans-serif; font-size:48px; font-weight:800; flex-shrink:0;">4</div>
<div style="flex:1;">
<h3 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:44px; line-height:1.2; font-weight:800; margin-bottom:16px;"><span style="color:var(--accent);">Retroactive signal</span></h3>
<p class="body" style="color:var(--muted);">Post signal SETELAH harga move. "Sudah kami inform di grup VIP kemarin" — tapi ga ada bukti. Member gratis cuma lihat hasil, bukan process.</p>
</div>
</div>
</div>
<div class="brand-ribbon">@zeta_ai.pro</div>
</section>
<!-- Slide 8: Connector -->
<section class="slide carousel-slide" style="background: var(--bg-dark); color:var(--ink-on-dark);">
<div class="number-badge" style="color:rgba(255,255,255,0.6);">08 / 09</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:48px;">
<svg style="width:120px; height:120px;" viewBox="0 0 24 24" fill="none" stroke="var(--danger)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"/>
<line x1="15" y1="9" x2="9" y2="15"/>
<line x1="9" y1="9" x2="15" y2="15"/>
</svg>
<h2 class="quote-text" style="color:#fff; max-width:720px; font-size:80px;">Kalau signal <span style="color:var(--danger);">gratis work,</span> kenapa mereka jual premium?</h2>
<div style="width:24px; height:24px; background:var(--danger); border-radius:50%;"></div>
</div>
<div class="brand-ribbon" style="color:rgba(255,255,255,0.6);">@zeta_ai.pro</div>
</section>
<!-- Slide 9: CTA -->
<section class="slide carousel-slide" style="background: var(--danger); color:#fff;">
<div class="number-badge" style="color:rgba(255,255,255,0.7);">09 / 09</div>
<div style="flex:1; display:flex; flex-direction:column; justify-content:center; gap:48px;">
<div style="height:8px; width:120px; background:#fff; border-radius:4px; opacity:0.8;"></div>
<h2 style="font-family:'Plus Jakarta Sans',sans-serif; font-size:68px; line-height:1.15; font-weight:800; max-width:800px;">Save post ini.<br><span style="font-style:italic; font-family:'Crimson Pro',serif; font-size:76px;">Share ke trader pemula</span><br>yang masih percaya signal ajaib.</h2>
<p style="font-size:36px; line-height:1.4; opacity:0.9; max-width:720px;">Atau tag temen lo yang sering flex screenshot profit dari "mentor" — lo tau siapa.</p>
</div>
<div style="position:absolute; bottom:48px; left:80px; right:80px; display:flex; justify-content:space-between; align-items:center;">
<span style="font-size:32px; font-weight:800; letter-spacing:0.02em;">ZETA AI</span>
<span style="font-size:22px; opacity:0.8; letter-spacing:0.05em;">@zeta_ai.pro</span>
</div>
</section>
</body>
</html>
```
---
*(Carousel 4 & 5 akan mengikuti struktur yang sama dengan variety layout, hook archetype berbeda, dan palette rotation yang konsisten.)*