/* ---------- flight lines: added on top of the existing site, nothing replaced ----------
   The birds get their own room. Squeezing them into the old spacing is what made
   them read as clutter, so every surface that hosts one grows a band for it. */
.hero{padding-bottom:150px}
/* The hero carries one column now. The text keeps a reading measure and the
   rest of the band is sky, which is where the flock wanted to be anyway. */
.hero-in{grid-template-columns:1fr}
.hero-in>div{max-width:60ch}
.hero-in h1{max-width:18ch}
.ph{padding-bottom:104px}
.sec{padding-block:30px 78px}
.head{margin-bottom:38px}
.seats-in{padding-bottom:74px}
.ev-row, .shift, .qc, .post{padding-bottom:44px}
@media (max-width:860px){
  .hero{padding-bottom:112px}
  .ph{padding-bottom:78px}
  .sec{padding-block:22px 58px}
  .head{margin-bottom:28px}
  .seats-in{padding-bottom:56px}
  .ev-row, .shift, .qc, .post{padding-bottom:36px}
}

.fl-stage{position:relative}
.fl-stage > svg.fl, .fl-stage > svg.fl-dress{position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; pointer-events:none}
.hero .wrap, .ph .wrap, .seats-in > *{position:relative; z-index:1}

/* the hero's decorative layer keeps its place; only what is drawn in it changes */
.motif.fl-motif{top:0; right:0; left:0; bottom:0; width:auto; height:auto; opacity:1}

/* the mark under a page title — static, drawn once */
.head h2, .ph h1{position:relative; display:inline-block}
.head h2 svg.fl-ul, .ph h1 svg.fl-ul{
  position:absolute; left:-2px; bottom:-13px; width:calc(100% + 10px); height:12px; display:block; overflow:visible;
}

/* a rule birds can sit on, between sections */
.fl-perch{position:relative; height:132px; margin-top:6px}
.fl-perch svg{position:absolute; inset:0; width:100%; height:100%; display:block}

/* footer, where the flock leaves */
footer{position:relative; overflow:hidden}
footer > svg.fl{position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0}
footer .wrap{position:relative; z-index:1}

/* the fallback when a drawing throws instead of drawing: a small honest note
   at the top of the page, not a stuck error screen */
.fl-error{background:var(--wash); border-radius:16px; padding:16px 18px; margin-block:24px 0; font-size:14.5px; color:var(--ink-2)}
.fl-error a{color:var(--blue)}

/* review control, would not ship */
.fl-pick{
  position:fixed; left:16px; bottom:16px; z-index:60; display:flex; gap:4px; align-items:center;
  background:var(--deep); color:var(--deep-ink); padding:5px 6px 5px 13px; border-radius:100px;
  box-shadow:0 10px 28px -14px rgba(31,42,94,.6);
}
.fl-pick b{font-family:var(--mono); font-size:10px; letter-spacing:.09em; text-transform:uppercase; opacity:.72; font-weight:500}
.fl-pick button{
  font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.06em; text-transform:uppercase;
  padding:7px 12px; border-radius:100px; border:0; background:transparent; color:#B9C2DE; cursor:pointer;
}
.fl-pick button[aria-pressed="true"]{background:#8FB6F5; color:#0D1524}
@media (max-width:700px){ .fl-pick{left:10px; bottom:10px; padding-left:10px} .fl-pick b{display:none} }
