.seo-redesign {
	background: #f7fafc;
	color: #263b4e;
}

.seo-redesign .seo-hero {
	padding: 86px 0 72px;
	background: #263b4e;
	color: #fff;
}

.seo-redesign .seo-hero .eyebrow { color: #f2c95f; }
.seo-redesign .seo-hero h1 { max-width: 850px; margin: 0 0 18px; color: #fff; font-size: clamp(38px, 5vw, 64px); line-height: 1.15; }
.seo-redesign .seo-hero p:not(.eyebrow) { max-width: 720px; margin: 0; color: #c9d9e2; font-size: 17px; }
.seo-redesign .seo-crumb { border-bottom: 1px solid #dce8ef; background: #fff; }
.seo-redesign .seo-crumb .site-shell { padding: 16px 0; color: #7890a1; font-size: 13px; }
.seo-redesign .seo-crumb a { color: #b7355d; }
.seo-redesign .seo-body { padding: 74px 0 100px; }
.seo-redesign .seo-intro { display: grid; grid-template-columns: .7fr 1.3fr; gap: 82px; margin-bottom: 55px; }
.seo-redesign .seo-intro h2 { margin: 0; color: #263b4e; font-size: clamp(28px, 4vw, 44px); line-height: 1.2; }
.seo-redesign .seo-intro p { margin: 0; color: #607688; font-size: 16px; line-height: 1.95; }
.seo-redesign .seo-blocks { display: grid; gap: 1px; border-top: 1px solid #d9e6ed; background: #d9e6ed; }
.seo-redesign .seo-block { display: grid; grid-template-columns: 100px 1fr 220px; gap: 28px; padding: 30px; background: #fff; }
.seo-redesign .seo-block:hover { background: #fff9f4; }
.seo-redesign .seo-num { color: #e55679; font-size: 13px; font-weight: 700; letter-spacing: 1px; }
.seo-redesign .seo-block h2, .seo-redesign .seo-block h3 { margin: 0 0 11px; color: #263b4e; font-size: 22px; }
.seo-redesign .seo-block p { margin: 0 0 12px; color: #64798a; font-size: 15px; line-height: 1.9; }
.seo-redesign .seo-note { align-self: start; padding: 15px; border-left: 3px solid #71aec8; color: #607688; background: #eff8fb; font-size: 13px; line-height: 1.7; }
.seo-redesign .seo-note b { display: block; margin-bottom: 5px; color: #356d91; }
.seo-redesign .seo-callout { margin-top: 42px; padding: 30px; border: 1px solid #f0d7df; background: #fff2f5; }
.seo-redesign .seo-callout h2 { margin: 0 0 12px; color: #b7355d; font-size: 24px; }
.seo-redesign .seo-callout p { margin: 0; color: #64798a; line-height: 1.9; }
.seo-redesign .seo-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 30px; }
.seo-redesign .seo-columns article { padding: 22px; border: 1px solid #dce8ef; background: #fff; }
.seo-redesign .seo-columns h3 { margin: 0 0 9px; font-size: 18px; }
.seo-redesign .seo-columns p { margin: 0; color: #687d8e; font-size: 14px; line-height: 1.8; }
@media (max-width: 800px) { .seo-redesign .seo-intro, .seo-redesign .seo-block { grid-template-columns: 1fr; gap: 16px; } .seo-redesign .seo-note { max-width: 360px; } .seo-redesign .seo-columns { grid-template-columns: 1fr; } }

.page-programs .seo-hero { background: #31566b; }
.page-programs .seo-blocks { grid-template-columns: repeat(2, 1fr); border: 0; gap: 16px; background: transparent; }
.page-programs .seo-block { display: block; min-height: 300px; border: 1px solid #d9e6ed; }
.page-programs .seo-num { display: block; margin-bottom: 40px; }
.page-programs .seo-note { margin-top: 22px; }

.page-recommend .seo-hero { background: #8f4c68; }
.page-recommend .seo-blocks { border: 0; gap: 16px; background: transparent; }
.page-recommend .seo-block { grid-template-columns: 80px 1fr; border-left: 6px solid #f2c95f; }
.page-recommend .seo-note { grid-column: 2; max-width: 360px; }

.page-guide .seo-hero { background: #4b7890; }
.page-guide .seo-blocks { border: 0; gap: 0; background: transparent; }
.page-guide .seo-block { grid-template-columns: 100px 1fr; border-bottom: 1px dashed #a9c3d0; background: transparent; }
.page-guide .seo-note { grid-column: 2; max-width: 360px; margin-top: 8px; }

.page-app .seo-hero { background: #426879; }
.page-app .seo-body { background: #fff8e9; }
.page-app .seo-block { border-color: #eadfbd; background: #fffdf7; }
.page-app .seo-note { background: #fff3ca; border-color: #e3b943; }

.page-advantage .seo-hero { background: #2f6370; }
.page-advantage .seo-intro { padding: 30px; border: 1px solid #d7e8e7; background: #eef9f7; }
.page-advantage .seo-blocks { border: 0; gap: 14px; background: transparent; }
.page-advantage .seo-block { grid-template-columns: 70px 1fr 190px; border: 1px solid #d7e8e7; }

.page-download .seo-hero { background: #5d526e; }
.page-download .seo-intro { grid-template-columns: 1fr; max-width: 820px; padding-bottom: 28px; border-bottom: 4px solid #f2c95f; }
.page-download .seo-block { grid-template-columns: 80px 1fr 170px; }
.page-download .seo-note { background: #f4effa; border-color: #a18db9; }

.page-community .seo-hero { background: #253d52; }
.page-community .seo-body { background: #edf3f6; }
.page-community .seo-block { border: 0; border-top: 5px solid #71aec8; }
.page-community .seo-callout { border-color: #b6dce6; background: #e7f6fa; }

.page-about .seo-hero { background: #a75b70; }
.page-about .seo-intro { grid-template-columns: 1fr .9fr; align-items: center; padding: 34px; background: #fff3f5; border-left: 7px solid #e55679; }
.page-about .about-intro-copy { display: grid; gap: 18px; }
.page-about .about-brand-visual { display: grid; justify-items: center; gap: 10px; margin: 0; color: #a75b70; font-size: 13px; font-weight: 700; }
.page-about .about-brand-visual img { width: 180px; height: 180px; border: 1px solid #efd8de; border-radius: 50%; object-fit: cover; background: #fff; }
.page-about .seo-blocks { border: 0; gap: 18px; background: transparent; }
.page-about .seo-block { grid-template-columns: 85px 1fr; border: 1px solid #efd8de; background: #fff; }
.page-about .seo-note { grid-column: 2; }

.page-privacy .seo-hero,
.page-agreement .seo-hero { background: #53636d; }
.page-privacy .seo-body,
.page-agreement .seo-body { background: #f2f0ea; }
.page-privacy .seo-block,
.page-agreement .seo-block { grid-template-columns: 95px 1fr 200px; border-color: #ddd8ca; background: #fffef9; }
.page-privacy .seo-note,
.page-agreement .seo-note { background: #f6f3e9; border-color: #a99b79; }

/* Keep every non-home hero visually consistent with the creator-space page. */
.seo-redesign .seo-hero { display: flex; align-items: center; box-sizing: border-box; height: 360px; padding: 48px 0; background: #253d52; }

@media (max-width: 800px) {
	.seo-redesign .seo-hero,
	.seo-hero { height: auto; min-height: 280px; padding: 56px 0; }
}