@keyframes ambientFall{0%{transform:translateY(-90px) scaleY(1);opacity:0;}16%{opacity:1;}82%{opacity:1;}100%{transform:translateY(760px) scaleY(1.2);opacity:0;}}
@keyframes incoming{0%{transform:translate(-50%,-120px) scaleY(.95);opacity:0;}22%{opacity:.85;}84%{transform:translate(-50%,-6px) scaleY(1.15);opacity:.85;}100%{transform:translate(-50%,4px) scaleY(1.3);opacity:0;}}
@keyframes meltDrip{0%{transform:translateX(-50%) translateY(-6px) scale(.25);opacity:0;}45%{opacity:.92;}100%{transform:translateX(-50%) translateY(7px) scale(1);opacity:.92;}}
@keyframes meltWobble{0%{transform:skewX(0deg) translateY(0) scaleY(1);}25%{transform:skewX(-2deg) translateY(.6px) scaleY(1.02);}55%{transform:skewX(1.6deg) translateY(1px) scaleY(.98);}80%{transform:skewX(-.8deg) translateY(.4px) scaleY(1.01);}100%{transform:skewX(0deg) translateY(0) scaleY(1);}}
@keyframes slideInLeft{0%{opacity:0;transform:translateX(-110px);}100%{opacity:1;transform:translateX(0);}}
@keyframes closingWobble{0%{transform:rotate(-.45deg) skewX(.3deg);}50%{transform:rotate(.45deg) skewX(-.3deg);}100%{transform:rotate(-.45deg) skewX(.3deg);}}

