/* ==========================================================================
   Page hero — shared shell + per-page motion
   For: about, industries, insights, contact
   ========================================================================== */

.page-hero--animated{
  position: relative;
  padding-block: clamp(2.5rem, 5vw, 4rem);
  overflow: hidden;
}
.pgh__inner{
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
}
@media (max-width: 820px){
  .pgh__inner{ grid-template-columns: 1fr; }
}
.pgh__copy h1{ margin-top: .35em; }

/* The art holder */
.pgh-art{
  position: relative;
  width: 100%;
  max-width: 540px;
  margin-inline: auto;
  aspect-ratio: 1 / 1;
}
.pgh-art svg{ width:100%; height:100%; display:block; }

/* ============================ INDUSTRIES ==============================
   Six sector tiles morphing — each represents one industry pattern
   pulsing into focus in a 3-column hex grid
   ===================================================================== */
.pgh-art--industries .ind-tile{
  opacity: 0;
  transform-origin: center; transform-box: fill-box;
  animation: ind-tile-in .7s cubic-bezier(.2,.9,.3,1.3) forwards;
}
.pgh-art--industries .ind-tile:nth-of-type(1){ animation-delay: .1s; }
.pgh-art--industries .ind-tile:nth-of-type(2){ animation-delay: .25s; }
.pgh-art--industries .ind-tile:nth-of-type(3){ animation-delay: .4s; }
.pgh-art--industries .ind-tile:nth-of-type(4){ animation-delay: .55s; }
.pgh-art--industries .ind-tile:nth-of-type(5){ animation-delay: .7s; }
.pgh-art--industries .ind-tile:nth-of-type(6){ animation-delay: .85s; }
@keyframes ind-tile-in{
  0%{ opacity: 0; transform: scale(.5) rotate(-12deg); }
  60%{ opacity: 1; transform: scale(1.08) rotate(2deg); }
  100%{ opacity: 1; transform: scale(1) rotate(0); }
}
.pgh-art--industries .ind-tile__hex{
  transform-origin: center; transform-box: fill-box;
  animation: ind-tile-breathe 4s ease-in-out infinite;
}
.pgh-art--industries .ind-tile:nth-of-type(2) .ind-tile__hex{ animation-delay: .5s; }
.pgh-art--industries .ind-tile:nth-of-type(3) .ind-tile__hex{ animation-delay: 1.0s; }
.pgh-art--industries .ind-tile:nth-of-type(4) .ind-tile__hex{ animation-delay: 1.5s; }
.pgh-art--industries .ind-tile:nth-of-type(5) .ind-tile__hex{ animation-delay: 2.0s; }
.pgh-art--industries .ind-tile:nth-of-type(6) .ind-tile__hex{ animation-delay: 2.5s; }
@keyframes ind-tile-breathe{
  0%, 100%{ filter: drop-shadow(0 6px 18px rgba(238,144,2,0.18)); }
  50%{ filter: drop-shadow(0 10px 28px rgba(193,38,140,0.35)); }
}
.pgh-art--industries .ind-link{
  stroke-dasharray: 4 5;
  stroke-dashoffset: 0;
  animation: ind-link-flow 6s linear infinite;
  opacity: 0;
  animation-delay: 1s;
}
@keyframes ind-link-flow{
  0%{ opacity: 0; stroke-dashoffset: 0; }
  10%{ opacity: .55; }
  90%{ opacity: .55; }
  100%{ opacity: 0; stroke-dashoffset: -100; }
}

/* Background ghost lattice — subtle hex outlines pulse softly */
.pgh-art--industries .ind-lattice use{
  transform-origin: center; transform-box: fill-box;
  animation: ind-lattice-pulse 5s ease-in-out infinite;
}
.pgh-art--industries .ind-lattice use:nth-of-type(2n){ animation-delay: 1.2s; }
.pgh-art--industries .ind-lattice use:nth-of-type(3n){ animation-delay: 2.4s; }
.pgh-art--industries .ind-lattice use:nth-of-type(5n){ animation-delay: 3.6s; }
@keyframes ind-lattice-pulse{
  0%, 100%{ opacity: .25; }
  50%{ opacity: .55; }
}

