/* Section rhythm trial, 2026-10-28, from Kat Moss's note: every section sat on the same near-black, so the page read
   as one long surface with blank gaps that look like an ending. Loaded after site.css; Cam picked Option 1 with the
   softer aurora edge (rhythm-wave.css) and build_service.py puts it on every page.
   body.rhythm        open "sky" sections keep the light field; reading-heavy sections (class "lifted") sit on a lifted navy
                      surface with a glowing top edge in their own color; the gaps close so the next section shows.
   body.rhythm-light  the same, plus one light section ("light") for the work gallery. */

/* the service heroes come up a little so the next section shows; the Work and case study heroes keep their own heights */
body.rhythm .svc-hero:not(.work-hero){min-height:86vh}
body.rhythm .pad:not(.work-group){padding:80px 0}
@media (max-width:720px){body.rhythm .pad:not(.work-group){padding:72px 0}}
body.rhythm .end{min-height:88vh}

body.rhythm section.lifted{padding:88px 0;background:linear-gradient(180deg,rgba(15,28,52,.96),rgba(10,20,38,.97))}
body.rhythm section.lifted::before,body.rhythm section.lifted::after{content:"";position:absolute;left:0;right:0;height:1px;pointer-events:none}
body.rhythm section.lifted::before{top:0;background:linear-gradient(90deg,transparent 4%,color-mix(in srgb,var(--bar) 80%,transparent) 50%,transparent 96%);
  box-shadow:0 0 24px 1px color-mix(in srgb,var(--bar) 45%,transparent)}
body.rhythm section.lifted::after{bottom:0;background:linear-gradient(90deg,transparent,rgba(150,180,255,.14),transparent)}
body.rhythm .lifted .sec-h,body.rhythm .lifted .sec-p{text-shadow:none}
/* cards on a panel sit above it (lighter), not sunk into it */
body.rhythm .lifted .card,body.rhythm .lifted .qa{background:rgba(30,48,82,.5);border-color:rgba(150,180,255,.17)}
body.rhythm .lifted .bar{background:rgba(255,255,255,.06)}

body.rhythm-light section.light{padding:88px 0;background:#eef1f8;color:#0d1526}
body.rhythm-light .light .sec-h{color:#0b1220;text-shadow:none}
body.rhythm-light .light .sec-p{color:#46506a;text-shadow:none}
body.rhythm-light .light .tile{background:#fff;box-shadow:0 1px 0 rgba(13,21,38,.04),0 22px 44px -26px rgba(13,21,38,.4),0 0 0 1px #dde3ef,
  0 0 0 1.5px rgb(62 230 196 / calc(var(--lit) * .9)),0 0 calc(var(--lit) * 38px) calc(var(--lit) * 2px) rgb(62 230 196 / calc(var(--lit) * .45))}
body.rhythm-light .light .tile .mat{background:radial-gradient(closest-side,rgba(91,140,255,.08),transparent),#f5f7fb}
body.rhythm-light .light .tile .cap{background:#fff;color:#0d1526;border-top-color:#e6eaf2}
body.rhythm-light .light .tile img{box-shadow:0 12px 30px -14px rgba(13,21,38,.45)}
body.rhythm-light .light .serp{box-shadow:0 18px 44px -24px rgba(13,21,38,.45),0 0 0 1px #e1e6ef}
/* over the light section the see-through nav turned a muddy gray; keep it dark */
body.rhythm-light header.top.solid{background:rgba(5,8,15,.95)}
/* the tile that lights up as you scroll keeps its outline on light, without the haze */
body.rhythm-light .light .tile{box-shadow:0 1px 0 rgba(13,21,38,.04),0 22px 44px -26px rgba(13,21,38,.4),0 0 0 1px #dde3ef,0 0 0 2px rgb(22 160 136 / calc(var(--lit) * .9))}