/* Kinetic Frame Studios - Investor Relations styles
   Palette sampled from reference site screenshot */

:root {
	--kfs-bg: #ffffff;
	--kfs-bg-mint: #eef8f1;
	--kfs-bg-lavender: #f5f2fa;
	--kfs-bg-cream: #f6eef3;
	--kfs-bg-alt: #eef8f1;      /* default alt = mint, kept for back-compat */
	--kfs-card: #ffffff;
	--kfs-card-border: #e6e2ee;
	--kfs-navy: #130031;        /* headings */
	--kfs-text: #2e2e38;        /* body copy */
	--kfs-text-muted: #6b7280;
	--kfs-green: #178342;
	--kfs-green-light: #22a85a;
	--kfs-gold: #c9972b;
	--kfs-gold-light: #e0b04f;
	--kfs-purple: #8c67ba;
	--kfs-shadow: 0 2px 14px rgba(19,0,49,0.06);
}

body { color: var(--kfs-text); }

.kfs-grid {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	margin: 24px 0;
}

.kfs-card {
	background: var(--kfs-card);
	border: 1px solid var(--kfs-card-border);
	border-radius: 12px;
	overflow: hidden;
	color: var(--kfs-text);
	box-shadow: var(--kfs-shadow);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.kfs-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 24px rgba(19,0,49,0.10);
}
.kfs-card-body { padding: 18px 20px 22px; }

/* Movies */
.kfs-movie-poster img { width: 100%; display: block; aspect-ratio: 2/3; object-fit: cover; }
.kfs-badge {
	display: inline-block;
	background: var(--kfs-green);
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 3px 10px;
	border-radius: 999px;
	margin-bottom: 10px;
}
.kfs-movie-title { margin: 0 0 6px; font-size: 20px; color: var(--kfs-navy); }
.kfs-movie-meta { color: var(--kfs-text-muted); font-size: 13px; margin: 0 0 10px; }
.kfs-movie-excerpt { font-size: 14px; line-height: 1.5; margin-bottom: 10px; }
.kfs-movie-cast { font-size: 13px; color: var(--kfs-text-muted); margin-bottom: 14px; }
.kfs-progress {
	background: #e3eee7;
	border-radius: 999px;
	height: 8px;
	overflow: hidden;
	margin-bottom: 6px;
}
.kfs-progress-bar {
	height: 100%;
	background: linear-gradient(90deg, var(--kfs-green), var(--kfs-green-light));
}
.kfs-progress-label { font-size: 12px; color: var(--kfs-text-muted); margin: 0; }

/* Plans */
.kfs-plan-card { padding: 26px 24px; text-align: left; }
.kfs-plan-title { margin: 0 0 10px; font-size: 20px; color: var(--kfs-navy); }
.kfs-plan-content { font-size: 14px; color: var(--kfs-text-muted); margin-bottom: 16px; }
.kfs-plan-facts { list-style: none; margin: 0; padding: 0; }
.kfs-plan-facts li {
	display: flex;
	justify-content: space-between;
	padding: 8px 0;
	border-top: 1px solid var(--kfs-card-border);
	font-size: 13px;
}
.kfs-plan-facts li span { color: var(--kfs-text-muted); }
.kfs-plan-facts li strong { color: var(--kfs-navy); font-weight: 600; }

/* Investors */
.kfs-investor-card {
	text-align: center;
	padding: 24px 16px;
	position: relative;
}
.kfs-investor-rank {
	position: absolute;
	top: 10px;
	left: 12px;
	font-size: 12px;
	color: var(--kfs-gold);
	font-weight: 700;
}
.kfs-investor-photo {
	width: 84px;
	height: 84px;
	margin: 10px auto 14px;
	border-radius: 50%;
	overflow: hidden;
	border: 3px solid var(--kfs-bg-alt);
}
.kfs-investor-photo img { width: 100%; height: 100%; object-fit: cover; }
.kfs-investor-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--kfs-green);
	color: #fff;
	font-size: 28px;
	font-weight: 700;
}
.kfs-investor-name { margin: 0 0 2px; font-size: 16px; color: var(--kfs-navy); }
.kfs-investor-role { margin: 0 0 8px; font-size: 12px; color: var(--kfs-text-muted); }
.kfs-investor-amount { margin: 0; font-size: 15px; font-weight: 700; color: var(--kfs-green); }