/* Honey-trail flowing dashes around the hive perimeter */
.pgh-art--industries .ind-honey-trail{
  stroke-dashoffset: 0;
  animation: ind-honey-flow 4.5s linear infinite;
  filter: drop-shadow(0 0 6px rgba(253,184,19,.55));
}
@keyframes ind-honey-flow{
  to{ stroke-dashoffset: -140; }
}

/* Queen-bee centerpiece: gentle glow & rotation */
.pgh-art--industries .ind-core{
  transform-origin: 270px 295px; transform-box: view-box;
  animation: ind-core-spin 14s linear infinite;
  filter: drop-shadow(0 4px 14px rgba(253,184,19,.55));
}
@keyframes ind-core-spin{
  to{ transform: translate(270px, 295px) rotate(360deg); }
}

/* Flying bee follows the honey path; wings flutter; pollen sparks twinkle */
.pgh-art--industries .ind-bee{
  offset-path: path("M 145,165 Q 207,120 270,165 Q 332,210 395,165 Q 460,230 395,295 Q 460,360 395,425 Q 332,380 270,425 Q 207,380 145,425 Q 80,360 145,295 Q 80,230 145,165 Z");
  offset-rotate: auto;
  animation: ind-bee-fly 14s linear infinite;
  filter: drop-shadow(0 3px 6px rgba(0,0,0,.25));
}
@keyframes ind-bee-fly{
  to{ offset-distance: 100%; }
}
.pgh-art--industries .ind-bee-wingL,
.pgh-art--industries .ind-bee-wingR{
  transform-origin: center; transform-box: fill-box;
  animation: ind-bee-wing 90ms ease-in-out infinite alternate;
}
.pgh-art--industries .ind-bee-wingR{ animation-delay: 45ms; }
@keyframes ind-bee-wing{
  from{ transform: scaleY(1) rotate(0); }
  to  { transform: scaleY(.5) rotate(8deg); }
}

.pgh-art--industries .ind-pollen .p{
  transform-origin: center; transform-box: fill-box;
  animation: ind-pollen-twinkle 3.2s ease-in-out infinite;
  filter: drop-shadow(0 0 4px rgba(253,184,19,.7));
}
.pgh-art--industries .ind-pollen .p:nth-of-type(2){ animation-delay: .5s; }
.pgh-art--industries .ind-pollen .p:nth-of-type(3){ animation-delay: 1.0s; }
.pgh-art--industries .ind-pollen .p:nth-of-type(4){ animation-delay: 1.5s; }
.pgh-art--industries .ind-pollen .p:nth-of-type(5){ animation-delay: 2.0s; }
.pgh-art--industries .ind-pollen .p:nth-of-type(6){ animation-delay: 2.5s; }
@keyframes ind-pollen-twinkle{
  0%, 100%{ transform: scale(.6); opacity: .35; }
  50%     { transform: scale(1.4); opacity: 1; }
}

@media (prefers-reduced-motion: reduce){
  .pgh-art--industries .ind-bee,
  .pgh-art--industries .ind-bee-wingL,
  .pgh-art--industries .ind-bee-wingR,
  .pgh-art--industries .ind-honey-trail,
  .pgh-art--industries .ind-core,
  .pgh-art--industries .ind-pollen .p,
  .pgh-art--industries .ind-lattice use{
    animation: none;
  }
}

/* ============================== INSIGHTS ===============================
   A "stream" of article cards drifting upward, with annotation
   marks (highlighter swipes) and a floating orb of ideas
   ====================================================================== */
