/* Hirondl swallow flight-path motif (WC15, added 2026-06-16).
   Threads the homepage hero's swallow flight-path curve through the rest of
   the site so the brand reads as one whole (creative-audit item #4). Loaded
   from each page's <head> AFTER its inline <style> so these rules win on ties.

   The curves are the SAME geometry as the animated homepage hero (index.html
   .hero .hero-bg), here rendered FAINT and STATIC as a background accent on the
   large navy surfaces: the interior page heroes (.page-hero) and the footer
   (every page). CSS only, no markup changes, no JavaScript.

   Motion: nothing animates here, so there is nothing to disable under
   prefers-reduced-motion. The curves sit behind content (background layer), so
   they never affect text contrast or interaction. */

/* ── Interior page heroes: faint flight-path sweeping in from the top-right,
   clear of the left-aligned hero text. Same three curves as the homepage. ──
   Some page heroes are plain navy (e.g. /privacy.html) and some sit transparent
   over a photo wrapper + dark gradient (e.g. /how-we-work, /team, /insights,
   /case-studies). To render the same motif on BOTH cases with one rule, the
   curves go on a `::after` overlay rather than the element background:

   - `isolation:isolate` makes every .page-hero its own stacking context, so the
     `z-index:-1` overlay below is scoped to the hero. On a navy hero it paints
     just above the navy fill; on a photo hero it paints above the photo's dark
     gradient overlay (which sits below at z-index:0); either way ABOVE the
     backdrop and BELOW the in-flow hero text, so contrast is never affected.
   - `pointer-events:none` keeps it purely decorative.
   .page-hero is position:relative;overflow:hidden, so the curves are clipped to
   the hero block. */
.page-hero{ isolation:isolate; }
.page-hero::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 900' fill='none' preserveAspectRatio='xMaxYMid slice'%3E%3Cpath d='M600 0 Q420 300 300 450 Q180 600 220 900' stroke='white' stroke-opacity='0.10' stroke-width='1.5'/%3E%3Cpath d='M660 60 Q480 360 360 510 Q240 660 280 960' stroke='white' stroke-opacity='0.07' stroke-width='1.2'/%3E%3Cpath d='M540 -60 Q360 240 240 390 Q120 540 160 840' stroke='white' stroke-opacity='0.05' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:top right;
  background-size:auto 160%;
}

/* ── Footer: a wide, gentle swoop anchored to the right, echoing the same
   flight-path on every page so the motif closes the page consistently. ──
   footer sets `background:var(--navy)`; the same layering applies. The footer
   is a short, wide strip so it uses a landscape curve set rather than the tall
   hero geometry. */
footer{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 220' fill='none' preserveAspectRatio='xMaxYMid slice'%3E%3Cpath d='M0 205 Q400 185 700 110 Q950 50 1200 8' stroke='white' stroke-opacity='0.08' stroke-width='1.5'/%3E%3Cpath d='M0 220 Q430 200 770 132 Q1010 78 1200 42' stroke='white' stroke-opacity='0.05' stroke-width='1.2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right center;
  background-size:60% 100%;
}
