/* ===== events, desktop: poster + agenda ===== */
  .dw-body.dwb { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 22px; padding: 22px; }
  .dwb-left { min-width: 0; }
  .dwb-poster { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; min-height: 540px; border-radius: 24px; overflow: hidden; color: #FBF7EE; cursor: pointer; background: #1C1810; }
  .dwb-poster > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
  .dwb-poster:hover > img { transform: scale(1.03); }
  .dwb-poster::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20,15,10,.15) 25%, rgba(20,15,10,.88)); }
  .dwb-in { animation: dwbIn .35s ease; } @keyframes dwbIn { from { opacity: 0; transform: scale(.985); } }
  .dwb-stub { position: absolute; top: 22px; left: 22px; background: #FBF7EE; color: #1C1810; border-radius: 18px; padding: 10px 16px 12px; text-align: center; line-height: 1; box-shadow: 0 10px 24px -12px rgba(0,0,0,.6); }
  .dwb-stub small { display: block; font: 800 11px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cedar); }
  .dwb-stub b { display: block; font: 400 46px/1 var(--display); margin: 4px 0 3px; }
  .dwb-stub span { font-size: 12px; color: var(--muted); }
  .dwb-soon { position: absolute; top: 26px; right: 24px; background: #E9C98F; color: #1C1810; font: 800 11px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; padding: 8px 12px; border-radius: 999px; }
  .dwb-txt { padding: 30px; }
  .dwb-k { font: 800 11px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #E9C98F; }
  .dwb-txt h3 { margin: 10px 0 12px; font: 400 clamp(38px, 3.6vw, 54px)/1 var(--display); letter-spacing: -.02em; }
  .dwb-txt h3 a { color: #FBF7EE; text-decoration: none; }
  .dwb-txt p { margin: 0 0 20px; color: rgba(251,247,238,.85); font-size: 15px; max-width: 52ch; }
  .dwb-acts { display: flex; flex-wrap: wrap; gap: 10px; }
  .dwb-btn { display: inline-flex; align-items: center; padding: 13px 22px; border-radius: 999px; background: var(--cedar); color: #FBF7EE; font: 700 14.5px var(--sans); text-decoration: none; transition: background .2s; }
  .dwb-btn:hover { background: var(--cedar-deep); color: #FBF7EE; }
  .dwb-btn.ghost { background: transparent; border: 1px solid rgba(251,247,238,.5); }
  .dwb-btn.ghost:hover { background: rgba(251,247,238,.14); }
  .dwb-agenda { display: flex; flex-direction: column; min-width: 0; border-radius: 24px; border: 1px solid var(--line); padding: 20px 22px 22px; background: #FBF7EE; }
  .dwb-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
  .dwb-chips .dw-mo { flex: none; display: inline-flex; gap: 8px; padding: 8px 14px; border-radius: 999px; }
  .dwb-chips .dw-mo b { font: 700 13.5px var(--sans); }
  .dwb-list { list-style: none; margin: 0 0 16px; padding: 0; flex: 1; overflow-y: auto; max-height: 470px; scrollbar-width: thin; }
  .dwb-mh { font: 700 11.5px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); padding: 14px 4px 6px; border-bottom: 1px solid var(--line); }
  .dwb-row { display: grid; grid-template-columns: 50px 60px minmax(0, 1fr) auto; gap: 14px; align-items: center; width: 100%; padding: 10px 8px; border: 0; border-bottom: 1px solid var(--line); background: none; color: var(--ink); text-align: left; font: inherit; cursor: pointer; border-radius: 12px; transition: background .2s; }
  .dwb-row:hover { background: rgba(138,90,55,.07); }
  .dwb-row.on { background: linear-gradient(90deg, rgba(138,90,55,.14), rgba(138,90,55,.02)); }
  .dwb-row:focus-visible { outline: 2px solid var(--cedar); outline-offset: -2px; }
  .dwb-dt { text-align: center; line-height: 1; }
  .dwb-dt small { display: block; font: 800 10px var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--cedar); }
  .dwb-dt b { font: 400 28px/1.1 var(--display); }
  .dwb-th { width: 60px; height: 60px; border-radius: 14px; overflow: hidden; background: var(--cream-2); }
  .dwb-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .dwb-rt { min-width: 0; }
  .dwb-rt b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 400 18px/1.2 var(--display); }
  .dwb-rt small { display: block; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 3px; }
  .dwb-pr { font: 700 13px var(--sans); color: var(--ink-soft); }
  .dwb-agenda .dw-all { margin-top: auto; }
  @media (prefers-reduced-motion: reduce) { .dwb-in { animation: none; } .dwb-poster > img { transition: none; } }
  html.sg-dark .dwb-agenda { background: #231C14; }

  /* ===== events: spotlight banner + swipe rail ===== */
  #eventGrid { display: block; }
  .evx-spot { position: relative; display: flex; align-items: flex-end; min-height: 470px; border-radius: 28px; overflow: hidden; background: #1C1810; color: #FBF7EE; cursor: pointer; isolation: isolate; }
  .evx-spot-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1.2s cubic-bezier(.2,.8,.2,1); }
  .evx-spot:hover .evx-spot-img { transform: scale(1.03); }
  .evx-spot::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(20,15,9,.9) 0%, rgba(20,15,9,.62) 42%, rgba(20,15,9,.08) 78%), linear-gradient(0deg, rgba(20,15,9,.45), rgba(20,15,9,0) 40%); }
  .evx-spot-in { padding: 44px 48px; max-width: 660px; }
  .evx-when { display: flex; gap: 10px; margin-bottom: 22px; }
  .evx-chip { display: inline-flex; flex-direction: column; justify-content: center; padding: 9px 14px; border-radius: 14px; background: rgba(251,247,238,.12); border: 1px solid rgba(251,247,238,.24); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); line-height: 1.1; }
  .evx-chip small { font: 700 10.5px/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
  .evx-date { align-items: center; min-width: 62px; }
  .evx-date b { font: 400 28px/1 var(--display); }
  .evx-count b { font: 400 19px/1.25 var(--display); margin-top: 3px; }
  .evx-when.live .evx-count { background: rgba(115,139,95,.42); border-color: rgba(184,224,168,.5); }
  .evx-when.live .evx-count small::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #B8E0A8; margin-right: 6px; vertical-align: 1px; animation: evxPulse 1.6s ease-in-out infinite; }
  @keyframes evxPulse { 50% { opacity: .35; } }
  .evx-type { display: block; font: 700 11px/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--cedar); }
  .evx-spot .evx-type { color: #EAC894; }
  .evx-title { font: 400 clamp(32px, 3.6vw, 48px)/1.04 var(--display); letter-spacing: -.02em; margin: 10px 0 12px; color: #FBF7EE; }
  .evx-title a { color: inherit; text-decoration: none; }
  .evx-title em { font-style: italic; color: #EAC894; }
  .evx-lead { font-size: 15.5px; line-height: 1.55; color: rgba(251,247,238,.86); margin: 0 0 18px; max-width: 48ch; }
  .evx-host { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin-bottom: 22px; font-size: 14px; }
  .evx-hostt { display: flex; flex-direction: column; line-height: 1.35; margin-right: 4px; }
  .evx-host a { color: #FBF7EE; font-weight: 700; text-decoration: none; border-bottom: 1px solid rgba(251,247,238,.35); }
  .evx-host small { color: rgba(251,247,238,.72); font-size: 12.5px; }
  .evx-av { position: relative; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; overflow: hidden; background: var(--cedar); display: inline-grid; place-items: center; }
  .evx-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .evx-av[data-i]::after { content: attr(data-i); color: #FBF7EE; font: 500 15px/1 var(--display); }
  .evx-spot .evx-av { box-shadow: 0 0 0 2px rgba(251,247,238,.5); }
  .evx-going { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; padding: 5px 10px; border-radius: 999px; background: rgba(115,139,95,.16); color: var(--sage, #4A5D4F); white-space: nowrap; }
  .evx-going[hidden] { display: none !important; }
  .evx-going::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
  .evx-spot .evx-going { background: rgba(251,247,238,.14); color: #DDEBD3; }
  .evx-more { display: inline-flex; font-size: 12px; font-weight: 700; padding: 4px 9px; border-radius: 999px; background: rgba(138,90,55,.12); color: var(--cedar); white-space: nowrap; }
  .evx-spot .evx-more { background: rgba(234,200,148,.18); color: #EAC894; }
  .evx-act { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
  .evx-btn { display: inline-flex; align-items: center; padding: 13px 22px; border-radius: 999px; background: var(--cedar); color: #FBF7EE; font-weight: 700; font-size: 14px; text-decoration: none; transition: background .2s ease, transform .2s ease; }
  .evx-btn:hover { background: var(--cedar-deep); transform: translateY(-1px); }
  .evx-spot .evx-btn { background: #8A5A37; color: #FBF7EE; }
  .evx-spot .evx-btn:hover { background: #6B4326; }
  .evx-cal { position: relative; }
  .evx-calbtn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 999px; border: 1px solid rgba(251,247,238,.45); background: rgba(251,247,238,.06); color: #FBF7EE; font: 700 14px/1 var(--sans); cursor: pointer; transition: background .2s ease, border-color .2s ease; }
  .evx-calbtn:hover { background: rgba(251,247,238,.16); border-color: #FBF7EE; }
  .evx-calbtn svg { width: 17px; height: 17px; }
  .evx-calmenu { position: absolute; left: 0; bottom: calc(100% + 8px); z-index: 5; min-width: 230px; padding: 6px; border-radius: 16px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 24px 50px -18px rgba(0,0,0,.45); }
  .evx-calmenu a { display: block; padding: 11px 14px; border-radius: 11px; color: var(--ink); font-size: 14px; font-weight: 600; text-decoration: none; }
  .evx-calmenu a:hover { background: rgba(138,90,55,.1); }
  .evx-railhead { display: flex; justify-content: space-between; align-items: center; margin: 36px 0 14px; }
  .evx-railhead h3 { font: 400 26px/1.1 var(--display); letter-spacing: -.01em; }
  .evx-arrows { display: flex; gap: 10px; }
  .evx-rail { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 18px) / 4); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 8px; margin: 0 -2px; outline: none; }
  .evx-rail::-webkit-scrollbar { display: none; }
  .evx-card { scroll-snap-align: start; display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; cursor: pointer; transition: transform .25s ease, box-shadow .25s ease; }
  .evx-card:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -26px rgba(28,24,16,.5); }
  .evx-ph { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--cream); }
  .evx-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .evx-d { position: absolute; left: 12px; top: 12px; display: flex; flex-direction: column; align-items: center; min-width: 46px; padding: 6px 9px 7px; border-radius: 12px; background: var(--paper); color: var(--ink); line-height: 1; }
  .evx-d b { font: 500 22px/1 var(--display); }
  .evx-d small { font: 700 10px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-top: 3px; }
  .evx-soon { position: absolute; right: 12px; top: 12px; padding: 5px 10px; border-radius: 999px; background: rgba(20,15,9,.58); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #FBF7EE; font-size: 11.5px; font-weight: 700; }
  .evx-bd { display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding: 16px 18px 16px; }
  .evx-bd h4 { font: 400 21px/1.16 var(--display); letter-spacing: -.01em; margin: 6px 0 6px; }
  .evx-bd h4 a { color: var(--ink); text-decoration: none; }
  .evx-meta { font-size: 13.5px; color: var(--ink-soft); line-height: 1.4; margin: 0 0 8px; }
  .evx-ft { display: flex; align-items: center; gap: 8px; width: 100%; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-soft); }
  .evx-bd .evx-more { margin-bottom: 12px; }
  .evx-ft .evx-av { width: 26px; height: 26px; }
  .evx-ft .evx-av[data-i]::after { font-size: 12px; }
  .evx-hn { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
  .evx-ft .evx-going { padding: 3px 8px; font-size: 11.5px; }
  .evx-pr { font-weight: 800; color: var(--ink); }
  #events .ev-more { margin-top: 30px; }
  @media (max-width: 1024px) {
    .evx-rail { grid-auto-columns: calc((100% - 2 * 16px) / 2.6); gap: 16px; }
    .evx-spot-in { padding: 36px; }
  }
  @media (max-width: 640px) {
    .evx-spot { min-height: 540px; border-radius: 24px; }
    .evx-spot::after { background: linear-gradient(0deg, rgba(20,15,9,.94) 0%, rgba(20,15,9,.72) 48%, rgba(20,15,9,.1) 100%); }
    .evx-spot-in { padding: 22px 20px 22px; }
    .evx-title { font-size: 31px; }
    .evx-lead { font-size: 14.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
    .evx-act { flex-direction: column; align-items: stretch; }
    .evx-btn, .evx-calbtn { justify-content: center; width: 100%; }
    .evx-calmenu { left: 0; right: 0; }
    .evx-arrows { display: none; }
    .evx-railhead { margin-top: 30px; }
    .evx-rail { grid-auto-columns: 80%; gap: 14px; margin: 0 -16px; padding: 2px 16px 8px; scroll-padding: 0 16px; }
  }


  /* ---------- For hosts & healers: big type ---------- */
  .hk { padding: 8px 0 72px; }
  .hk-card { position: relative; overflow: hidden; border-radius: 28px; background: #1C1810; color: #F2EBDD; padding: 52px 56px 44px; isolation: isolate; }
  .hk-ring { position: absolute; right: -110px; top: -110px; width: 380px; height: 380px; border-radius: 50%; border: 1px solid rgba(233,201,143,.26);
    box-shadow: 0 0 0 46px rgba(233,201,143,.045), 0 0 0 92px rgba(233,201,143,.03); z-index: -1; }
  .hk-eye { font: 800 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: #E9C98F; }
  .hk-title { margin: 14px 0 0; font: 400 clamp(36px, 5.6vw, 76px)/1.02 var(--display); letter-spacing: -.02em; color: #F2EBDD; }
  .hk-rot { display: inline-block; color: #E9C98F; }
  .hk-word { display: inline-block; font-style: italic; transition: opacity .35s ease, transform .35s ease, filter .35s ease; }
  .hk-word.out { opacity: 0; transform: translateY(.18em); filter: blur(3px); }

  /* photo behind the banner (cross-fades with each word) and the same photo filling the word */
  .hk-bg { position: absolute; inset: 0; z-index: -2; }
  .hk-bg i { position: absolute; inset: 0; background: center / cover no-repeat; opacity: 0; transform: scale(1.04); transition: opacity 1s ease, transform 2.6s ease; }
  .hk-bg i.on { opacity: 1; transform: none; }
  .hk-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,15,10,.94) 0%, rgba(20,15,10,.82) 45%, rgba(20,15,10,.55) 100%); }
  .hk-rot .hk-word { font-weight: 600; padding: 0 .06em .08em; margin: 0 -.06em; background: var(--hkimg, none) center / cover no-repeat, #E9C98F; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
    filter: brightness(1.35) saturate(1.15); -webkit-text-stroke: 1px rgba(233,201,143,.55); }
  .hk-rot .hk-word.out { filter: brightness(1.35) saturate(1.15) blur(3px); }
  @media (prefers-reduced-motion: reduce) { .hk-bg i { transition: none; } }
  .hk-words { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
  .hk-words span { text-transform: uppercase; letter-spacing: .08em; font-weight: 700; font-size: 11.5px; padding: 5px 11px; border-radius: 999px; border: 1px solid rgba(242,235,221,.22); color: rgba(242,235,221,.78); transition: background .3s ease, color .3s ease, border-color .3s ease; }
  .hk-words span.on { background: #E9C98F; border-color: #E9C98F; color: #1C1810; }
  .hk-bot { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-top: 28px; }
  .hk-bot p { margin: 0; max-width: 52ch; font-size: 15.5px; line-height: 1.6; color: rgba(242,235,221,.74); }
  .hk-bot p a { color: #F2EBDD; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(242,235,221,.5); }
  .hk-btn { display: inline-flex; align-items: center; gap: 8px; flex: none; padding: 15px 26px; border-radius: 999px; background: #E9C98F; color: #1C1810; font: 700 15px var(--sans); text-decoration: none; transition: transform .2s ease, background .2s ease; }
  .hk-btn svg { width: 17px; height: 17px; transition: transform .2s ease; }
  section.hk .hk-btn { padding: 11px 20px; font-size: 13.5px; gap: 7px; } section.hk .hk-btn svg { width: 15px; height: 15px; }
  .hk-btn:hover { background: #F2D9A8; transform: translateY(-1px); }
  .hk-btn:hover svg { transform: translateX(3px); }
  .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  @media (max-width: 900px) { .hk-card { padding: 40px 34px 34px; } }
  @media (max-width: 640px) {
    .hk { padding-bottom: 48px; }
    .hk-card { border-radius: 20px; padding: 26px 20px 22px; }
    .hk-title { font-size: 34px; }
    .hk-br { display: none; }
    .hk-words { display: none; }
    .hk-bot { flex-direction: column; align-items: stretch; gap: 16px; margin-top: 16px; }
    .hk-bot p { font-size: 14px; }
    .hk-btn { justify-content: center; padding: 11px 18px; align-self: flex-start; }
    .hk-ring { width: 210px; height: 210px; right: -80px; top: -80px; }
  }
  @media (prefers-reduced-motion: reduce) { .hk-word, .hk-words span { transition: none; } }
  /* "Coming up" tickets: a tad smaller on computers */
  @media (min-width: 901px) {
    .evx-tickets { gap: 14px; }
    .evx-tickets .evx-tk { grid-template-columns: 88px minmax(0, 1fr) 128px; min-height: 128px; border-radius: 18px; }
    .evx-tickets .evx-tk::before, .evx-tickets .evx-tk::after { left: 79px; width: 16px; height: 16px; }
    .evx-tickets .evx-tk::before { top: -9px; } .evx-tickets .evx-tk::after { bottom: -9px; }
    .evx-tickets .evx-tk .tk-stub b { font-size: 38px; }
    .evx-tickets .evx-tk .tk-stub small { font-size: 10px; }
    .evx-tickets .evx-tk .tk-mid { padding: 13px 16px; }
    .evx-tickets .evx-tk h4 { font-size: 18px; margin: 3px 0 4px; }
    .evx-tickets .evx-tk .evx-meta { font-size: 12.5px; }
    .evx-tickets .evx-tk .tk-loc { font-size: 12.5px; margin-top: 3px; }
    .evx-tickets .evx-tk .tk-host { padding-top: 8px; font-size: 12.5px; }
    .evx-tickets .evx-tk .tk-host .evx-av { width: 22px; height: 22px; }
  }
  /* ticket details sit together, centred top-to-bottom (no gap above the host) */
  .evx-tickets .evx-tk .tk-mid { justify-content: center; }
  .evx-tickets .evx-tk .tk-host { margin-top: 0; padding-top: 8px; }
  /* hosts banner: a tad smaller on computers */
  @media (min-width: 1025px) {
    section.hk .hk-card { padding: 40px 48px 36px; }
    section.hk .hk-title { font-size: clamp(36px, 4.4vw, 60px); margin-top: 12px; }
    section.hk .hk-words { margin-top: 16px; }
    section.hk .hk-bot { margin-top: 22px; }
    section.hk .hk-bot p { font-size: 15px; }
    section.hk .hk-ring { width: 320px; height: 320px; right: -100px; top: -100px; }
  }

  /* ===== "Coming up" ticket drawer ===== */
  #eventFilters, #eventCats { display: none !important; }
  .dw { position: relative; }
  /* event type tabs: no colour dots, all capitals */
  .dw-tabs .dw-tab .dw-dot { display: none !important; }
  .dw-tabs .dw-tab { text-transform: uppercase; letter-spacing: .08em; }
  .dw-tabs .dw-tab i { text-transform: none; letter-spacing: 0; }
  @media (max-width: 767px) { .dw-tabs .dw-tab { letter-spacing: .01em; font-size: min(2.8vw, 11px) !important; padding-left: 6px !important; padding-right: 6px !important; gap: 4px; white-space: nowrap; } }
  .dw-body > .evx-spot { grid-column: 1 / -1; margin: 0 !important; }
  .dw-tabs { display: flex; gap: 4px; padding: 0 22px; position: relative; z-index: 2; overflow-x: auto; scrollbar-width: none; }
  .dw-tabs::-webkit-scrollbar { display: none; }
  .dw-tab { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px 15px; margin-bottom: -6px; border: 0; border-radius: 14px 14px 0 0; background: var(--t); color: #1C1810; font: 700 13.5px var(--sans); cursor: pointer; transform: translateY(6px); transition: transform .2s ease, padding .2s ease; }
  .dw-tab i { font: 500 12px var(--display); font-style: normal; color: #8A5A37; }
  .dw-tab.on .dw-dot { box-shadow: 0 0 0 3px color-mix(in srgb, var(--d) 22%, transparent); }
  .dw-nav button:hover { background: var(--ink); color: var(--cream); border-color: var(--ink); }
  .dw-tab .dw-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--d); }
  .dw-tab:hover { filter: brightness(.96); }
  .dw-tab.on { transform: none; background: var(--paper); color: var(--ink); padding-bottom: 19px; box-shadow: 0 -6px 16px -12px rgba(28,24,16,.35); }
  .dw-tab.on i { color: var(--cedar); }
  .dw-tab.empty { opacity: .5; }
  .dw-tab:focus-visible { outline: 2px solid var(--cedar); outline-offset: -2px; }
  .dw-body { position: relative; z-index: 3; display: grid; grid-template-columns: 96px minmax(0, 1.55fr) minmax(0, 1fr); gap: 26px; background: var(--paper); border-radius: 24px; padding: 28px; box-shadow: 0 24px 50px -30px rgba(28,24,16,.45); }
  .dw-months { display: flex; flex-direction: column; gap: 6px; }
  .dw-mo { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; padding: 11px 12px; border-radius: 12px; border: 1px solid var(--line); background: none; color: var(--ink-soft); cursor: pointer; transition: background .2s, border-color .2s; }
  .dw-mo b { font: 500 18px var(--display); color: var(--ink); }
  .dw-mo i { font-style: normal; font-size: 11.5px; font-weight: 700; }
  .dw-mo:hover { border-color: var(--ink); }
  .dw-mo.on { background: var(--ink); border-color: var(--ink); }
  .dw-mo.on b { color: var(--cream); } .dw-mo.on i { color: #E9C98F; }
  .dw-mo.empty { opacity: .45; }
  .dw-deck { position: relative; padding-top: 20px; min-width: 0; }
  .dw-back { position: absolute; left: 0; right: 0; height: 60px; border-radius: 20px; border: 1px solid var(--line); background: #EFE6D3; transform-origin: top center; }
  .dw-back.b2 { top: 0; transform: scale(.9); background: #E6DAC2; }
  .dw-back.b1 { top: 10px; transform: scale(.95); }
  .dw-ftk { position: relative; display: grid; grid-template-columns: 200px minmax(0, 1fr) 84px; min-height: 236px; border-radius: 20px; overflow: hidden; background: #FFFDF8; border: 1px solid var(--line); box-shadow: 0 18px 36px -22px rgba(28,24,16,.5); cursor: pointer; }
  .dw-ph { position: relative; display: block; background: var(--cream-2); }
  .dw-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .dw-pr { position: absolute; left: 12px; bottom: 12px; padding: 5px 10px; border-radius: 999px; background: var(--paper); color: var(--ink); font-size: 13px; font-weight: 800; }
  .dw-soon { position: absolute; left: 12px; top: 12px; padding: 4px 9px; border-radius: 999px; background: rgba(20,15,9,.6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #FBF7EE; font-size: 11px; font-weight: 700; }
  .dw-b { display: flex; flex-direction: column; gap: 6px; padding: 20px 20px 18px; min-width: 0; }
  .dw-ty { display: inline-flex; align-items: center; gap: 6px; font: 800 10.5px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cedar); }
  .dw-ty .dw-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--d); }
  .dw-b h3 { margin: 0; font: 500 26px/1.12 var(--display); letter-spacing: -.01em; }
  .dw-b h3 a { color: var(--ink); text-decoration: none; }
  .dw-w { margin: 2px 0 0; font-size: 13.5px; color: var(--ink-soft); } .dw-w b { color: var(--ink); }
  .dw-l { display: flex; align-items: center; gap: 5px; margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); min-width: 0; }
  .dw-l svg { width: 13px; height: 13px; flex: none; color: var(--cedar); } .dw-l span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dw-h { display: flex; align-items: center; gap: 7px; margin: 2px 0 0; font-size: 12.5px; color: var(--ink-soft); }
  .dw-h .evx-av { width: 22px; height: 22px; }
  .dw-row { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 12px; }
  .dw-btn { flex: none; padding: 10px 18px; border-radius: 999px; background: var(--cedar); color: #FBF7EE; font-weight: 700; font-size: 13.5px; text-decoration: none; white-space: nowrap; transition: transform .2s, background .2s; }
  .dw-btn:hover { transform: translateY(-1px); background: #774b2c; }
  .dw-of { font-size: 12px; color: var(--ink-soft); }
  .dw-nav { margin-left: auto; display: flex; gap: 6px; }
  .dw-nav button { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); background: none; color: var(--ink); font-size: 19px; line-height: 1; cursor: pointer; }
  .dw-nav button:hover { border-color: var(--ink); }
  .dw-stub { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: var(--ink); color: var(--cream); border-left: 2px dashed rgba(242,235,221,.3); }
  .dw-stub small { font: 800 10px var(--sans); letter-spacing: .18em; text-transform: uppercase; color: #E9C98F; }
  .dw-stub b { font: 400 42px/1 var(--display); } .dw-stub span { font-size: 11.5px; color: rgba(242,235,221,.6); }
  .dw-empty { display: flex; flex-direction: column; gap: 6px; justify-content: center; min-height: 236px; padding: 28px; border-radius: 20px; border: 1px dashed var(--line); }
  .dw-empty b { font: 500 22px var(--display); } .dw-empty span { color: var(--ink-soft); font-size: 14px; } .dw-empty a { color: var(--cedar); }
  .dw-side { list-style: none; margin: 0; padding: 0; min-width: 0; }
  .dw-side li button { width: 100%; display: grid; grid-template-columns: 60px minmax(0, 1fr) 10px; align-items: center; gap: 10px; padding: 11px 0; border: 0; border-bottom: 1px solid var(--line); background: none; text-align: left; color: var(--ink); font: 600 14px var(--sans); cursor: pointer; }
  .dw-side li button:hover span { color: var(--cedar); }
  .dw-side li button b { font: 500 15px var(--display); }
  .dw-side li button span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dw-side li button i { width: 8px; height: 8px; border-radius: 50%; background: var(--d); }
  .dw-side li button.dim { opacity: .58; }
  /* "See all events" lives inside the drawer, under the list */
  .dw-sidecol { display: flex; flex-direction: column; min-width: 0; }
  .dw-all { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: auto; padding: 12px 20px; border-radius: 999px; background: var(--cedar); color: #FBF7EE; font: 700 14px var(--sans); text-decoration: none; transition: background .2s, transform .2s; }
  .dw-sidecol .dw-side { margin-bottom: 18px; }
  .dw-all svg { width: 16px; height: 16px; transition: transform .2s; }
  .dw-all:hover { background: #774b2c; transform: translateY(-1px); } .dw-all:hover svg { transform: translateX(3px); }
  .dw-all:focus-visible { outline: 2px solid var(--cedar); outline-offset: 3px; }
  #events .event-grid > .ev-more { display: none; }
  .dw-sh { padding: 4px 0 2px; font: 800 10.5px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cedar); }
  .dw-sh:not(:first-child) { margin-top: 14px; }
  .dw-in-next { animation: dwNext .35s ease; } .dw-in-prev { animation: dwPrev .35s ease; } .dw-in-fade { animation: dwFade .3s ease; }
  @keyframes dwNext { from { opacity: 0; transform: translateX(24px) rotate(.6deg); } to { opacity: 1; transform: none; } }
  @keyframes dwPrev { from { opacity: 0; transform: translateX(-24px) rotate(-.6deg); } to { opacity: 1; transform: none; } }
  @keyframes dwFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { .dw-in-next, .dw-in-prev, .dw-in-fade { animation: none; } .dw-tab { transition: none; } }
  html.sg-dark .dw-ftk { background: #2A2219; } html.sg-dark .dw-back { background: #231C14; } html.sg-dark .dw-back.b2 { background: #1E1811; }
  html.sg-dark .dw-tab:not(.on) { color: #1C1810; }
  @media (min-width: 1025px) {   /* every tab fits on one row */
    .dw-tabs { gap: 3px; padding: 0 14px; overflow: visible; }
    .dw-tab { padding: 11px 12px 15px; font-size: 13px; gap: 6px; }
    .dw-tab.on { padding-bottom: 19px; }
  }
  @media (max-width: 1024px) {
    /* tablet + phone: the type tabs sit in a fixed grid inside the box. No sideways swiping, nothing shifts */
    .dw { background: var(--paper); border-radius: 24px; padding: 20px; box-shadow: 0 24px 50px -30px rgba(28,24,16,.45); }
    .dw > .dw-body { background: none; box-shadow: none; padding: 0; border-radius: 0; }
    .dw-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; overflow: visible; margin: 0 0 16px; padding: 0 0 16px; border-bottom: 1px solid var(--line); touch-action: manipulation; }
    .dw-tab { justify-content: center; min-width: 0; padding: 10px 8px; margin: 0; border-radius: 999px; transform: none; transition: background .2s ease, color .2s ease; white-space: nowrap; }
    .dw-tab span:not(.dw-dot) { overflow: hidden; text-overflow: ellipsis; }
    .dw-tab:hover { transform: none; }
    .dw-tab.on { transform: none; padding-bottom: 10px; background: var(--ink); color: var(--cream); box-shadow: none; }
    .dw-tab.on i { color: #E6D8BE; }
    .dw-body { grid-template-columns: 1fr; gap: 18px; padding: 20px; }
    .dw-months { flex-direction: row; overflow-x: auto; scrollbar-width: none; margin: 0 -20px; padding: 0 20px; }
    .dw-months::-webkit-scrollbar { display: none; }
    .dw-mo { flex: none; gap: 10px; }
  }
  @media (max-width: 640px) {
    .dw { padding: 14px 14px 18px; border-radius: 20px; }
    .dw-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 14px; padding: 0 0 14px; }
    .dw-tabs { gap: 5px; }
    .dw-tab { padding: 9px 4px; font-size: 11.5px; gap: 4px; letter-spacing: -.01em; }
    .dw-tab .dw-dot { display: none; }
    .dw-tab i { font-size: 10.5px; }
    .dw-tab.on { padding-bottom: 9px; }
    .dw-body { padding: 16px 14px 18px; border-radius: 20px; }
    .dw-months { margin: 0 -14px; padding: 0 14px; }
    .dw-ftk { grid-template-columns: 104px minmax(0, 1fr); min-height: 0; }
    .dw-stub { display: none; }
    .dw-b { padding: 14px 14px 14px; gap: 5px; }
    .dw-b h3 { font-size: 19px; }
    .dw-h { display: none; }
    .dw-of { display: none; }
    .dw-soon { display: none; }
    .dw-btn { padding: 9px 15px; font-size: 13px; }
  }
  /* ticket cards: the event's location under the time */
  .evx-tk .tk-loc { display: flex; align-items: center; gap: 5px; margin: 5px 0 0; font-size: 13px; font-weight: 600; color: var(--ink); min-width: 0; max-width: 100%; }
  .evx-tk .tk-loc svg { width: 14px; height: 14px; flex: none; color: var(--cedar, #8A5A37); }
  .evx-tk .tk-loc span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  @media (max-width: 640px) { .evx-tk .tk-loc { font-size: 12px; margin-top: 3px; } }
  /* event type buttons: every type shows on computers (wraps if needed); phones get one row that slides, each button keeps its size */
  .ev-cat.empty { opacity: .5; }
  @media (max-width: 767px) {
    .ev-cats { flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; margin-left: -16px !important; margin-right: -16px !important; padding: 2px 16px !important; }
    .ev-cats::-webkit-scrollbar { display: none; }
    .ev-cat { flex: none !important; min-width: auto !important; padding: 9px 15px !important; font-size: 13px !important; scroll-snap-align: start; }
  }
  /* the banner sits across two sections: top half on the page colour, bottom half on the events colour */
  .hk { padding: 8px 0 0 !important; background: linear-gradient(to bottom, transparent 50%, var(--cream-2) 50%); }
  #events { border-top: 0 !important; }
  @media (max-width: 640px) {
    .hk-words { display: flex !important; gap: 6px; margin-top: 14px; }
    .hk-words span { font-size: 10.5px; padding: 4px 9px; }
    /* the changing word gets its own line, sized so the longest one fits: no empty gap under the title */
    .hk-title { min-height: 0; font-size: min(8.8vw, 36px); line-height: 1.08; }
    .hk-title .hk-rot { display: block; white-space: nowrap; line-height: 1.16; min-height: 1.16em; }
    .hk-title .hk-br { display: none; }
    .hk-words { margin-top: 18px; }
    .hk-bot { margin-top: 20px; }
  }

  /* ---------- Schools & certifications: learning pathway ---------- */
  #schools { padding: 110px 0 100px; }
  .pw-card { position: relative; overflow: hidden; border-radius: 30px; background: #3E4A3F; color: #F2EBDD; padding: 38px 40px 34px; isolation: isolate; }
  .pw-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url(/images/covers/gen/schools-certifications.svg) center / cover; opacity: .18; }
  .pw-disc { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 30px; }
  .pw-disc button { padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(242,235,221,.26); background: transparent; color: #F2EBDD; font: 700 13.5px var(--sans); cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
  .pw-disc button:hover { border-color: rgba(242,235,221,.6); }
  .pw-disc button[aria-selected="true"] { background: #E9C98F; color: #1C1810; border-color: #E9C98F; }
  .pw-disc button:focus-visible { outline: 2px solid #E9C98F; outline-offset: 2px; }
  .pw-path { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }
  .pw-path::before { content: ""; position: absolute; left: 12.5%; right: 12.5%; top: 27px; height: 2px; background: linear-gradient(90deg, #E9C98F, rgba(233,201,143,.3)); }
  .pw-st { position: relative; text-align: center; padding: 0 12px; animation: pwIn .45s ease both; }
  .pw-st:nth-child(2) { animation-delay: .06s; } .pw-st:nth-child(3) { animation-delay: .12s; } .pw-st:nth-child(4) { animation-delay: .18s; }
  @keyframes pwIn { from { opacity: 0; transform: translateY(8px); } }
  .pw-dot { position: relative; z-index: 1; width: 56px; height: 56px; margin: 0 auto 14px; border-radius: 50%; background: #3E4A3F; border: 2px solid #E9C98F; display: grid; place-items: center; font: 400 22px var(--display); color: #E9C98F; }
  .pw-st:first-child .pw-dot { background: #E9C98F; color: #1C1810; }
  .pw-st small { display: block; font: 800 10.5px/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: #E9C98F; }
  .pw-st h3 { margin: 5px 0 6px; font: 400 21px/1.2 var(--display); color: #F2EBDD; }
  .pw-st p { margin: 0; font-size: 13.5px; line-height: 1.5; color: rgba(242,235,221,.74); }
  .pw-st .pw-n { display: inline-block; margin-top: 12px; font-size: 12px; font-weight: 700; padding: 5px 11px; border-radius: 999px; background: rgba(242,235,221,.12); color: #F2EBDD; text-decoration: none; }
  .pw-schools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 32px; }
  .pw-sch { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 16px; background: rgba(242,235,221,.08); border: 1px solid rgba(242,235,221,.14); color: #F2EBDD; text-decoration: none; transition: background .2s, transform .2s; min-width: 0; }
  .pw-sch:hover { background: rgba(242,235,221,.15); transform: translateY(-2px); }
  .pw-mono { width: 46px; height: 46px; flex: none; border-radius: 13px; display: grid; place-items: center; font: 400 20px var(--display); color: #FBF7EE; background-size: cover; background-position: center; }
  .pw-sch b { display: block; font: 500 16px/1.2 var(--display); }
  .pw-sch small { display: block; font-size: 12px; color: rgba(242,235,221,.68); margin-top: 2px; }
  .pw-sch span { min-width: 0; }
  .pw-cta { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 22px; font-size: 13.5px; color: rgba(242,235,221,.75); }
  .pw-cta a:not(.pw-all) { color: #F2EBDD; }
  .pw-all { flex: none; padding: 12px 20px; border-radius: 999px; background: #E9C98F; color: #1C1810; font-weight: 800; text-decoration: none; transition: background .2s; }
  .pw-all:hover { background: #F2D9A8; }
  @media (max-width: 1024px) {
    .pw-path { grid-template-columns: repeat(2, 1fr); row-gap: 28px; }
    .pw-path::before { display: none; }
    .pw-schools { grid-template-columns: 1fr 1fr; }
  }
  @media (max-width: 640px) {
    #schools { padding: 70px 0; }
    .pw-card { border-radius: 22px; padding: 22px 18px; }
    .pw-disc { flex-wrap: nowrap; overflow-x: auto; margin: 0 -18px 22px; padding: 0 18px 2px; scrollbar-width: none; }
    .pw-disc::-webkit-scrollbar { display: none; }
    .pw-disc button { flex: none; }
    .pw-path { grid-template-columns: 1fr; row-gap: 0; }
    .pw-st { display: grid; grid-template-columns: 46px 1fr; column-gap: 14px; text-align: left; padding: 0 0 18px; }
    .pw-dot { width: 46px; height: 46px; margin: 0; grid-row: span 4; font-size: 18px; }
    .pw-st:not(:last-child)::after { content: ""; position: absolute; left: 22px; top: 48px; bottom: 0; width: 2px; background: rgba(233,201,143,.4); }
    .pw-st .pw-n { justify-self: start; margin-top: 8px; }
    .pw-schools { grid-template-columns: 1fr; margin-top: 14px; }
    .pw-cta { flex-direction: column; align-items: stretch; }
    .pw-all { text-align: center; }
  }
  @media (prefers-reduced-motion: reduce) { .pw-st { animation: none; } .pw-sch { transition: none; } }
  /* school boxes open the school's profile: whole box is the link, with an arrow that shows it */
  .pw-schools { position: relative; z-index: 3; }
  /* location filter above the school boxes */
  .pw-where { position: relative; z-index: 3; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 30px; }
  .pw-where label { display: inline-flex; align-items: center; gap: 7px; font: 600 14px var(--sans); color: #F2EBDD; }
  .pw-where label svg { width: 16px; height: 16px; color: #E9C98F; }
  .pw-sel { position: relative; display: inline-block; }
  .pw-sel::after { content: ""; position: absolute; right: 15px; top: 50%; width: 7px; height: 7px; border-right: 1.6px solid #E9C98F; border-bottom: 1.6px solid #E9C98F; transform: translateY(-70%) rotate(45deg); pointer-events: none; }
  .pw-sel select { -webkit-appearance: none; appearance: none; min-width: 210px; padding: 10px 40px 10px 16px; border-radius: 999px; border: 1px solid rgba(242,235,221,.3); background: rgba(242,235,221,.08); color: #F2EBDD; font: 600 14px var(--sans); cursor: pointer; }
  .pw-sel select:hover { border-color: rgba(242,235,221,.6); }
  .pw-sel select:focus-visible { outline: 2px solid #E9C98F; outline-offset: 2px; }
  .pw-sel select option { color: #1C1810; background: #FBF7EE; }
  .pw-where-n { font-size: 13px; color: rgba(242,235,221,.68); }
  .pw-where + .pw-schools { margin-top: 14px; }
  .pw-none { grid-column: 1 / -1; margin: 0; padding: 18px; border-radius: 16px; border: 1px dashed rgba(242,235,221,.24); color: rgba(242,235,221,.8); font-size: 14.5px; }
  .pw-clear { margin-left: 6px; padding: 0; border: 0; background: none; color: #E9C98F; font: 700 14.5px var(--sans); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
  @media (max-width: 640px) { .pw-where { margin-top: 20px; gap: 8px; } .pw-sel, .pw-sel select { width: 100%; } }
  /* every practice tab fits on one row on computers */
  @media (min-width: 1025px) { .pw-disc button { padding: 8px 12px; font-size: 13px; } .pw-disc { gap: 5px; } }
  .pw-sch { position: relative; cursor: pointer; padding-right: 14px; }
  .pw-sch .pw-sch-t { flex: 1 1 auto; }
  .pw-sch .pw-go { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 1px solid rgba(242,235,221,.24); color: #E9C98F; transition: background .2s, color .2s, transform .2s; }
  .pw-sch .pw-go svg { width: 15px; height: 15px; }
  .pw-sch:hover .pw-go, .pw-sch:focus-visible .pw-go { background: #E9C98F; color: #1C1810; transform: translateX(2px); }
  .pw-sch:focus-visible { outline: 2px solid #E9C98F; outline-offset: 2px; }
  /* ---------- Coming up: tickets ---------- */
  .evx-tickets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .evx-tk { display: grid; grid-template-columns: 104px minmax(0, 1fr) 150px; flex-direction: row; min-height: 150px; border-radius: 20px; position: relative; }
  .evx-tk .tk-stub { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: var(--ink); color: var(--cream); padding: 14px 6px; }
  .evx-tk .tk-stub small { font: 800 11px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: #E9C98F; }
  .evx-tk .tk-stub b { font: 400 46px/1 var(--display); letter-spacing: -.02em; }
  .evx-tk .tk-stub span { font-size: 12px; color: rgba(242,235,221,.62); }
  /* perforated edge between the stub and the ticket */
  .evx-tk .tk-stub::after { content: ""; position: absolute; right: -1px; top: 10px; bottom: 10px; border-right: 2px dashed rgba(242,235,221,.32); }
  .evx-tk::before, .evx-tk::after { content: ""; position: absolute; left: 95px; width: 18px; height: 18px; border-radius: 50%; background: var(--cream-2); z-index: 2; }
  .evx-tk::before { top: -10px; } .evx-tk::after { bottom: -10px; }
  .evx-tk .tk-mid { display: flex; flex-direction: column; align-items: flex-start; padding: 16px 18px; min-width: 0; }
  .evx-tk h4 { font: 500 21px/1.15 var(--display); letter-spacing: -.01em; margin: 4px 0 6px; }
  .evx-tk h4 a { color: var(--ink); text-decoration: none; }
  .evx-tk .evx-meta { margin: 0; }
  .evx-tk .tk-host { display: flex; align-items: center; gap: 7px; margin-top: auto; padding-top: 10px; font-size: 13px; color: var(--ink-soft); width: 100%; }
  .evx-tk .tk-host .evx-av { width: 24px; height: 24px; }
  .evx-tk .tk-ph { position: relative; display: block; background: var(--cream-2); }
  .evx-tk .tk-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .evx-tk .tk-soon { position: absolute; left: 10px; top: 10px; padding: 4px 9px; border-radius: 999px; background: rgba(20,15,9,.6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #FBF7EE; font-size: 11px; font-weight: 700; }
  .evx-tk .tk-pr { position: absolute; right: 10px; bottom: 10px; padding: 5px 10px; border-radius: 999px; background: var(--paper); color: var(--ink); font-size: 12.5px; font-weight: 800; box-shadow: 0 4px 12px -6px rgba(0,0,0,.5); }
  html.sg-dark .evx-tk::before, html.sg-dark .evx-tk::after { background: var(--cream-2); }
  @media (max-width: 900px) { .evx-tickets { grid-template-columns: 1fr; gap: 14px; } }
  @media (max-width: 640px) {
    .evx-tk { grid-template-columns: 78px minmax(0, 1fr) 96px; min-height: 128px; border-radius: 18px; }
    .evx-tk::before, .evx-tk::after { left: 69px; width: 16px; height: 16px; }
    .evx-tk .tk-stub b { font-size: 34px; }
    .evx-tk .tk-mid { padding: 12px 12px; }
    .evx-tk h4 { font-size: 17px; }
    .evx-tk .evx-meta { font-size: 12.5px; }
    .evx-tk .tk-soon { display: none; }
  }
  @media (prefers-reduced-motion: reduce) { .evx-spot-img, .evx-card { transition: none; } .evx-when.live .evx-count small::before { animation: none; } }

  /* ===== Schools "Open day" ===== */
  #schools .od-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px 20px; flex-wrap: wrap; margin-bottom: 18px; }
  #schools .od-tabs { margin: 0 !important; }
  #schools .od-tabs button { border-color: var(--line) !important; color: var(--ink) !important; }
  #schools .od-tabs button[aria-selected="true"] { background: var(--ink) !important; border-color: var(--ink) !important; color: var(--cream) !important; }
  .od-where { display: inline-flex; align-items: center; gap: 8px; font: 600 14px var(--sans); color: var(--ink); }
  .od-where > svg { width: 16px; height: 16px; color: var(--cedar); }
  .od-where .pw-sel select { background: var(--paper) !important; color: var(--ink) !important; border-color: var(--line) !important; min-width: 200px; }
  .od-where .pw-sel::after { border-color: var(--cedar) !important; }
  .od-where .pw-sel select option { color: var(--ink); }
  .od { display: grid; grid-template-columns: 300px minmax(0, 1fr); border-radius: 28px; overflow: hidden; background: var(--paper); box-shadow: 0 30px 60px -40px rgba(28,24,16,.55); min-height: 460px; }
  .od-list { background: #1C1810; color: #F2EBDD; padding: 18px 12px; display: flex; flex-direction: column; gap: 4px; max-height: 560px; overflow-y: auto; scrollbar-width: thin; }
  .od-k { display: block; font: 800 10px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cedar); margin-bottom: 6px; }
  .od-list > .od-k { color: #E9C98F; padding: 4px 8px 6px; }
  .od-it { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px; border: 0; border-radius: 12px; background: none; color: inherit; text-align: left; cursor: pointer; transition: background .2s; }
  .od-it:hover { background: rgba(242,235,221,.06); }
  .od-it.on { background: rgba(242,235,221,.11); box-shadow: inset 3px 0 0 #E9C98F; }
  .od-it:focus-visible { outline: 2px solid #E9C98F; outline-offset: -2px; }
  .od-m.has-logo { background-color: #FBF7EE; background-size: cover; }
  .od-letter.od-logo { width: 96px; height: 96px; border-radius: 22px; background: #FBF7EE center/cover; box-shadow: 0 10px 24px -10px rgba(0,0,0,.6); }
  @media (max-width: 760px) { .od-letter.od-logo { width: 72px; height: 72px; border-radius: 16px; } }
  .od-m { flex: none; width: 42px; height: 42px; border-radius: 10px; background: center/cover; display: grid; place-items: center; color: #FBF7EE; font: 400 19px var(--display); }
  .od-it-t { min-width: 0; } .od-it-t b { display: block; font: 500 14.5px/1.2 var(--display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .od-it-t small { font-size: 11.5px; color: rgba(242,235,221,.6); }
  .od-none { margin: 8px; font-size: 13px; color: rgba(242,235,221,.75); } .od-clear { border: 0; background: none; color: #E9C98F; font: 700 13px var(--sans); text-decoration: underline; cursor: pointer; padding: 0; }
  .od-main { display: flex; flex-direction: column; min-width: 0; }
  .od-cover { position: relative; height: 180px; background-size: auto, cover; background-position: center; color: #FBF7EE; padding: 20px 26px; display: flex; align-items: flex-end; gap: 18px; overflow: hidden; }
  .od-letter { font: 300 140px/.72 var(--display); letter-spacing: -.04em; flex: none; }
  .od-cv { min-width: 0; padding-bottom: 6px; } .od-cv small { font-size: 12.5px; opacity: .92; } .od-cv a { color: inherit; text-decoration: none; }
  .od-cv h3 { margin: 4px 0 0; font: 500 clamp(22px, 2.4vw, 30px)/1.1 var(--display); color: #FBF7EE; }
  .od-tabs2 { display: flex; gap: 4px; padding: 0 22px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
  .od-tabs2 button { flex: none; padding: 14px 14px 13px; border: 0; background: none; font: 700 13.5px var(--sans); color: var(--ink-soft, #5b5246); cursor: pointer; }
  .od-tabs2 button i { font-style: normal; font-size: 11px; padding: 2px 7px; border-radius: 999px; background: rgba(201,149,62,.2); color: #6B4C1E; margin-left: 4px; }
  .od-tabs2 button.on { color: var(--ink); box-shadow: inset 0 -2px 0 var(--cedar); }
  .od-pane { padding: 22px 24px 24px; animation: odIn .3s ease; }
  @keyframes odIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
  .od-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 22px; }
  .od-tag { margin: 0 0 12px; font: italic 400 17px/1.45 var(--display); color: var(--ink); }
  .od-prog { margin: 0 0 12px; font-size: 13.5px; } .od-prog span { display: block; font: 800 10px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cedar); margin-bottom: 3px; }
  .od-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
  .od-facts li { display: grid; grid-template-columns: 96px 1fr; gap: 12px; padding: 9px 0; border-top: 1px solid var(--line); font-size: 13.5px; }
  .od-facts li b { font: 400 15px var(--display); color: var(--cedar); }
  .od-who { border-radius: 18px; background: #F2EBDD; padding: 18px; display: flex; flex-direction: column; align-items: flex-start; }
  .od-big { font: 400 52px/1 var(--display); color: var(--ink); } .od-big.sm { font-size: 34px; margin: 2px 0 2px; }
  .od-who small { font-size: 13px; color: var(--ink-soft, #5b5246); }
  .od-avs { display: flex; align-items: center; margin: 12px 0 4px; }
  .od-av { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: center/cover; color: #FBF7EE; font: 500 16px var(--display); border: 2px solid #F2EBDD; margin-left: -10px; text-decoration: none; flex: none; }
  .od-av:first-child { margin-left: 0; }
  .od-more { margin-left: 8px; font-size: 12.5px; font-weight: 800; color: var(--cedar); }
  .od-inv { margin: 10px 0 0; font-size: 12.5px; color: var(--ink-soft, #5b5246); line-height: 1.45; }
  .od-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; } .od-pills span { padding: 5px 10px; border-radius: 999px; background: var(--paper); font-size: 12px; font-weight: 700; }
  .od-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .od-person { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 14px; border: 1px solid var(--line); background: #fff; color: var(--ink); text-decoration: none; min-width: 0; transition: border-color .2s; }
  .od-person:hover { border-color: var(--ink); } .od-person .od-av { margin: 0; border: 0; }
  .od-person b { display: block; font: 500 14.5px/1.2 var(--display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .od-person small { font-size: 11.5px; color: var(--ink-soft, #5b5246); } .od-person > span { min-width: 0; }
  .od-courses { display: flex; flex-wrap: wrap; gap: 6px; } .od-courses span { padding: 6px 11px; border-radius: 999px; border: 1px solid var(--line); font-size: 12.5px; font-weight: 600; }
  .od-note { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--ink); }
  .od-go { margin-top: 14px; padding: 10px 16px; border-radius: 999px; background: var(--cedar); color: #FBF7EE; font-weight: 700; font-size: 13.5px; text-decoration: none; }
  .od-empty { display: flex; flex-direction: column; gap: 6px; justify-content: center; padding: 30px; min-height: 240px; } .od-empty.sm { min-height: 0; padding: 6px 0; }
  .od-empty b { font: 500 21px var(--display); } .od-empty span { color: var(--ink-soft, #5b5246); font-size: 14px; }
  /* practice tabs and the location picker sit inside the box, across the top */
  #schools .od > .od-bar { grid-column: 1 / -1; margin: 0; padding: 18px 24px; border-bottom: 1px solid var(--line); }
  @media (max-width: 900px) { #schools .od > .od-bar { grid-column: 1; padding: 16px; } }
  #schools .od .od-cta { grid-column: 1 / -1; margin: 0 !important; padding: 16px 24px 18px; border-top: 1px solid var(--line); }
  @media (max-width: 900px) { #schools .od .od-cta { grid-column: 1; padding: 14px 16px 18px; } }
  #schools .od-cta { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-top: 18px; color: var(--ink-soft, #5b5246); font-size: 14px; }
  #schools .od-cta a:not(.pw-all) { color: var(--cedar); font-weight: 700; }
  #schools .od-cta .pw-all { background: var(--ink) !important; color: var(--cream) !important; }
  html.sg-dark .od { background: #2A2219; }
  /* practice picker: photo tiles with the name in capitals */
  #schools .od-tabs.pw-disc { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px !important; flex: 1 1 100%; width: 100%; }
  #schools .od-tabs .od-ptile { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; height: 58px; padding: 0 20px !important; border: 0 !important; border-radius: 999px !important;
    background: var(--pimg) center / cover no-repeat, radial-gradient(circle at 85% 20%, rgba(255,255,255,.16) 0 18%, transparent 19%), linear-gradient(135deg, var(--pc), color-mix(in srgb, var(--pc) 55%, #1C1810)) !important;
    color: #FBF7EE !important; text-align: left; cursor: pointer; transition: transform .25s ease, box-shadow .25s ease; box-shadow: 0 10px 22px -16px rgba(28,24,16,.7); }
  #schools .od-tabs .od-ptile::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(20,15,10,.7) 0%, rgba(20,15,10,.35) 60%, rgba(20,15,10,.15)); transition: background .25s ease; }
  #schools .od-tabs .od-ptile span { font: 800 11px/1.15 var(--sans); letter-spacing: .1em; text-transform: uppercase; text-shadow: 0 1px 8px rgba(0,0,0,.45); }
  #schools .od-tabs .od-ptile:hover { transform: translateY(-2px); box-shadow: 0 16px 26px -16px rgba(28,24,16,.75); }
  #schools .od-tabs button.od-ptile[aria-selected="true"], #schools .od-tabs button.od-ptile { background: var(--pimg) center / cover no-repeat, radial-gradient(circle at 85% 20%, rgba(255,255,255,.16) 0 18%, transparent 19%), linear-gradient(135deg, var(--pc), color-mix(in srgb, var(--pc) 55%, #1C1810)) !important; color: #FBF7EE !important; }
  #schools .od-tabs .od-ptile[aria-selected="true"] { box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--ink), 0 16px 26px -16px rgba(28,24,16,.75) !important; }
  #schools .od-tabs .od-ptile[aria-selected="true"]::after { content: ""; position: absolute; top: 50%; right: 14px; margin-top: -9px; width: 18px; height: 18px; border-radius: 50%;
    background: #E9C98F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C1810' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 12px no-repeat; }
  #schools .od-tabs .od-ptile:focus-visible { outline: 2px solid var(--cedar); outline-offset: 3px; }
  #schools .od > .od-bar { flex-direction: column; align-items: stretch; flex-wrap: nowrap !important; }
  @media (max-width: 900px) {
    #schools .od-tabs.pw-disc { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto !important; margin: 0 -16px !important; padding: 4px 16px 6px !important; scrollbar-width: none; width: auto; }
    #schools .od-tabs.pw-disc::-webkit-scrollbar { display: none; }
    #schools .od-tabs .od-ptile { flex: none; width: auto; min-width: 140px; height: 52px; padding: 0 44px 0 18px !important; }
  }
  @media (prefers-reduced-motion: reduce) { #schools .od-tabs .od-ptile { transition: none; } }
  /* link from the school preview to its full listing page */
  .od-page { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin: 18px 0 0; padding: 10px 16px; border-radius: 999px; background: var(--ink, #1C1810); color: #FBF7EE; font: 700 13.5px/1.25 var(--sans); text-decoration: none; transition: background .2s ease; }
  .od-page:hover { background: var(--cedar, #8A5A37); }
  .od-page svg { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
  .od-page:hover svg { transform: translateX(3px); }
  .od-page:focus-visible { outline: 2px solid var(--cedar, #8A5A37); outline-offset: 3px; }
  .od-cover .od-full { position: absolute; top: 16px; right: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: #FBF7EE; color: #1C1810; font: 700 13px/1 var(--sans); text-decoration: none; box-shadow: 0 8px 20px -10px rgba(0,0,0,.5); transition: background .2s, transform .2s; }
  .od-cover .od-full svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
  .od-cover .od-full:hover { background: #E9C98F; }
  .od-cover .od-full:hover svg { transform: translateX(3px); }
  .od-cover .od-full:focus-visible { outline: 2px solid #FBF7EE; outline-offset: 3px; }
  @media (max-width: 640px) { .od-cover .od-full { top: 12px; right: 12px; padding: 8px 12px; font-size: 12px; } }
  /* the dark schools panel runs to the bottom of the box, with the "Run a school" line inside it */
  #schools .od > .od-bar { background: var(--paper); }
  #schools .od .od-cta { background: #1C1810; color: rgba(242,235,221,.82); border-top: 1px solid rgba(242,235,221,.12); }
  #schools .od .od-cta a:not(.pw-all) { color: #E9C98F; }
  #schools .od .od-cta .pw-all { background: #E9C98F !important; color: #1C1810 !important; }
  @media (min-width: 901px) {
    #schools .od { grid-template-rows: auto 1fr auto; background: linear-gradient(to right, #1C1810 300px, var(--paper) 300px); }
    #schools .od > .od-list { grid-column: 1; grid-row: 2; background: transparent; }
    #schools .od > .od-main { grid-column: 2; grid-row: 2 / span 2; background: var(--paper); }
    #schools .od .od-cta { grid-column: 1; grid-row: 3; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 12px; padding: 18px 20px 22px; font-size: 13.5px; line-height: 1.45; }
    html.sg-dark #schools .od { background: linear-gradient(to right, #1C1810 300px, #2A2219 300px); }
    html.sg-dark #schools .od > .od-main, html.sg-dark #schools .od > .od-bar { background: #2A2219; }
  } html.sg-dark .od-who { background: #231C14; } html.sg-dark .od-person { background: #231C14; }
  @media (max-width: 900px) {
    .od { grid-template-columns: minmax(0, 1fr); border-radius: 22px; }
    #schools .od > * { min-width: 0; }
    .od-list { flex-direction: row; overflow-x: auto; overflow-y: hidden; max-height: none; padding: 12px; gap: 6px; scrollbar-width: none; }
    .od-list::-webkit-scrollbar { display: none; }
    .od-list > .od-k { display: none; }
    .od-it { flex: 0 0 230px; width: 230px; }
    .od-grid { grid-template-columns: 1fr; }
    .od-people { grid-template-columns: 1fr 1fr; }
  }
  @media (max-width: 640px) {
    #schools .od-bar { flex-direction: column; align-items: stretch; }
    /* schools tabs: wrap in place on phones, never wider than the screen, no sideways swiping */
    #schools .od-tabs { min-width: 0; max-width: 100%; flex-wrap: wrap !important; overflow: visible !important; padding: 0 !important; gap: 6px; }
    #schools .od-tabs button { padding: 7px 12px; font-size: 12.5px; }
    #schools .od-tabs button { flex: none; }
    .od-where { display: flex; flex-wrap: wrap; width: 100%; } .od-where .pw-sel { display: block; width: 100%; } .od-where .pw-sel select { width: 100%; min-width: 0; box-sizing: border-box; }
    .od-cover { height: 140px; padding: 16px 18px; } .od-letter { font-size: 100px; }
    .od-pane { padding: 18px 16px 20px; }
    .od-facts li { grid-template-columns: 84px 1fr; }
    .od-people { grid-template-columns: 1fr; }
    .od-it { flex-basis: 200px; width: 200px; }
  }
  @media (prefers-reduced-motion: reduce) { .od-pane { animation: none; } }
  /* practice boxes (short photo cards) + location field */
  #schools .od-top { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-bottom: 12px; }
  #schools .od-h { margin: 0; font: 500 21px/1.2 var(--display); color: var(--ink); }
  .od-field { position: relative; display: flex; align-items: center; gap: 9px; min-width: 230px; padding: 6px 36px 6px 12px; border-radius: 12px; border: 1px solid var(--line); background: #FFFDF8; cursor: pointer; transition: border-color .2s; }
  .od-field:hover, .od-field:focus-within { border-color: var(--ink); }
  .od-field > svg { width: 16px; height: 16px; flex: none; color: var(--cedar); }
  .od-fl small { display: block; font: 700 10.5px/1.3 var(--sans); color: var(--ink-soft, #5b5246); }
  .od-fl strong { display: block; font: 600 13.5px/1.3 var(--sans); color: var(--ink); }
  .od-field::after { content: ""; position: absolute; right: 15px; top: 50%; width: 7px; height: 7px; border-right: 1.6px solid var(--ink); border-bottom: 1.6px solid var(--ink); transform: translateY(-70%) rotate(45deg); pointer-events: none; }
  .od-field select { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; font-size: 16px; }
  .od-field:focus-within { outline: 2px solid var(--cedar); outline-offset: 2px; }
  html.sg-dark .od-field { background: #231C14; }
  html body #schools .od-tabs.pw-disc { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 8px !important; }
  html body #schools .od-tabs .od-ptile { height: 46px; align-items: flex-end; padding: 0 30px 8px 11px !important; border-radius: 12px !important; box-shadow: none !important; transform: none !important;
    background: var(--pimg) center / cover no-repeat, var(--pc) !important; transition: box-shadow .2s ease !important; }
  html body #schools .od-tabs .od-ptile::before { background: linear-gradient(180deg, rgba(20,15,10,.05) 0%, rgba(20,15,10,.74)) !important; }
  html body #schools .od-tabs .od-ptile:hover::before { background: linear-gradient(180deg, rgba(20,15,10,.15) 0%, rgba(20,15,10,.85)) !important; }
  html body #schools .od-tabs .od-ptile span { font: 600 13px/1.1 var(--sans); letter-spacing: 0; text-transform: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html body #schools .od-tabs .od-ptile[aria-selected="true"] { box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--cedar) !important; }
  html body #schools .od-tabs .od-ptile[aria-selected="true"]::after { top: 8px; right: 8px; margin: 0; width: 15px; height: 15px; background-size: 9px; }
  @media (max-width: 900px) {
    html body #schools .od-tabs.pw-disc { display: flex !important; padding: 4px 16px 6px !important; }
    html body #schools .od-tabs .od-ptile { flex: none; min-width: 124px; }
  }
  @media (max-width: 640px) {
    #schools .od-top { flex-direction: column; align-items: stretch; gap: 10px; }
    #schools .od-h { font-size: 19px; }
    .od-field { min-width: 0; }
  }
  /* school CTA: centred text, "List it for free." on its own line in italics, full-width button */
  #schools .od .od-cta { flex-direction: column !important; align-items: stretch !important; justify-content: flex-end; text-align: center; gap: 14px; }
  #schools .od .od-cta > span a { display: block; margin-top: 4px; font-style: italic; }
  #schools .od .od-cta .pw-all { display: block; width: 100%; box-sizing: border-box; text-align: center; }

  /* phones: two tickets stacked, arrows underneath move two at a time */
  .dw-pair { display: grid; gap: 10px; }
  .dw-pnav { padding: 12px 2px 0 !important; margin: 0 !important; }
  .dw-pnav .dw-of { display: inline !important; font-size: 12.5px; }
  @media (max-width: 640px) { .dw-deck { padding-top: 0; } }

  /* ===== From the blog: topic rings + "now reading" cover + fresh list ===== */
  #blog { padding: 30px 0 100px; }
  .nb-live { display: inline-flex; align-items: center; gap: 8px; font: 800 11px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--cedar-deep, #6B4326); padding: 8px 13px; border-radius: 999px; background: var(--paper); border: 1px solid var(--line); }
  .nb-live:empty { display: none; }
  .nb-live { white-space: nowrap; }
  .nb-live i { width: 8px; height: 8px; border-radius: 50%; background: #E0663F; animation: nbPulse 1.8s infinite; }
  @keyframes nbPulse { 0% { box-shadow: 0 0 0 0 rgba(224,102,63,.55); } 100% { box-shadow: 0 0 0 10px rgba(224,102,63,0); } }
  .nb-rings { display: flex; gap: 20px; margin: 0 0 26px; overflow-x: auto; padding: 4px 2px 6px; scrollbar-width: none; }
  .nb-rings::-webkit-scrollbar { display: none; }
  .nb-ring { flex: none; display: flex; flex-direction: column; align-items: center; gap: 6px; width: 84px; border: 0; background: none; padding: 0; cursor: pointer; color: var(--ink); text-decoration: none; font: inherit; }
  .nb-ring .r { position: relative; width: 78px; height: 78px; border-radius: 24px; padding: 3px; background: var(--line); transition: transform .25s ease; }
  .nb-ring.fresh .r { background: conic-gradient(from 210deg, var(--c, #8A5A37), #E9C98F, var(--c, #8A5A37)); }
  .nb-ring .r img, .nb-ring .r > span { display: grid; place-items: center; width: 100%; height: 100%; border-radius: 21px; object-fit: cover; border: 3px solid var(--cream); background: var(--paper); }
  .nb-ring .r.all > span { background: var(--ink); color: var(--cream); font: 700 15px var(--sans); }
  .nb-ring.write .r { background: none; border: 2px dashed var(--cedar); padding: 0; }
  .nb-ring.write .r > span { border: 0; background: transparent; font: 400 34px var(--display); color: var(--cedar); }
  .nb-ring b { font: 700 13px/1.2 var(--sans); }
  .nb-ring small { font-size: 11px; font-weight: 600; color: var(--muted); margin-top: -3px; }
  .nb-ring.fresh small { color: #C2522E; }
  .nb-ring .plus { position: absolute; top: -8px; right: -8px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 26px; height: 24px; padding: 0 7px; border-radius: 999px; background: #C2522E; color: #fff; font: 800 11px/1 var(--sans); font-style: normal; font-variant-numeric: tabular-nums; letter-spacing: .02em; border: 2px solid var(--cream); box-shadow: 0 4px 10px -4px rgba(28,24,16,.5); }
  .nb-ring b { text-transform: uppercase; letter-spacing: .08em; font-size: 11.5px; }
  @media (max-width: 640px) { .nb-rings { gap: 16px; } .nb-ring b { font-size: 10.5px; letter-spacing: .05em; } }
  #blog .nb-rings { padding-top: 10px; padding-right: 12px; }
  .nb-ring:hover .r { transform: scale(1.05); }
  .nb-ring[aria-pressed="true"] b { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--c, var(--ink)); }
  .nb-ring[aria-pressed="true"] .r { box-shadow: 0 0 0 2px var(--cream), 0 0 0 4px var(--c, var(--ink)); }
  .nb-now { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 18px; }
  .nb-hero { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-height: 520px; padding: 30px; border-radius: 28px; overflow: hidden; color: #fff; text-decoration: none; }
  .nb-hero .nb-bg { position: absolute; inset: 0; z-index: -2; }
  .nb-hero .nb-bg img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
  .nb-hero:hover .nb-bg img { transform: scale(1.03); }
  .nb-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20,15,10,0) 30%, rgba(20,15,10,.86)); }
  .nb-tags { display: flex; gap: 8px; align-items: center; margin-bottom: 12px; }
  .nb-tags span:not(.nb-new) { background: rgba(255,255,255,.18); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); padding: 5px 11px; border-radius: 999px; font-weight: 700; font-size: 12px; }
  .nb-new { background: #E9C98F; color: var(--ink); font: 800 10.5px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; padding: 6px 10px; border-radius: 999px; }
  .nb-hero h3 { margin: 0 0 10px; font: 400 clamp(30px, 3.6vw, 46px)/1.04 var(--display); letter-spacing: -.02em; color: #fff; }
  .nb-hero p { margin: 0; max-width: 54ch; color: rgba(255,255,255,.86); font-size: 15.5px; }
  .nb-hm { margin-top: 16px; display: flex; align-items: center; gap: 10px; font-size: 13px; color: rgba(255,255,255,.78); }
  .nb-av { width: 28px; height: 28px; border-radius: 50%; background: #FBF7EE; color: var(--ink); display: grid; place-items: center; font: 600 12px var(--display); }
  .nb-fresh { display: flex; flex-direction: column; gap: 12px; }
  .nb-fh { display: flex; justify-content: space-between; align-items: center; padding: 2px 4px 4px; }
  .nb-fh b { font: 500 19px var(--display); }
  .nb-row { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; align-items: center; padding: 10px; border-radius: 20px; background: var(--paper); border: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: border-color .2s, transform .2s; }
  .nb-row:hover { border-color: var(--ink); transform: translateX(3px); }
  .nb-ph { display: block; height: 96px; border-radius: 14px; overflow: hidden; }
  .nb-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .nb-pat { display: grid; place-items: center; background: radial-gradient(circle at 25% 30%, rgba(255,255,255,.18) 0 18%, transparent 19%), radial-gradient(circle at 80% 75%, rgba(255,255,255,.12) 0 24%, transparent 25%), linear-gradient(135deg, var(--c), color-mix(in srgb, var(--c) 55%, #1C1810)); color: rgba(255,255,255,.88); font: italic 400 46px var(--display); }
  .nb-bg.nb-pat { font-size: 220px; }
  .nb-k { display: inline-flex; align-items: center; gap: 6px; font: 800 10.5px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--c); }
  .nb-k::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
  .nb-row b { display: block; margin: 5px 0 4px; font: 400 18px/1.2 var(--display); }
  .nb-row small { font-size: 12px; font-weight: 600; color: var(--muted); }
  .bl-write { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 22px; color: var(--ink-soft); font-size: 14px; }
  .bl-write a:not(.pw-all) { color: var(--cedar); font-weight: 700; }
  @media (max-width: 900px) { .nb-now { grid-template-columns: 1fr; } .nb-hero { min-height: 440px; padding: 22px; } }
  @media (max-width: 640px) {
    #blog { padding: 10px 0 70px; }
    .nb-rings { gap: 12px; margin: 0 -16px 22px; padding: 4px 16px 6px; }
    .nb-ring { width: 70px; } .nb-ring .r { width: 66px; height: 66px; }
    .nb-hero { min-height: 400px; }
    .nb-row { grid-template-columns: 92px minmax(0, 1fr); } .nb-ph { height: 82px; }
  }
  @media (prefers-reduced-motion: reduce) { .nb-live i { animation: none; } .nb-hero .nb-bg img, .nb-ring .r { transition: none; } }
  html.sg-dark .nb-row { background: #231C14; }

  /* dark mode: buttons and chips stay readable (WCAG AA) */
  html.sg-dark .od-page { background: #F1E8D8; color: #1C1810; }
  html.sg-dark .od-page:hover { background: #E9C98F; color: #1C1810; }
  html.sg-dark .dw-all, html.sg-dark .dw-btn { color: #1C1810; }
  html.sg-dark .dw-mo.empty { opacity: .75; }
  html.sg-dark .dw-mo.empty { opacity: 1; }
  html.sg-dark .dw-mo.empty b, html.sg-dark .dw-mo.empty i { color: #A89C86; }
  html.sg-dark .dw-side li button.dim { opacity: 1; }
  html.sg-dark .dw-side li button.dim b, html.sg-dark .dw-side li button.dim span { color: #A89C86; }
  html.sg-dark .dwb-chips .dw-mo.empty b, html.sg-dark .dwb-chips .dw-mo.empty i, html.sg-dark .dw-side li button.dim b, html.sg-dark .dw-side li button.dim span { color: #A89C86 !important; }
  html.sg-dark .dw-mo.empty b, html.sg-dark .dw-mo.empty i { color: #A89C86 !important; }