/* Testimonials */
.kfs-testimonial-card { padding: 24px; }
.kfs-stars { margin-bottom: 10px; }
.kfs-star { color: #e5e7eb; font-size: 16px; }
.kfs-star-filled { color: var(--kfs-gold); }
.kfs-testimonial-quote { font-size: 14px; line-height: 1.6; font-style: italic; margin-bottom: 16px; color: var(--kfs-text); }
.kfs-testimonial-author { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.kfs-testimonial-avatar { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; }
.kfs-testimonial-avatar img { width: 100%; height: 100%; object-fit: cover; }
.kfs-testimonial-author strong { color: var(--kfs-navy); }
.kfs-testimonial-author span { display: block; color: var(--kfs-text-muted); font-size: 12px; }

/* FAQ */
.kfs-faq-list { max-width: 760px; margin: 24px auto; }
.kfs-faq-item {
	border-bottom: 1px solid var(--kfs-card-border);
}
.kfs-faq-question {
	width: 100%;
	background: none;
	border: none;
	text-align: left;
	color: var(--kfs-navy);
	font-size: 16px;
	font-weight: 600;
	padding: 18px 4px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.kfs-faq-icon { color: var(--kfs-green); font-size: 20px; transition: transform 0.2s ease; }
.kfs-faq-item.kfs-open .kfs-faq-icon { transform: rotate(45deg); }
.kfs-faq-answer {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.25s ease;
	font-size: 14px;
	color: var(--kfs-text-muted);
	line-height: 1.6;
}
.kfs-faq-item.kfs-open .kfs-faq-answer {
	max-height: 500px;
	padding-bottom: 18px;
}

.kfs-empty { color: var(--kfs-text-muted); font-style: italic; }

/* Homepage template */
.kfs-home { background: var(--kfs-bg); color: var(--kfs-text); }

.kfs-hero {
	padding: 110px 24px;
	text-align: center;
	background:
		radial-gradient(ellipse at top, rgba(140,103,186,0.10), transparent 60%),
		linear-gradient(180deg, var(--kfs-bg-lavender), #ffffff);
	border-bottom: 1px solid var(--kfs-card-border);
}
.kfs-hero-inner { max-width: 760px; margin: 0 auto; }
.kfs-hero h1 {
	font-size: clamp(32px, 5vw, 54px);
	margin: 0 0 18px;
	line-height: 1.15;
	color: var(--kfs-navy);
}
.kfs-hero p { font-size: 18px; color: var(--kfs-text-muted); margin: 0 0 32px; line-height: 1.6; }

.kfs-btn {
	display: inline-block;
	padding: 14px 28px;
	border-radius: 6px;
	font-weight: 700;
	text-decoration: none;
	margin: 0 8px 8px;
	font-size: 15px;
}
.kfs-btn-primary { background: var(--kfs-green); color: #ffffff; }
.kfs-btn-primary:hover { background: var(--kfs-green-light); }
.kfs-btn-ghost { border: 1px solid var(--kfs-card-border); color: var(--kfs-navy); }
.kfs-btn-ghost:hover { border-color: var(--kfs-green); color: var(--kfs-green); }

.kfs-stats-bar {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	background: var(--kfs-navy);
	border-bottom: 1px solid var(--kfs-card-border);
}
.kfs-stat {
	text-align: center;
	padding: 34px 12px;
	border-right: 1px solid rgba(255,255,255,0.12);
}
.kfs-stat:last-child { border-right: none; }
.kfs-stat strong { display: block; font-size: 30px; color: var(--kfs-gold); margin-bottom: 4px; }
.kfs-stat span { font-size: 13px; color: rgba(255,255,255,0.7); text-transform: uppercase; letter-spacing: 0.06em; }

.kfs-section { padding: 80px 24px; max-width: 1180px; margin: 0 auto; }
.kfs-section-alt { background: var(--kfs-bg-mint); max-width: none; }
.kfs-section-alt > * { max-width: 1180px; margin-left: auto; margin-right: auto; }
.kfs-section-cream { background: var(--kfs-bg-cream); max-width: none; }
.kfs-section-cream > * { max-width: 1180px; margin-left: auto; margin-right: auto; }
.kfs-section-head { text-align: center; max-width: 640px; margin: 0 auto 20px; }
.kfs-section-head h2 { font-size: 30px; margin: 0 0 10px; color: var(--kfs-navy); }
.kfs-section-head p { color: var(--kfs-text-muted); margin: 0; }

.kfs-final-cta {
	text-align: center;
	padding: 90px 24px;
	background: linear-gradient(180deg, var(--kfs-bg-lavender), #ffffff);
	border-top: 1px solid var(--kfs-card-border);
}
.kfs-final-cta h2 { font-size: 30px; margin: 0 0 12px; color: var(--kfs-navy); }
.kfs-final-cta p { color: var(--kfs-text-muted); margin: 0 0 26px; }

@media (max-width: 640px) {
	.kfs-stats-bar { grid-template-columns: repeat(2, 1fr); }
	.kfs-stat:nth-child(2) { border-right: none; }
}
