Page name
title strip
site.css canvas
site.css sheet
(3% reveal between)
injected band
Reused from site.css unchanged (the homepage r2 recipe, ADDENDUM 4):
.canvas-wrap watercolor canvas, fixed >900 / scroll repeat-y <=900,
3%-of-width reveal top and bottom
.sheet min(94%,1200) white 0.9, radius 2, 26px shadow, padding 48/36
(40/32 <=900; 28/12 + 8px side reveal <=600); .sheet + .sheet 3%
.pill the one button atom
.contact ... the prefooter band is the homepage band, stamped by
tools/inject_chrome.py (never hand-written on a page)
Added here:
.int-main hook only (no header offset needed: the masthead is in flow
above 900 and body already pads for the fixed bar below 900)
.int-title the 104px title strip
.int-sheet interior sheet hook (inner rhythm between sheet children)
.int-h2 .int-h3 .int-lede .int-prose the homepage's own type tiers, named
for interiors so the three waves cannot drift apart
.int-backrow centred pill row (hanoverendo-int/03 back pill)
.int-prefooter hook on the injected band
--------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------
TITLE STRIP : hanoverendo-int/00 mechanism, mvendo-int/00 cross-check.
Flat strip, page name only (no kicker, crumbs or imagery). Surface is
--teal-mist, not the precedents' grey: our one-hue material (interiors plan).
Height is content-derived exactly as hanoverendo authors it:
20 + line box (1.2) + 5 + 20 = 103.6 at 1440. H1 is hanoverendo's fluid
calc(20px + 2svw): 48.8px at 1440, 27.8 -> floored to 28px at 390 (plan value).
Ink: teal-deep on mist 8.84:1.
--------------------------------------------------------------------------- */
.int-title {
background: var(--teal-mist);
padding: 20px 20px;
display: flex; flex-direction: column; align-items: center; justify-content: center;
text-align: center;
}
.int-title h1 {
margin: 0 0 5px;
font-family: var(--font-display); font-weight: 400;
font-size: max(28px, calc(20px + 2vw)); /* fallback where svw is unknown */
font-size: max(28px, calc(20px + 2svw));
line-height: 1.2;
color: var(--teal-deep);
}
/* ---------------------------------------------------------------------------
SHEET INTERIOR RHYTHM. Sheet surface, width and padding are site.css's .sheet.
Inside an interior sheet, stacked blocks take the homepage's 24px beat.
--------------------------------------------------------------------------- */
.int-sheet > * + * { margin-top: 24px; }
/* ---------------------------------------------------------------------------
TYPE TIERS : the homepage's measured tiers under interior names.
.int-h2 = .doc-kicker Domine 36.56/40.2, -0.99, teal
.int-h3 = .doc-statement Domine 27.4/30.2, -0.99, teal-deep
.int-lede = .support-line Lato 700 16/27.2, teal-deep
.int-prose= .wl-body Lato 400 16/27.2, 14px paragraph beat
Display weight stays 400 (family law: contrast by face and colour, never bold).
--------------------------------------------------------------------------- */
.int-h2 {
font-family: var(--font-display); font-weight: 400;
font-size: 36.56px; line-height: 40.2px; letter-spacing: -0.99px; color: var(--teal);
margin: 0;
}
.int-h3 {
font-family: var(--font-display); font-weight: 400;
font-size: 27.4px; line-height: 30.2px; letter-spacing: -0.99px; color: var(--teal-deep);
margin: 0;
}
.int-lede { font-weight: 700; font-size: 16px; line-height: 27.2px; color: var(--teal-deep); }
.int-prose { font-size: 16px; line-height: 27.2px; }
.int-prose p, .int-prose ul, .int-prose ol { margin: 0 0 14px; }
.int-prose > :last-child { margin-bottom: 0; }
.int-prose ul, .int-prose ol { padding-left: 1.25em; }
.int-prose a { color: var(--teal); text-decoration: underline; }
/* back / onward pill row (hanoverendo-int/03): intrinsic pill width, centred */
.int-backrow { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; }
/* ---------------------------------------------------------------------------
PREFOOTER : humphries-int/08 = the homepage radial contact band WITHOUT the
map strip (the live map has one home, contact.html). Markup is stamped from
index.html by tools/inject_chrome.py; every visual value is site.css's
.contact recipe, so nothing is restyled here. Class B (house law): the form
survives at 390, where humphries/hanoverendo/mvendo display:none the band.
`.int-prefooter` is carried on the stamped