.pgh-art--insights .ins-card{
  transform-origin: center; transform-box: fill-box;
  animation: ins-drift 9s ease-in-out infinite;
  filter: drop-shadow(0 8px 24px rgba(126,63,191,0.18));
}
.pgh-art--insights .ins-card:nth-of-type(1){ animation-delay: 0s; }
.pgh-art--insights .ins-card:nth-of-type(2){ animation-delay: -3s; }
.pgh-art--insights .ins-card:nth-of-type(3){ animation-delay: -6s; }
@keyframes ins-drift{
  0%, 100%{ transform: translateY(0) rotate(-2deg); }
  50%{ transform: translateY(-12px) rotate(2deg); }
}
.pgh-art--insights .ins-highlight{
  transform-origin: left center; transform-box: fill-box;
  animation: ins-highlight-sweep 4s ease-in-out infinite;
  opacity: 0;
}
.pgh-art--insights .ins-highlight:nth-of-type(1){ animation-delay: 1.0s; }
.pgh-art--insights .ins-highlight:nth-of-type(2){ animation-delay: 2.5s; }
.pgh-art--insights .ins-highlight:nth-of-type(3){ animation-delay: 4.0s; }
@keyframes ins-highlight-sweep{
  0%{ opacity: 0; transform: scaleX(0); }
  20%{ opacity: 1; transform: scaleX(1); }
  80%{ opacity: 1; transform: scaleX(1); }
  100%{ opacity: 0; transform: scaleX(1); }
}
.pgh-art--insights .ins-orb{
  transform-origin: center; transform-box: fill-box;
  animation: ins-orb-pulse 3.5s ease-in-out infinite;
}
@keyframes ins-orb-pulse{
  0%, 100%{ transform: scale(.95); opacity: .85; }
  50%{ transform: scale(1.08); opacity: 1; }
}
.pgh-art--insights .ins-orb__ring{
  transform-origin: center; transform-box: fill-box;
  animation: ins-orb-ring 5s linear infinite;
}
@keyframes ins-orb-ring{ to{ transform: rotate(360deg); } }
.pgh-art--insights .ins-spark{
  transform-origin: center; transform-box: fill-box;
  animation: ins-spark-twinkle 2.5s ease-in-out infinite;
}
.pgh-art--insights .ins-spark:nth-of-type(2){ animation-delay: .8s; }
.pgh-art--insights .ins-spark:nth-of-type(3){ animation-delay: 1.6s; }
.pgh-art--insights .ins-spark:nth-of-type(4){ animation-delay: 2.0s; }
@keyframes ins-spark-twinkle{
  0%, 100%{ opacity: .3; transform: scale(.7); }
  50%{ opacity: 1; transform: scale(1.2); }
}

/* ----- Bee + honeycomb branding ----- */
.pgh-art--insights .ins-hex{
  transform-origin: center; transform-box: fill-box;
  animation: ins-hex-breathe 3.6s ease-in-out infinite;
}
.pgh-art--insights .ins-hive .ins-hex:nth-of-type(2){ animation-delay: .6s; }
.pgh-art--insights .ins-hive .ins-hex:nth-of-type(3){ animation-delay: 1.2s; }
@keyframes ins-hex-breathe{
  0%, 100%{ opacity: var(--o, .55); transform: scale(1) rotate(0deg); }
  50%{ opacity: 1; transform: scale(1.04) rotate(2deg); filter: drop-shadow(0 4px 8px rgba(253,184,19,.45)); }
}
.pgh-art--insights .ins-bee-trail{
  stroke-dasharray: 6 8;
  animation: ins-trail-flow 6s linear infinite;
  opacity: .7;
}
@keyframes ins-trail-flow{
  to{ stroke-dashoffset: -200; }
}
.pgh-art--insights .ins-bee{
  offset-path: path("M 110,130 C 230,40 410,80 460,200 C 500,320 360,420 240,360 C 140,310 60,210 110,130 Z");
  offset-rotate: auto;
  animation: ins-bee-fly 14s linear infinite;
  filter: drop-shadow(0 4px 10px rgba(253,184,19,.55));
}
@keyframes ins-bee-fly{
  to{ offset-distance: 100%; }
}
.pgh-art--insights .ins-bee-wingL,
.pgh-art--insights .ins-bee-wingR{
  transform-origin: center bottom; transform-box: fill-box;
  animation: ins-bee-wing 90ms ease-in-out infinite alternate;
}
.pgh-art--insights .ins-bee-wingR{ animation-delay: 45ms; }
@keyframes ins-bee-wing{
  from{ transform: scaleY(1); }
  to{   transform: scaleY(.45); }
}

