/* v11 - clean up the wave seam, rebuild the schedule strip, centre section heads */

/* ---------- 1. nothing may paint past the blue field's edge ---------- */
/* the decorative layers are clipped to their own field, so nothing bleeds past a wave */
.field.top .glow,
.field.top .arcs,
.field.bottom .glow,
.sec.demo .aura{inset:0;height:auto;width:auto}
.field.top,
.field.bottom,
.sec.demo{overflow:visible}
/* the paper overlays overshoot by 1px so no sub-pixel seam can show */
.field.top::after{background:#F7F8FB;bottom:-1px}
.sec.demo::before,.sec.demo::after,.field.bottom::before{background:#F7F8FB}
.sec.demo::before{top:-1px}
.sec.demo::after{bottom:-1px}
.field.bottom::before{top:-1px}
main.paper{background:#F7F8FB}
main.paper > .sec:not(.demo){background:#F7F8FB}

/* ---------- 2. the schedule reads as one strip, like the invite pill ---------- */
.field .facts{
  display:inline-flex;align-items:stretch;flex-wrap:nowrap;gap:0;
  padding:0;margin-top:34px;border-radius:999px;overflow:hidden;
  background:rgba(171,230,229,.15);
  border:1px solid rgba(210,238,240,.38);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.field .facts > div{
  background:none;border:0;border-radius:0;margin:0;
  border-inline-start:1px solid rgba(255,255,255,.2);
  padding:15px 30px;text-align:center;min-width:0;
  display:flex;flex-direction:column;align-items:center;gap:5px;
}
.field .facts > div:first-child{border-inline-start:0}
.field .facts dt{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.58);font-weight:700;margin:0;
}
.field .facts dd{
  margin:0;font-size:19px;font-weight:800;color:#fff;letter-spacing:.01em;white-space:nowrap;
}
.field .facts dd.accent{color:#BDE9F5}
.closing .facts{margin-top:30px}

/* the header strip of chips follows the same language */
.bar .meta{gap:0;display:inline-flex;border-radius:999px;overflow:hidden;
  background:rgba(171,230,229,.15);border:1px solid rgba(210,238,240,.34)}
.bar .meta span{
  background:none;border:0;border-radius:0;padding:9px 20px;
  border-inline-start:1px solid rgba(255,255,255,.2);
  font-size:13px;font-weight:700;color:#fff;white-space:nowrap;
}
.bar .meta span:first-child{border-inline-start:0}

/* ---------- 3. section heads centred ---------- */
.sechead{text-align:center;max-width:820px;margin-inline:auto}
.sechead .kicker,
.sechead h2,
.sechead p{text-align:center;margin-inline:auto}
.sechead h2{max-width:22ch}
.sec.demo .sechead h2{max-width:24ch}
.sechead p{max-width:60ch}

@media (max-width:900px){
  .field .facts{flex-wrap:wrap;border-radius:20px}
  .field .facts > div{flex:1 1 44%;padding:13px 16px}
  .field .facts > div:nth-child(odd){border-inline-start:0}
  .bar .meta{display:none}
  .sechead h2{max-width:none}
}
