/* =========================================================================
   lumelume — shared header and footer for pages still on styles.css
   -------------------------------------------------------------------------
   Pages that have not yet moved to the launch system (system: "ll") load this
   on top of styles.css, so every page carries the same lumelume header and
   footer and nothing links back to the old "Our programme" navigation.
   Everything is scoped to .ann / .hd / .ft so it cannot restyle page bodies.
   Values mirror ll.css; when the last page moves to ll.css, delete this file.
   ========================================================================= */
.ann, .hd, .ft, .ll-skip {
  --c-gesso: #F6EEE3; --c-espresso: #33241C; --c-espresso-2: #241912; --c-pist: #BCC79C;
  --c-line: #E2D3C0; --c-white: #FFFFFF; --c-on-dark-2: #C9B6A0;
  font-family: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.ll-wrap { max-width: 1240px; margin-inline: auto; padding-inline: clamp(20px, 4vw, 40px); }
.ll-skip { position: absolute; left: 12px; top: 12px; transform: translateY(-200%); background: var(--c-espresso); color: var(--c-gesso); padding: 10px 14px; border-radius: 8px; z-index: 50; }
.ll-skip:focus { transform: none; }
.ann .svgi, .hd .svgi, .ft .svgi { width: 15px; height: 15px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }

.ann { background: var(--c-espresso); color: var(--c-gesso); font-weight: 500; font-size: .875rem; line-height: 1.3; }
.ann__in { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 22px; padding-block: 10px; text-align: center; }
.ann span { display: inline-flex; align-items: center; gap: 7px; }
.ann .svgi { color: var(--c-pist); }

.hd { background: var(--c-gesso); border-bottom: 1px solid var(--c-line); position: sticky; top: 0; z-index: 30; color: var(--c-espresso); }
.hd__in { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; }
.hd__logo img { height: 30px; width: auto; display: block; }
.hd__nav { display: flex; gap: clamp(16px, 2.2vw, 30px); font-weight: 500; font-size: .9688rem; }
.hd__nav a { text-decoration: none; padding-block: 8px; color: inherit; }
.hd__nav a:hover { text-decoration: underline; }
.hd__end { display: flex; align-items: center; gap: 10px; }
.hd .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 18px; border-radius: 12px; background: var(--c-espresso); color: var(--c-gesso); font: 600 .9688rem/1 "Work Sans", system-ui, sans-serif; text-decoration: none; border: 2px solid var(--c-espresso); box-shadow: none; transform: none; white-space: nowrap; }
.hd .btn:hover { background: var(--c-espresso-2); border-color: var(--c-espresso-2); }
.hd .btn--ghost { background: transparent; color: var(--c-espresso); }
.hd .btn--ghost:hover { background: var(--c-espresso); color: var(--c-gesso); }
.hd__short { display: none; }
.menu { display: none; position: relative; }
.menu summary { list-style: none; cursor: pointer; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; border: 1.5px solid var(--c-espresso); }
.menu summary::-webkit-details-marker { display: none; }
.menu summary svg { width: 20px; height: 20px; }
.menu nav { position: absolute; right: 0; top: calc(100% + 10px); min-width: 240px; display: grid; background: var(--c-white); border-radius: 14px; padding: 8px; box-shadow: 0 18px 40px -16px rgba(36,25,18,.35); }
.menu nav a { padding: 12px 14px; border-radius: 8px; text-decoration: none; font-weight: 500; color: var(--c-espresso); }
.menu nav a:hover { background: var(--c-gesso); }
@media (max-width: 960px) { .hd__nav, .hd .hd__login { display: none; } .menu { display: block; } .hd__logo img { height: 26px; } }
@media (max-width: 520px) { .hd__long { display: none; } .hd__short { display: inline; } }

.ft { background: var(--c-espresso-2); color: var(--c-gesso); padding-block: clamp(56px, 7vw, 80px) 36px; }
.ft h2, .ft p { margin: 0; }
.ft__grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 32px; }
.ft__about { display: grid; gap: 16px; align-content: start; color: var(--c-on-dark-2); font-size: .9688rem; max-width: 34ch; }
.ft__about img { height: 30px; width: auto; display: block; }
.ft__col { display: grid; gap: 10px; align-content: start; font-size: .9688rem; }
.ft__col h2 { font: 600 .875rem/1.4 "Work Sans", system-ui, sans-serif; color: var(--c-on-dark-2); margin-bottom: 4px; letter-spacing: 0; }
.ft__col a { text-decoration: none; color: var(--c-gesso); }
.ft__col a:hover { text-decoration: underline; }
.ft__legal { margin-top: 48px; padding-top: 20px; border-top: 1px solid rgba(246,238,227,.14); display: grid; gap: 8px; font-size: .8438rem; color: var(--c-on-dark-2); }
@media (max-width: 600px) { .ft__grid { grid-template-columns: 1fr 1fr; } .ft__about { grid-column: 1 / -1; } }

/* Apple-design pass, 9 Oct 2026 — mirrors ll.css for pages still on styles.css */
.hd { background: rgba(246, 238, 227, .82); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); }
@supports (animation-timeline: scroll()) {
  .hd { border-bottom-color: transparent; animation: hd-edge-c linear both; animation-timeline: scroll(root); animation-range: 0 72px; }
  @keyframes hd-edge-c { to { border-bottom-color: var(--c-line); box-shadow: 0 10px 24px -20px rgba(36,25,18,.45); } }
}
.hd .btn { transition: transform 100ms ease-out, background-color 150ms ease-out, color 150ms ease-out; }
.hd .btn:active { transform: scale(.97); }
.menu summary { transition: transform 100ms ease-out; }
.menu summary:active { transform: scale(.94); }
.menu nav { transform-origin: top right; }
.menu[open] nav { animation: menu-in-c 180ms cubic-bezier(.2, .8, .2, 1); }
@keyframes menu-in-c { from { opacity: 0; transform: translateY(-6px) scale(.96); } }
.hd__nav a[aria-current="page"], .menu nav a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .4em; }
.ann { letter-spacing: .01em; }
@media (prefers-reduced-transparency: reduce) { .hd { background: var(--c-gesso); -webkit-backdrop-filter: none; backdrop-filter: none; border-bottom-color: var(--c-line); } }
@media (prefers-contrast: more) { .hd { background: var(--c-gesso); -webkit-backdrop-filter: none; backdrop-filter: none; border-bottom: 1px solid var(--c-espresso); } }
@media (prefers-reduced-motion: reduce) { .hd .btn:active, .menu summary:active { transform: none; } .menu[open] nav { animation: none; } .hd { animation: none; border-bottom-color: var(--c-line); } }
@media (max-width: 760px) {
}

/* top bar: three items on desktop, one short line on phones */
.ann .ann__m { display: none; }
@media (max-width: 760px) { .ann .ann__m { display: inline-flex; } .ann .ann__in > span:not(.ann__m) { display: none; } }