/* ================================ ABOUT ================================
   Beehive — stacked honeycomb cells (team roles) with multiple bees
   flying around it on independent paths, honey trail glowing.
   ====================================================================== */

/* Cells pop into place with a slight bounce, then breathe */
.pgh-art--about .ab-cell{
  opacity: 0;
  transform-origin: center; transform-box: fill-box;
  animation: ab-cell-in .6s cubic-bezier(.2,.9,.3,1.4) forwards,
             ab-cell-breathe 4.5s ease-in-out 1.2s infinite;
}
.pgh-art--about .ab-cell:nth-of-type(1){ animation-delay: .15s, 1.2s; }
.pgh-art--about .ab-cell:nth-of-type(2){ animation-delay: .30s, 1.5s; }
.pgh-art--about .ab-cell:nth-of-type(3){ animation-delay: .45s, 1.8s; }
.pgh-art--about .ab-cell:nth-of-type(4){ animation-delay: .60s, 2.1s; }
.pgh-art--about .ab-cell:nth-of-type(5){ animation-delay: .75s, 2.4s; }
@keyframes ab-cell-in{
  0%{ opacity: 0; transform: scale(.4) rotate(-8deg); }
  60%{ opacity: 1; transform: scale(1.08) rotate(2deg); }
  100%{ opacity: 1; transform: scale(1) rotate(0); }
}
@keyframes ab-cell-breathe{
  0%, 100%{ filter: drop-shadow(0 4px 10px rgba(238,144,2,0.18)); }
  50%     { filter: drop-shadow(0 8px 22px rgba(253,184,19,0.45)); }
}

/* Core hex with the Ekonbee mark — gentle pulse */
.pgh-art--about .ab-core{
  transform-origin: 280px 332px; transform-box: view-box;
  animation: ab-core-pulse 4s ease-in-out infinite;
  filter: drop-shadow(0 6px 20px rgba(238,144,2,.55));
}
@keyframes ab-core-pulse{
  0%, 100%{ transform: scale(1); }
  50%     { transform: scale(1.04); }
}

/* Honey-trail outline flows around hive perimeter */
.pgh-art--about .ab-honey-path{
  animation: ab-honey-flow 5s linear infinite;
  filter: drop-shadow(0 0 6px rgba(253,184,19,.55));
}
@keyframes ab-honey-flow{
  to{ stroke-dashoffset: -140; }
}

/* Background lattice pulses */
.pgh-art--about .ab-lattice use{
  transform-origin: center; transform-box: fill-box;
  animation: ab-lattice-pulse 6s ease-in-out infinite;
}
.pgh-art--about .ab-lattice use:nth-of-type(2n){ animation-delay: 1.5s; }
.pgh-art--about .ab-lattice use:nth-of-type(3n){ animation-delay: 3s; }
@keyframes ab-lattice-pulse{
  0%, 100%{ opacity: .15; }
  50%     { opacity: .35; }
}

/* THREE bees on independent looping orbits around the hive */
.pgh-art--about .ab-fly{
  offset-rotate: auto;
  filter: drop-shadow(0 3px 6px rgba(0,0,0,.25));
}
/* Outer wide loop — long oval orbit */
.pgh-art--about .ab-fly--1{
  offset-path: path("M 60,140 C 200,40 380,40 500,140 C 560,260 480,440 320,490 C 160,520 40,400 60,260 Z");
  animation: ab-bee-fly1 16s linear infinite;
}
@keyframes ab-bee-fly1{ to{ offset-distance: 100%; } }

