body[data-page="codex-examples"] .ha-hero h1 { max-width: 15ch; }
.example-intro { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 7vw, 96px); align-items: start; }
.example-intro p { margin-top: 0; }
.privacy-standard { padding: clamp(24px, 4vw, 42px); background: var(--ha-mist); border-left: 3px solid var(--ha-sand); }
.privacy-standard strong { display: block; margin-bottom: 10px; color: var(--ha-abyss); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.example-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 38px; }
.example-card { display: flex; flex-direction: column; padding: clamp(26px, 4vw, 42px); background: #fffdf8; border: 1px solid rgba(6, 52, 66, .14); border-top: 2px solid var(--ha-sand); box-shadow: 0 18px 42px rgba(6, 52, 66, .045); }
.example-card .example-type { margin: 0 0 16px; color: #806947; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.example-card h3 { margin-bottom: 12px; }
.example-card > p { margin: 0 0 18px; color: #425a60; }
.example-card blockquote { margin: 8px 0 22px; padding: 22px 0 22px 24px; border-left: 2px solid var(--ha-sand); color: var(--ha-abyss); font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(1.25rem, 2vw, 1.65rem); line-height: 1.42; }
.example-card .example-boundary { margin-top: auto; padding-top: 18px; border-top: 1px solid rgba(6, 52, 66, .13); font-size: 12px; line-height: 1.65; }
.year-map { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 25px 0; }
.year-map div { padding: 20px; background: var(--ha-foam); border-top: 2px solid var(--ha-sand); }
.year-map span { display: block; margin-bottom: 7px; color: #806947; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.year-map strong { color: var(--ha-abyss); font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.35rem; font-weight: 500; }
.example-actions { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
@media (max-width: 760px) {
  .example-intro, .example-grid { grid-template-columns: 1fr; }
  .year-map { grid-template-columns: 1fr; }
}