TudorandClaude Opus 5
f614414070
The site had no author, no statement of why it exists and nobody accountable for its numbers, which is most of why it reads as machine generated. The page states plainly that its author is not an education expert. The credibility claim is lived experience — a parent going through primary admissions — plus stated provenance for every figure, which is true and cannot be undermined by someone noticing there is no teaching qualification behind it. First name only: the Person JSON-LD carries no familyName, worksFor or affiliation, and a test asserts it stays that way. The footer gains a fourth column, with a tablet breakpoint so four columns pair up rather than crushing before the 768px collapse. The nav is deliberately untouched — its mobile tab bar already carries four items. public/brand/tudor.jpg is NOT in this commit. The page references it and will show a broken image until the photograph is supplied; a stock portrait would defeat the entire point of the work. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_017YmbBhr8s7GusjDE12hrZM
84 lines
1.4 KiB
CSS
84 lines
1.4 KiB
CSS
.page {
|
|
max-width: 42rem;
|
|
margin: 0 auto;
|
|
padding: 2.5rem 1.25rem 4rem;
|
|
}
|
|
|
|
.header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1.25rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.portrait {
|
|
border-radius: 50%;
|
|
border: 2px solid var(--border);
|
|
object-fit: cover;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.kicker {
|
|
font-family: var(--font-ui);
|
|
font-size: 0.75rem;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.06em;
|
|
color: var(--brand);
|
|
margin: 0 0 0.35rem;
|
|
}
|
|
|
|
.heading {
|
|
font-family: var(--font-display);
|
|
font-size: clamp(1.5rem, 4vw, 2rem);
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
color: var(--text-primary);
|
|
margin: 0;
|
|
}
|
|
|
|
.subheading {
|
|
font-family: var(--font-display);
|
|
font-size: 1.15rem;
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin: 2.25rem 0 0.75rem;
|
|
}
|
|
|
|
.prose p {
|
|
font-family: var(--font-ui);
|
|
font-size: 1rem;
|
|
line-height: 1.7;
|
|
color: var(--text-secondary);
|
|
margin: 0 0 1.1rem;
|
|
}
|
|
|
|
/* The opening paragraph carries the page. Larger, and in the primary ink
|
|
rather than the secondary, so it reads as a voice rather than as body copy. */
|
|
.lede {
|
|
font-size: 1.125rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.prose .lede {
|
|
font-size: 1.125rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.link {
|
|
color: var(--brand);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.link:hover {
|
|
color: var(--brand-strong);
|
|
}
|
|
|
|
@media (max-width: 480px) {
|
|
.header {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 1rem;
|
|
}
|
|
}
|