/* ============================================================
   iBeta Market — Home page (front-page.php)
   Designed against /design/Home _ Hero Beats 3D
   ============================================================ */

/* ===== HERO ===== */
.ib-home-hero {
	position: relative;
	background: linear-gradient(135deg, #0A1628 0%, #14243F 100%);
	color: #fff;
	overflow: hidden;
	margin-top: -20px; /* eat the front-page-only top padding */
}
.ib-home-hero__bg-pattern {
	position: absolute; inset: 0;
	background-image:
		linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
	background-size: 40px 40px;
	pointer-events: none;
}
.ib-home-hero__inner {
	position: relative;
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 48px;
	align-items: center;
	padding: 72px 32px 80px;
}
.ib-home-hero__copy { max-width: 560px; }
.ib-home-hero__eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 6px 14px;
	background: rgba(240,90,0,0.16);
	color: #FF9966;
	border: 1px solid rgba(240,90,0,0.35);
	border-radius: 999px;
	font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
.ib-home-hero__title {
	margin: 22px 0 18px;
	font-size: 64px; line-height: 1.05; letter-spacing: -0.035em;
	font-weight: 900; color: #fff;
}
.ib-home-hero__title span {
	background: linear-gradient(90deg, #FF7A2E 0%, #F05A00 100%);
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent;
}
.ib-home-hero__sub {
	font-size: 17px; line-height: 1.55; color: rgba(255,255,255,0.72);
	margin-bottom: 32px;
}
.ib-home-hero__stats {
	display: grid; grid-template-columns: repeat(3, auto);
	gap: 36px; margin-bottom: 32px;
}
.ib-home-hero__stat strong {
	display: block;
	font-size: 32px; font-weight: 900; color: #fff; letter-spacing: -0.03em;
	line-height: 1;
}
.ib-home-hero__stat span {
	font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
	color: rgba(255,255,255,0.55); margin-top: 6px; display: block;
}
.ib-home-hero__cta { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.ib-btn-hero-primary {
	display: inline-flex; align-items: center; gap: 10px;
	background: linear-gradient(135deg, #F05A00 0%, #D44800 100%);
	color: #fff; padding: 16px 26px; border-radius: 8px;
	font-weight: 700; font-size: 15px; letter-spacing: -0.01em;
	box-shadow: 0 6px 24px rgba(240,90,0,0.32);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.ib-btn-hero-primary:hover { transform: translateY(-1px); color: #fff; box-shadow: 0 10px 30px rgba(240,90,0,0.45); }
.ib-btn-hero-ghost {
	display: inline-flex; align-items: center; gap: 8px;
	background: transparent; color: #fff;
	border: 1px solid rgba(255,255,255,0.25);
	padding: 16px 22px; border-radius: 8px;
	font-weight: 600; font-size: 14px;
}
.ib-btn-hero-ghost:hover { color: #fff; background: rgba(255,255,255,0.08); }
.ib-home-hero__social {
	display: flex; align-items: center; gap: 14px; margin-top: 28px;
	color: rgba(255,255,255,0.65); font-size: 13px;
}
.ib-home-hero__social b { color: #fff; font-weight: 700; }
.ib-home-hero__rating {
	display: inline-flex; align-items: center; gap: 4px;
	background: rgba(245,158,11,0.16);
	color: #FFC857; padding: 3px 9px; border-radius: 6px;
	font-weight: 700; font-size: 12px;
}
.ib-home-hero__media {
	position: relative; display: flex; justify-content: center; align-items: center;
	min-height: 620px;
}
.ib-home-hero__model {
	width: 100%;
	max-width: 760px;
	height: 620px;
	background: transparent;
	--poster-color: transparent;
	filter: drop-shadow(0 30px 60px rgba(240,90,0,0.35));
}

/* Product card universal overrides moved to components.css so all archives use them. */

/* ===== CATEGORIES — punchy bento ===== */
.ib-home-cats { padding: 64px 0 32px; }
.ib-section-head {
	display: flex; justify-content: space-between; align-items: flex-end;
	margin-bottom: 24px; gap: 24px;
}
.ib-section-head h2 {
	font-size: 32px; letter-spacing: -0.025em; font-weight: 800;
}
.ib-section-head__sub {
	font-size: 14px; color: var(--ib-sub); margin-top: 4px;
}
.ib-section-head a {
	font-size: 14px; font-weight: 700; color: var(--ib-primary);
	display: inline-flex; align-items: center; gap: 6px;
}

.ib-cat-bento {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	grid-template-rows: 320px;  /* up from 280 — gives the featured card room for desc + CTA */
	gap: 16px;
}
.ib-cat-bento__card {
	position: relative;
	padding: 28px;
	border-radius: 10px;
	overflow: hidden;
	display: flex; flex-direction: column; justify-content: space-between;
	color: #fff;
	text-decoration: none;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	isolation: isolate; /* keep child stacking contained */
}
.ib-cat-bento__card::before {
	/* dotted texture overlay */
	content: ""; position: absolute; inset: 0; z-index: 0;
	background-image: radial-gradient(rgba(255,255,255,0.10) 1px, transparent 1px);
	background-size: 16px 16px;
	opacity: 0.7;
	pointer-events: none;
}
.ib-cat-bento__card > * { position: relative; z-index: 1; }
.ib-cat-bento__card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(10,22,40,0.18); color: #fff; }

/* Per-category gradients */
.ib-cat-bento__card--ordi {
	background: linear-gradient(135deg, #1F2937 0%, #0F172A 100%);
}
.ib-cat-bento__card--smart {
	background: linear-gradient(160deg, #1855CC 0%, #0F3A99 100%);
}
.ib-cat-bento__card--audio {
	background: linear-gradient(160deg, #F05A00 0%, #B83C00 100%);
}
.ib-cat-bento__card--acc {
	background: linear-gradient(160deg, #0F766E 0%, #064E3B 100%);
}

/* Featured (first) gets full row */
.ib-cat-bento__card--featured { grid-row: span 1; padding: 32px; }
/* Slightly tighter spacing on featured so desc + CTA fit comfortably */
.ib-cat-bento__card--featured .ib-cat-bento__icon { margin-bottom: 14px; }
.ib-cat-bento__card--featured .ib-cat-bento__name { font-size: 34px; margin-top: 4px; }
.ib-cat-bento__card--featured .ib-cat-bento__desc { font-size: 13px; margin-top: 4px; }

.ib-cat-bento__icon {
	width: 52px; height: 52px;
	border-radius: 8px;
	background: rgba(255,255,255,0.14);
	color: #fff;
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 18px;
}
.ib-cat-bento__card--featured .ib-cat-bento__icon { width: 64px; height: 64px; }

.ib-cat-bento__tag {
	display: inline-block;
	background: rgba(255,255,255,0.18);
	color: #fff;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 10px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase;
	margin-bottom: 10px;
}
.ib-cat-bento__card--featured .ib-cat-bento__tag {
	background: rgba(240,90,0,0.95); color: #fff;
}
.ib-cat-bento__name {
	font-size: 24px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; margin: 0;
	color: #fff;
}
.ib-cat-bento__card--featured .ib-cat-bento__name { font-size: 38px; }

.ib-cat-bento__meta {
	display: flex; align-items: baseline; gap: 8px;
	margin-top: 6px;
	color: rgba(255,255,255,0.82);
	font-size: 13px;
}
.ib-cat-bento__count {
	font-size: 22px; font-weight: 900; color: #fff;
	letter-spacing: -0.02em; line-height: 1;
}
.ib-cat-bento__card--featured .ib-cat-bento__count { font-size: 30px; }

.ib-cat-bento__desc {
	font-size: 13px; color: rgba(255,255,255,0.72);
	margin-top: 6px; line-height: 1.45;
}
.ib-cat-bento__card--featured .ib-cat-bento__desc { font-size: 14px; max-width: 360px; }

.ib-cat-bento__cta {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 13px; font-weight: 700;
	color: #fff;
	padding: 9px 16px;
	border-radius: 999px;
	background: rgba(255,255,255,0.16);
	width: max-content;
	transition: background 0.15s ease;
}
.ib-cat-bento__card:hover .ib-cat-bento__cta { background: rgba(255,255,255,0.28); }

/* Product peek — disabled while placeholder images are flat color cards.
   Re-enable when real product photography is available. */
.ib-cat-bento__peek { display: none; }

/* Decorative big number watermark behind copy */
.ib-cat-bento__watermark {
	position: absolute;
	top: -10px; left: -8px;
	font-size: 180px; font-weight: 900;
	color: rgba(255,255,255,0.05);
	letter-spacing: -0.05em;
	z-index: 0;
	pointer-events: none;
	line-height: 1;
}
.ib-cat-bento__card--featured .ib-cat-bento__watermark { font-size: 260px; }

/* ===== TRENDING ===== */
.ib-home-trends { padding: 48px 0 32px; background: var(--ib-soft); }
/* Force 4-up on home with !important — wins over the theme's 3-col default and
   responsive.css 2-col rule that fires at 1024px (we want 4 cols up to ~1100px). */
.ib-home-trends .ib-product-grid {
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 18px !important;
}
@media (max-width: 1100px) {
	.ib-home-trends .ib-product-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
	.ib-home-trends .ib-product-grid { grid-template-columns: 1fr !important; }
}
.ib-trend-eyebrow {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 11px; font-weight: 700; color: var(--ib-accent); letter-spacing: 0.12em;
	text-transform: uppercase; margin-bottom: 8px;
}
.ib-trend-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.ib-trend-tabs a {
	padding: 10px 18px; border-radius: 999px;
	background: var(--ib-white);
	border: 1px solid var(--ib-line);
	font-size: 13px; font-weight: 600; color: var(--ib-sub);
	transition: all 0.15s ease;
}
.ib-trend-tabs a:hover { color: var(--ib-primary); border-color: var(--ib-primary); }
.ib-trend-tabs a.is-active {
	background: var(--ib-ink); color: #fff; border-color: var(--ib-ink);
}

/* ===== PROMO BANNERS ===== */
.ib-home-promos { padding: 32px 0 48px; }
.ib-promo-grid {
	display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
}
.ib-promo {
	position: relative; overflow: hidden;
	padding: 32px;
	border-radius: var(--ib-r-lg);
	min-height: 200px;
	display: flex; flex-direction: column; justify-content: space-between;
}
.ib-promo--whitelist {
	background: linear-gradient(135deg, #1E1B4B 0%, #312E81 60%, #5B21B6 100%);
	color: #fff;
}
.ib-promo--whitelist:hover { color: #fff; }
.ib-promo--student {
	background: linear-gradient(135deg, #FFF7ED 0%, #FED7AA 100%);
	color: var(--ib-ink);
}
.ib-promo__eyebrow {
	display: inline-block;
	font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
	margin-bottom: 12px;
	padding: 4px 10px; border-radius: 6px;
}
.ib-promo--whitelist .ib-promo__eyebrow {
	background: rgba(255,255,255,0.15); color: #C4B5FD;
}
.ib-promo--student .ib-promo__eyebrow {
	background: rgba(240,90,0,0.18); color: var(--ib-accent);
}
.ib-promo__title { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; }
.ib-promo--whitelist .ib-promo__title { color: #fff; }
.ib-promo__desc { font-size: 14px; opacity: 0.85; margin-top: 8px; max-width: 380px; }
.ib-promo__cta {
	display: inline-flex; align-items: center; gap: 6px;
	margin-top: 18px; padding: 12px 20px; border-radius: 6px;
	font-size: 14px; font-weight: 700;
	background: #fff; color: var(--ib-ink);
	width: max-content;
}
.ib-promo--whitelist .ib-promo__cta { background: #fff; color: var(--ib-ink); }
.ib-promo--student .ib-promo__cta { background: var(--ib-ink); color: #fff; }

.ib-promo__decor {
	position: absolute; right: -30px; bottom: -30px;
	font-size: 180px; opacity: 0.10; line-height: 1;
}

/* ===== TRUST STRIP ===== */
.ib-home-trust { padding: 32px 0 64px; border-top: 1px solid var(--ib-line); }
.ib-trust-row {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px;
}
.ib-trust-item {
	display: flex; align-items: flex-start; gap: 14px;
}
.ib-trust-item__icon {
	width: 44px; height: 44px; border-radius: 6px;
	background: var(--ib-primary-lt); color: var(--ib-primary);
	display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.ib-trust-item__title { font-size: 14px; font-weight: 700; color: var(--ib-ink); }
.ib-trust-item__sub { font-size: 12px; color: var(--ib-sub); margin-top: 3px; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
	.ib-home-hero__inner { grid-template-columns: 1fr; padding: 56px 24px; }
	.ib-home-hero__media { min-height: 320px; }
	.ib-home-hero__title { font-size: 48px; }
	.ib-cat-bento { grid-template-columns: 1fr 1fr; grid-template-rows: 240px 240px; }
	.ib-cat-bento__card--featured { grid-column: span 2; }
	.ib-promo-grid { grid-template-columns: 1fr; }
	.ib-trust-row { grid-template-columns: 1fr 1fr; gap: 20px; }
}
@media (max-width: 640px) {
	.ib-home-hero__title { font-size: 36px; }
	.ib-home-hero__stats { gap: 18px; }
	.ib-home-hero__stat strong { font-size: 24px; }
	.ib-section-head { flex-direction: column; align-items: flex-start; }
	.ib-section-head h2 { font-size: 24px; }
	.ib-cat-bento { grid-template-columns: 1fr; grid-template-rows: repeat(4, 220px); }
	.ib-cat-bento__card--featured { grid-column: span 1; }
	.ib-trust-row { grid-template-columns: 1fr; }
}

/* ============================================================
   NEWSLETTER
   ============================================================ */
.ib-newsletter { padding: 64px 0 80px; }
.ib-newsletter__card {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(80% 80% at 100% 0%, rgba(110,91,240,.55), transparent 60%),
		radial-gradient(60% 60% at 0% 100%, rgba(15,58,153,.5), transparent 65%),
		linear-gradient(120deg, #0A1628 0%, #122F66 55%, #1855CC 100%);
	color: #fff;
	border-radius: 28px;
	padding: 60px 64px;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 56px;
	align-items: center;
	box-shadow: 0 26px 60px -28px rgba(15,58,153,.55);
}
.ib-newsletter__decor { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.ib-newsletter__decor-grid { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .55; }
.ib-newsletter__decor-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(40px);
	opacity: .55;
}
.ib-newsletter__decor-blob--a {
	width: 280px; height: 280px;
	top: -90px; right: -60px;
	background: radial-gradient(circle, rgba(255,118,170,.65), transparent 70%);
	animation: ib-nl-drift-a 18s ease-in-out infinite alternate;
}
.ib-newsletter__decor-blob--b {
	width: 320px; height: 320px;
	bottom: -120px; left: -80px;
	background: radial-gradient(circle, rgba(110,91,240,.55), transparent 70%);
	animation: ib-nl-drift-b 22s ease-in-out infinite alternate;
}
@keyframes ib-nl-drift-a {
	from { transform: translate(0,0) scale(1); }
	to   { transform: translate(-40px,30px) scale(1.1); }
}
@keyframes ib-nl-drift-b {
	from { transform: translate(0,0) scale(1); }
	to   { transform: translate(50px,-30px) scale(1.08); }
}

.ib-newsletter__copy { position: relative; z-index: 1; }
.ib-newsletter__eyebrow {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 11.5px; font-weight: 800;
	letter-spacing: .14em; text-transform: uppercase;
	color: #FFD371;
	margin-bottom: 18px;
}
.ib-newsletter__title {
	font-size: clamp(28px, 3.5vw, 42px);
	line-height: 1.08;
	letter-spacing: -0.025em;
	font-weight: 800;
	margin: 0 0 14px;
}
.ib-newsletter__title em {
	font-style: normal;
	background: linear-gradient(120deg, #FFD371 0%, #FF76AA 60%, #B69BFF 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.ib-newsletter__sub {
	font-size: 15px;
	line-height: 1.55;
	color: rgba(255,255,255,.78);
	margin: 0;
	max-width: 420px;
}

.ib-newsletter__form { position: relative; z-index: 1; }
.ib-newsletter__label {
	display: block;
	font-size: 11px; font-weight: 800;
	letter-spacing: .12em; text-transform: uppercase;
	color: rgba(255,255,255,.65);
	margin-bottom: 10px;
}
.ib-newsletter__row {
	display: flex; gap: 8px;
	padding: 6px;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.16);
	border-radius: 14px;
	backdrop-filter: blur(8px);
	transition: border-color .2s ease, box-shadow .2s ease;
}
.ib-newsletter__row:focus-within {
	border-color: rgba(255,255,255,.4);
	box-shadow: 0 0 0 4px rgba(255,255,255,.10);
}
.ib-newsletter__input {
	flex: 1;
	min-width: 0;
	background: transparent;
	border: none;
	outline: none;
	color: #fff;
	font-size: 15px;
	font-family: inherit;
	padding: 12px 14px;
}
.ib-newsletter__input::placeholder { color: rgba(255,255,255,.45); }
.ib-newsletter__btn {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 12px 22px;
	background: #fff;
	color: #0A1628;
	border: none;
	border-radius: 9px;
	font-size: 13.5px;
	font-weight: 800;
	letter-spacing: .04em;
	cursor: pointer;
	transition: transform .15s ease, background .2s ease;
	flex-shrink: 0;
}
.ib-newsletter__btn:hover { transform: translateX(2px); }
.ib-newsletter__btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }
.ib-newsletter__btn[data-loading="1"] .ib-newsletter__btn-label::after {
	content: '…';
	margin-left: 2px;
}

.ib-newsletter__hint {
	font-size: 12px;
	color: rgba(255,255,255,.55);
	margin-top: 12px;
	line-height: 1.5;
}
.ib-newsletter__hint a { color: rgba(255,255,255,.85); text-decoration: underline; text-underline-offset: 2px; }

.ib-newsletter__msg {
	margin-top: 14px;
	font-size: 13.5px;
	font-weight: 600;
	min-height: 20px;
	transition: opacity .2s ease;
}
.ib-newsletter__msg.is-success { color: #B6F2C9; }
.ib-newsletter__msg.is-error   { color: #FFB4B4; }

@media (max-width: 960px) {
	.ib-newsletter__card { grid-template-columns: 1fr; gap: 30px; padding: 44px 32px; }
}
@media (max-width: 640px) {
	.ib-newsletter { padding: 48px 0 64px; }
	.ib-newsletter__card { padding: 36px 22px; border-radius: 22px; }
	.ib-newsletter__row { flex-direction: column; gap: 6px; }
	.ib-newsletter__btn { justify-content: center; }
}