.pbRoot{
  position:relative;width:100%;min-height:100vh;overflow:hidden;
  background:#EEEBE3; /* deep-cream panel — deliberately deeper than the site's off-white */
  display:flex;align-items:center;justify-content:center;
  font-family:'Inter',sans-serif;
}
.pbRoot a{ color:#C85A34; text-decoration:none; }
.pbRoot a:hover{ color:#FF7A54; }

.pbDrops{ position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:1;z-index:0; }
.pbDrop{ position:absolute;top:0;background:rgba(15,27,61,.10);border-radius:50% 50% 50% 50%/62% 62% 38% 38%;filter:blur(.6px); }

.pbInner{ position:relative;z-index:2;max-width:1180px;padding:110px 44px; }

.pbEyebrow{
  font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:#C85A34;
  opacity:0;transform:translateY(44px);filter:blur(7px);
  transition:opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1), filter .8s ease;
}
.pbHeadline{
  margin:22px 0 46px;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:clamp(34px,6vw,58px);
  line-height:1.08;letter-spacing:-.02em;color:#0F1B3D;max-width:900px;
  opacity:0;transform:translateY(52px);filter:blur(9px);
  transition:opacity .9s ease, transform .9s cubic-bezier(.2,.8,.2,1), filter .9s ease;transition-delay:.14s;
}
.pbRoot.revealed .pbEyebrow{ opacity:1;transform:translateY(0);filter:blur(0); }
.pbRoot.revealed .pbHeadline{ opacity:1;transform:translateY(0);filter:blur(0); }

.pbTagsRow{ position:relative;display:flex;gap:clamp(10px,1vw,20px);align-items:flex-end;flex-wrap:nowrap;min-height:240px; }
.pbTagCol{ display:flex;flex-direction:column;justify-content:flex-end;height:240px; }
.pbTagColInner{
  position:relative;opacity:0;transform:translateY(22px);
  transition:opacity .6s ease, transform .6s ease;
}
.pbRoot.revealed .pbTagColInner{ opacity:1;transform:translateY(0); }

.pbDropIncoming{
  position:absolute;left:50%;top:0;width:10px;height:15px;background:rgba(15,27,61,.10);
  border-radius:50% 50% 50% 50%/62% 62% 38% 38%;filter:blur(.5px);opacity:0;z-index:4;
}
.pbDrip{
  position:absolute;top:calc(100% - 6px);width:11px;height:16px;background:#C42B1C;
  border-radius:46% 54% 50% 50%/38% 42% 64% 60%;filter:blur(.4px);opacity:0;z-index:0;
}
.pbDrip1{ left:34%; }
.pbDrip2{ left:62%;width:8px;height:13px;border-radius:52% 48% 50% 50%/40% 44% 60% 58%; }

.pbTag{
  position:relative;z-index:2;padding:11px 17px;
  background:rgba(255,122,84,.06);
  border:1px solid rgba(15,27,61,.42);
  border-radius:47% 53% 58% 42% / 56% 54% 46% 44%;
  box-shadow:0 0 22px rgba(255,122,84,.36), 0 6px 16px rgba(15,27,61,.1);
  transition:background .55s ease, border-color .55s ease, border-radius .6s ease, box-shadow .55s ease;
}
.pbTagCol:nth-child(2) .pbTag{ border-radius:52% 48% 55% 45% / 60% 50% 50% 40%; }
.pbTagCol:nth-child(3) .pbTag{ border-radius:45% 55% 60% 40% / 54% 58% 42% 46%; }
.pbTagCol:nth-child(4) .pbTag{ border-radius:50% 50% 56% 44% / 58% 52% 48% 42%; }
.pbTagCol:nth-child(5) .pbTag{ border-radius:48% 52% 57% 43% / 55% 56% 44% 45%; }

.pbTag span{
  position:relative;z-index:3;display:block;font-family:'Inter',sans-serif;font-weight:500;
  font-size:clamp(11px,1.05vw,15px);white-space:nowrap;color:#0F1B3D;transition:color .5s ease;
}

/* hover melt-preview — reversible, only while the tag hasn't been hit yet */
.pbTagColInner:hover .pbTag:not(.hit){ animation:meltWobble 1.3s ease-in-out infinite; }

/* ---- hit state: drop lands, tag melts to alarm coral-red, edges deform ---- */
.pbTagColInner.hit .pbDropIncoming{ animation:incoming .7s ease-in both; }
.pbTagColInner.hit .pbDrip1{ animation:meltDrip .8s ease-out .28s both; }
.pbTagColInner.hit .pbDrip2{ animation:meltDrip .9s ease-out .42s both; }
.pbTagColInner.hit .pbTag{
  background:rgba(196,43,28,.17);
  border:1px solid rgba(196,43,28,.72);
  box-shadow:0 0 26px rgba(196,43,28,.5), 0 6px 16px rgba(15,27,61,.12);
  border-radius:48% 52% 44% 56% / 40% 44% 66% 60%;
}
.pbTagColInner.hit .pbTag span{ color:#B02414; }
/* per-column melted radius variants (matches the source's per-tag organic melt shapes) */
.pbTagCol:nth-child(2) .pbTagColInner.hit .pbTag{ border-radius:52% 48% 42% 58% / 42% 40% 64% 68%; }
.pbTagCol:nth-child(3) .pbTagColInner.hit .pbTag{ border-radius:46% 54% 46% 54% / 38% 46% 68% 62%; }
.pbTagCol:nth-child(4) .pbTagColInner.hit .pbTag{ border-radius:50% 50% 40% 60% / 44% 42% 62% 66%; }
.pbTagCol:nth-child(5) .pbTagColInner.hit .pbTag{ border-radius:48% 52% 45% 55% / 40% 45% 65% 64%; }

.pbClosingWrap{ opacity:0; }
.pbRoot.revealed .pbClosingWrap{ animation:slideInLeft .95s cubic-bezier(.2,.85,.25,1) 8.2s both; }
.pbClosing{
  display:inline-block;transform-origin:left center;margin:54px 0 0;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:clamp(30px,3.4vw,46px);
  line-height:1.2;letter-spacing:-.02em;color:#0F1B3D;max-width:940px;
}
.pbRoot.revealed .pbClosing{ animation:closingWobble 9s ease-in-out 9.5s infinite; }
.pbDiag{ color:#C85A34; }

@media(max-width:1024px){
  .pbTagsRow{ flex-wrap:wrap;justify-content:center;min-height:0;gap:16px; }
  .pbTagCol{ height:auto; }
  .pbTagCol .pbTagColInner{ margin-bottom:0 !important; }
  .pbTag span{ white-space:normal;font-size:14px; }
}
@media(max-width:768px){
  .pbInner{ padding:88px 24px; }
  .pbDrops .pbDrop:nth-child(n+4){ display:none; }
}
@media(max-width:600px){
  .pbInner{ padding:76px 18px; }
  .pbTagsRow{ gap:8px;max-width:420px;margin-left:auto;margin-right:auto; }
  .pbTagCol{ width:calc(33.333% - 6px); }
  .pbTag{ display:flex;justify-content:center;padding:8px 9px; }
  .pbTag span{ font-size:11px;line-height:1.25;text-align:center; }
}

@media (prefers-reduced-motion: reduce){
  .pbDrop, .pbDropIncoming, .pbDrip, .pbTagColInner:hover .pbTag, .pbClosing{ animation:none !important; }
}