/* Mid figure-8 around the upper cells */
.pgh-art--about .ab-fly--2{
  offset-path: path("M 130,200 C 220,100 320,100 420,200 C 520,290 420,420 320,330 C 220,250 220,330 130,420 C 50,330 50,290 130,200 Z");
  animation: ab-bee-fly2 13s linear infinite reverse;
}
@keyframes ab-bee-fly2{ to{ offset-distance: 100%; } }

/* Tight inner loop around the core */
.pgh-art--about .ab-fly--3{
  offset-path: path("M 200,310 C 240,250 320,250 360,310 C 400,370 320,420 280,400 C 240,420 160,370 200,310 Z");
  animation: ab-bee-fly3 9s linear infinite;
}
@keyframes ab-bee-fly3{ to{ offset-distance: 100%; } }

/* Wing flutter on every bee */
.pgh-art--about .ab-wing{
  transform-origin: center; transform-box: fill-box;
  animation: ab-wing-flutter 90ms ease-in-out infinite alternate;
}
.pgh-art--about .ab-wing--r{ animation-delay: 45ms; }
@keyframes ab-wing-flutter{
  from{ transform: scaleY(1); }
  to  { transform: scaleY(.4) translateY(-1px); }
}

/* Pollen sparks twinkle */
.pgh-art--about .ab-pollen .p{
  transform-origin: center; transform-box: fill-box;
  animation: ab-pollen-twinkle 3.5s ease-in-out infinite;
  filter: drop-shadow(0 0 4px rgba(253,184,19,.7));
}
.pgh-art--about .ab-pollen .p:nth-of-type(2){ animation-delay: .6s; }
.pgh-art--about .ab-pollen .p:nth-of-type(3){ animation-delay: 1.2s; }
.pgh-art--about .ab-pollen .p:nth-of-type(4){ animation-delay: 1.8s; }
.pgh-art--about .ab-pollen .p:nth-of-type(5){ animation-delay: 2.4s; }
.pgh-art--about .ab-pollen .p:nth-of-type(6){ animation-delay: 3.0s; }
@keyframes ab-pollen-twinkle{
  0%, 100%{ transform: scale(.5); opacity: .3; }
  50%     { transform: scale(1.4); opacity: 1; }
}

@media (prefers-reduced-motion: reduce){
  .pgh-art--about .ab-cell,
  .pgh-art--about .ab-core,
  .pgh-art--about .ab-honey-path,
  .pgh-art--about .ab-lattice use,
  .pgh-art--about .ab-fly,
  .pgh-art--about .ab-wing,
  .pgh-art--about .ab-pollen .p{
    animation: none;
  }
}

/* =============================== CONTACT ===============================
   Flat-projected world map with continent silhouettes; four office
   pins drop in and the HQ→outposts arcs draw with a paper plane
   ====================================================================== */
.pgh-art--contact{
  max-width: 720px;
  aspect-ratio: 720 / 420;
}

/* Subtle graticule grid */
.pgh-art--contact .ct-grid line{
  stroke: rgba(193,38,140,0.10);
  stroke-width: 0.6;
  stroke-dasharray: 2 4;
}

