nate/Siteforge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance study hero section prominence with larger typography and visual hierarchy

Browse Source
This commit is contained in:
nmemmert
2026-05-12 13:33:20 -04:00
parent e60c1fb8f9
commit c91e23a0bb
1 changed files with 65 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.css
+65 -11
View File
@@ -1008,40 +1008,76 @@
}
.section-study-course-hero {
padding: 4.5rem 0 1.5rem;
padding: 6.5rem 0 3rem;
background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(201, 168, 76, 0.03) 40%, transparent 100%);
border-bottom: 1px solid rgba(201, 168, 76, 0.12);
}
.study-course-hero-inner {
max-width: 860px;
max-width: 920px;
}
.study-course-hero-inner .eyebrow {
font-size: 1.1rem;
letter-spacing: 0.28em;
}
.study-course-hero-inner h1 {
font-size: clamp(2.4rem, 5.2vw, 4.2rem);
line-height: 1.1;
margin: 0.5rem 0 1rem !important;
text-shadow: 0 0 50px rgba(201, 168, 76, 0.2);
}
.study-course-hero-copy {
max-width: 66ch;
margin: 0.85rem 0 1.5rem;
max-width: 70ch;
margin: 1.2rem 0 2rem;
color: var(--brand-muted);
font-size: 1.15rem;
line-height: 1.7;
}
.study-course-meta {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 1.25rem;
gap: 0.65rem;
margin-bottom: 2rem;
}
.study-course-meta span {
padding: 0.4rem 0.65rem;
border: 1px solid rgba(201, 168, 76, 0.28);
padding: 0.5rem 0.85rem;
border: 1px solid rgba(201, 168, 76, 0.35);
border-radius: 999px;
color: var(--brand-warm-white);
font-size: 0.78rem;
letter-spacing: 0.08em;
font-size: 0.82rem;
font-weight: 500;
letter-spacing: 0.1em;
text-transform: uppercase;
background: rgba(201, 168, 76, 0.08);
}
.study-course-hero-actions {
display: flex;
gap: 0.75rem;
gap: 1rem;
flex-wrap: wrap;
align-items: center;
}
.study-course-hero-actions .btn-primary {
font-size: 1.05rem;
padding: 0.85rem 2.2rem;
letter-spacing: 0.1em;
}
.study-course-hero-actions .btn-secondary {
font-size: 1.05rem;
padding: 0.85rem 2.2rem;
letter-spacing: 0.1em;
}
.study-course-hero-actions .btn-start-here {
font-size: 0.92rem;
opacity: 0.85;
}
.section-study-hub-flow {
@@ -1464,6 +1500,24 @@
}
@media (max-width: 840px) {
.section-study-course-hero {
padding: 4.5rem 0 2rem;
}
.study-course-hero-actions {
gap: 0.75rem;
}
.study-course-hero-actions .btn-primary,
.study-course-hero-actions .btn-secondary {
font-size: 0.95rem;
padding: 0.75rem 1.8rem;
}
.study-course-hero-actions .btn-start-here {
flex-basis: 100%;
}
.study-hub-flow-grid {
grid-template-columns: 1fr;
}