/* Continent silhouettes — each path fades + lifts in */
.pgh-art--contact .ct-land path{
  opacity: 0;
  transform: translateY(8px);
  transform-origin: center; transform-box: fill-box;
  animation: ct-land-in .9s ease-out forwards;
}
.pgh-art--contact .ct-land path:nth-of-type(1){ animation-delay: .05s; }
.pgh-art--contact .ct-land path:nth-of-type(2){ animation-delay: .12s; }
.pgh-art--contact .ct-land path:nth-of-type(3){ animation-delay: .19s; }
.pgh-art--contact .ct-land path:nth-of-type(4){ animation-delay: .26s; }
.pgh-art--contact .ct-land path:nth-of-type(5){ animation-delay: .33s; }
.pgh-art--contact .ct-land path:nth-of-type(6){ animation-delay: .40s; }
.pgh-art--contact .ct-land path:nth-of-type(7){ animation-delay: .47s; }
.pgh-art--contact .ct-land path:nth-of-type(8){ animation-delay: .54s; }
.pgh-art--contact .ct-land path:nth-of-type(9){ animation-delay: .61s; }
.pgh-art--contact .ct-land path:nth-of-type(10){ animation-delay: .68s; }
.pgh-art--contact .ct-land path:nth-of-type(11){ animation-delay: .75s; }
.pgh-art--contact .ct-land path:nth-of-type(12){ animation-delay: .82s; }
.pgh-art--contact .ct-land path:nth-of-type(n+13){ animation-delay: .89s; }
@keyframes ct-land-in{
  to{ opacity: 1; transform: translateY(0); }
}

/* City pins drop in after the land settles */
.pgh-art--contact .ct-pin{
  opacity: 0;
  transform-origin: center; transform-box: fill-box;
  animation: ct-pin-drop .7s cubic-bezier(.2,.9,.3,1.4) forwards;
}
.pgh-art--contact .ct-pin--ams{ animation-delay: 1.05s; }
.pgh-art--contact .ct-pin--dxb{ animation-delay: 1.30s; }
.pgh-art--contact .ct-pin--bbi{ animation-delay: 1.55s; }
.pgh-art--contact .ct-pin--blr{ animation-delay: 1.80s; }
@keyframes ct-pin-drop{
  0%{ opacity: 0; transform: translateY(-22px) scale(.5); }
  60%{ opacity: 1; transform: translateY(3px) scale(1.1); }
  100%{ opacity: 1; transform: translateY(0) scale(1); }
}

/* Halo pulse around each pin */
.pgh-art--contact .ct-pin__halo{
  transform-origin: center; transform-box: fill-box;
  opacity: .45;
  animation: ct-pin-halo 2.4s ease-in-out infinite;
}
@keyframes ct-pin-halo{
  0%, 100%{ transform: scale(1); opacity: .50; }
  50%{ transform: scale(1.9); opacity: 0; }
}

/* Pin labels — fade in slightly after the pin lands */
.pgh-art--contact .ct-pin__label{
  opacity: 0;
  animation: ct-label-in .5s ease-out forwards;
  animation-delay: inherit;
  filter: drop-shadow(0 2px 6px rgba(20,12,40,0.18));
}
.pgh-art--contact .ct-pin--ams .ct-pin__label{ animation-delay: 1.40s; }
.pgh-art--contact .ct-pin--dxb .ct-pin__label{ animation-delay: 1.65s; }
.pgh-art--contact .ct-pin--bbi .ct-pin__label{ animation-delay: 1.90s; }
.pgh-art--contact .ct-pin--blr .ct-pin__label{ animation-delay: 2.15s; }
@keyframes ct-label-in{ to{ opacity: 1; } }

/* Connection arcs — each draws on with its own delay, then loops gently */
.pgh-art--contact .ct-arc{
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  filter: drop-shadow(0 0 5px rgba(238,144,2,0.55));
  animation: ct-arc-draw 3s ease-in-out forwards;
}
.pgh-art--contact .ct-arc--1{ animation-delay: 1.5s; }
.pgh-art--contact .ct-arc--2{ animation-delay: 1.9s; }
.pgh-art--contact .ct-arc--3{ animation-delay: 2.3s; }
.pgh-art--contact .ct-arc--4{ animation-delay: 2.7s; stroke-dasharray: 200; stroke-dashoffset: 200; }
@keyframes ct-arc-draw{
  to{ stroke-dashoffset: 0; }
}

/* Paper plane traveling Amsterdam → Bangalore on a loop */
.pgh-art--contact .ct-plane{
  filter: drop-shadow(0 0 6px rgba(238,144,2,0.7));
  offset-path: path("M 380,128 Q 470,60 510,225");
  offset-rotate: auto;
  opacity: 0;
  animation: ct-plane-fly 6s ease-in-out 3s infinite;
}
@keyframes ct-plane-fly{
  0%{ offset-distance: 0%; opacity: 0; }
  8%{ opacity: 1; }
  92%{ opacity: 1; }
  100%{ offset-distance: 100%; opacity: 0; }
}

/* ============================ CAREERS ================================
   honeycomb of roles + bee weaving a cloverleaf path through the cells
   ===================================================================== */

/* Filled cells breathe — staggered through the gold→orange→magenta→purple ladder */
.pgh-art--careers .cr-cell{
  transform-origin: center; transform-box: fill-box;
  animation: cr-cell-breathe 4s ease-in-out infinite;
  filter: drop-shadow(0 6px 14px rgba(238,144,2,0.25));
}
.pgh-art--careers .cr-cell:nth-of-type(2){ animation-delay: .8s; filter: drop-shadow(0 6px 14px rgba(193,38,140,0.30)); }
.pgh-art--careers .cr-cell:nth-of-type(3){ animation-delay: 1.6s; filter: drop-shadow(0 6px 14px rgba(126,63,191,0.30)); }
@keyframes cr-cell-breathe{
  0%, 100%{ transform: scale(1); opacity: .92; }
  50%    { transform: scale(1.04); opacity: 1; }
}

/* Ghost lattice pulses softly */
.pgh-art--careers .cr-lattice polygon{
  transform-origin: center; transform-box: fill-box;
  animation: cr-lattice-pulse 5s ease-in-out infinite;
}
.pgh-art--careers .cr-lattice polygon:nth-of-type(2n){ animation-delay: 1.0s; }
.pgh-art--careers .cr-lattice polygon:nth-of-type(3n){ animation-delay: 2.0s; }
@keyframes cr-lattice-pulse{
  0%, 100%{ opacity: .35; }
  50%    { opacity: .8; }
}

/* Honey-trail dashes flow along the flight path */
.pgh-art--careers .cr-trail{
  animation: cr-trail-flow 6s linear infinite;
}
@keyframes cr-trail-flow{ to{ stroke-dashoffset: -120; } }

/* Bee mascot — wings flap, body keeps natural rotation from animateMotion */
.pgh-art--careers .cr-wing{
  transform-origin: 50% 100%; transform-box: fill-box;
  animation: cr-wing-flap 95ms ease-in-out infinite alternate;
}
.pgh-art--careers .cr-wing--front{ animation-delay: 45ms; }
@keyframes cr-wing-flap{
  from{ transform: scaleY(1) rotate(0deg); }
  to  { transform: scaleY(.45) rotate(8deg); }
}
.pgh-art--careers .cr-bee{
  filter: drop-shadow(0 4px 8px rgba(126,63,191,.35));
}

/* Pollen sparks twinkle */
.pgh-art--careers .cr-pollen .p{
  transform-origin: center; transform-box: fill-box;
  filter: drop-shadow(0 0 4px rgba(253,184,19,.7));
  animation: cr-pollen-twinkle 3.2s ease-in-out infinite;
}
.pgh-art--careers .cr-pollen .p:nth-of-type(2){ animation-delay: .5s; }
.pgh-art--careers .cr-pollen .p:nth-of-type(3){ animation-delay: 1.0s; }
.pgh-art--careers .cr-pollen .p:nth-of-type(4){ animation-delay: 1.5s; }
.pgh-art--careers .cr-pollen .p:nth-of-type(5){ animation-delay: 2.0s; }
.pgh-art--careers .cr-pollen .p:nth-of-type(6){ animation-delay: 2.5s; }
@keyframes cr-pollen-twinkle{
  0%, 100%{ transform: scale(.6); opacity: .35; }
  50%    { transform: scale(1.15); opacity: 1; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .pgh-art *{ animation: none !important; transform: none !important; opacity: 1 !important; stroke-dashoffset: 0 !important; }
}