/* v67 pkg (2026-11-08): packaging heading on two lines, glass icons on the three packaging cards,
   client logos lit by the gold storyline dot, "free." written by the dot, jade "Join Our Community" button */

/* ---------- 1. "Lucky for you, / we make packaging stand out." ---------- */
.pkg-head #pkgH{max-width:none!important;width:auto!important;
  margin-left:calc(50% - min(590px,50vw - 20px))!important;margin-right:calc(50% - min(590px,50vw - 20px))!important;
  padding-bottom:.08em;line-height:1!important}
.pkg-head #pkgH>em{display:inline-block;font-weight:400;letter-spacing:-.025em;padding:0 .04em .06em}
@media(min-width:900px){.pkg-head #pkgH>em{white-space:nowrap}}
@media(max-width:560px){.pkg-head #pkgH>em{font-size:.84em}}
.pkg-head>p.pkg-lede{margin-top:clamp(14px,1.8vw,24px)!important;font-size:clamp(15px,1.35vw,18px)}

/* ---------- 2. Glass icons on the three packaging cards (weather-lab family: clear glass, gold rim, light inside) ---------- */
.pcap i.pgi{display:block;width:clamp(76px,6.6vw,92px);height:clamp(76px,6.6vw,92px);margin:-10px 0 6px -10px;padding:0;
  background:none!important;box-shadow:none!important;border-radius:0;overflow:visible;
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.55)) drop-shadow(0 0 10px rgba(246,200,90,.28));
  transition:filter .35s ease,scale .45s cubic-bezier(.3,1.6,.45,1);transform-origin:50% 70%}
.pcap .pgi svg.pgi-svg{width:100%;height:100%;fill:initial;stroke:none;stroke-width:initial;overflow:visible;display:block}
.pcap:hover .pgi{scale:1.07;filter:drop-shadow(0 12px 18px rgba(0,0,0,.55)) drop-shadow(0 0 16px rgba(255,214,120,.55))}
.pcap .pgi.pg-press{animation:pgPress .62s cubic-bezier(.3,1.5,.45,1)}
@keyframes pgPress{0%{scale:1}22%{scale:1.16 .84}48%{scale:.94 1.08}70%{scale:1.03 .98}100%{scale:1}}
.pgi-svg *{transform-box:fill-box}
/* foil card: a light sweep crosses the foil, two sparkles twinkle */
.pgi-foil .pg-tilt{transform-origin:50% 50%;transform:rotate(-6deg)}
.pgi-foil .pg-sweep{translate:-30px 0}
.pgi-foil .pg-star{transform-origin:50% 50%}
.pgi-foil .pg-tw{transform-origin:50% 50%;opacity:.35;scale:.6}
/* gift box: the lid lifts and light spills out */
.pgi-box .pg-lid{transform-origin:20% 100%}
/* globe: meridians turn, the pin bobs */
.pgi-globe .pg-mer{transform-origin:50% 50%}
.pgi-globe .pg-m1{scale:.15 1}.pgi-globe .pg-m2{scale:.62 1}.pgi-globe .pg-m3{scale:.92 1}
.pgi-globe .pg-pin{transform-origin:50% 100%}
.pcaps.pg-on .pgi-foil .pg-sweep{animation:pgSweep 3.6s cubic-bezier(.45,0,.25,1) infinite}
.pcaps.pg-on .pgi-foil .pg-star{animation:pgStar 3.6s ease-in-out infinite}
.pcaps.pg-on .pgi-foil .pg-tw1{animation:pgTw 2.4s ease-in-out infinite}
.pcaps.pg-on .pgi-foil .pg-tw2{animation:pgTw 2.4s ease-in-out -1.2s infinite}
.pcaps.pg-on .pgi-box .pg-lid{animation:pgLid 4.2s cubic-bezier(.3,1.3,.5,1) infinite}
.pcaps.pg-on .pgi-box .pg-glow{animation:pgGlow 4.2s ease-in-out infinite}
.pcaps.pg-on .pgi-globe .pg-m1{animation:pgMer 5.4s linear infinite}
.pcaps.pg-on .pgi-globe .pg-m2{animation:pgMer 5.4s linear -1.8s infinite}
.pcaps.pg-on .pgi-globe .pg-m3{animation:pgMer 5.4s linear -3.6s infinite}
.pcaps.pg-on .pgi-globe .pg-pin{animation:pgPin 3.2s cubic-bezier(.3,1.4,.5,1) infinite}
@keyframes pgSweep{0%,18%{translate:-34px 0}62%,100%{translate:96px 0}}
@keyframes pgStar{0%,30%,100%{scale:1;filter:none}46%{scale:1.12;filter:brightness(1.35) drop-shadow(0 0 4px #ffe6a0)}}
@keyframes pgTw{0%,100%{opacity:.25;scale:.55;rotate:0deg}50%{opacity:1;scale:1.1;rotate:45deg}}
@keyframes pgLid{0%,22%,100%{translate:0 0;rotate:0deg}40%,62%{translate:0 -7px;rotate:-7deg}}
@keyframes pgGlow{0%,22%,100%{opacity:0}42%,60%{opacity:1}}
@keyframes pgMer{0%{scale:-1 1;opacity:.2}25%{opacity:.9}50%{scale:0 1;opacity:.9}75%{opacity:.9}100%{scale:1 1;opacity:.2}}
@keyframes pgPin{0%,60%,100%{translate:0 0;scale:1}72%{translate:0 -5px;scale:1.06 .94}84%{translate:0 0;scale:.96 1.05}}
@media(prefers-reduced-motion:reduce){.pcaps .pgi *,.pcap .pgi{animation:none!important;transition:none!important}}

/* ---------- 4. End section: jade "Join Our Community" button (same jade gel as the header's Start free) ---------- */
.end .button.v67-jade{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:18px;
  margin-top:4px;padding:clamp(14px,1.4vw,18px) clamp(14px,1.3vw,18px) clamp(14px,1.4vw,18px) clamp(24px,2.3vw,34px);
  font:700 clamp(17px,1.6vw,21px)/1.1 "BBB Sans",Arial,sans-serif;letter-spacing:-.01em;color:#eef7e4;text-decoration:none;
  border:1px solid rgba(216,194,122,.7);border-radius:999px;
  background:linear-gradient(115deg,#0b2417 0%,#1b4d31 35%,#2a6a43 52%,#1a4a2d 70%,#0d2a1a 100%);
  box-shadow:inset 0 1px 0 rgba(220,245,210,.36),inset 0 -10px 18px rgba(0,0,0,.36),
    0 14px 40px -10px rgba(40,140,80,.55),0 0 calc(var(--lit,0)*56px) calc(var(--lit,0)*4px) rgba(247,214,120,calc(var(--lit,0)*.32)),0 0 0 1px rgba(0,0,0,.4);
  text-shadow:0 1px 1px rgba(0,0,0,.5);transition:transform .35s cubic-bezier(.3,1.5,.45,1),box-shadow .35s ease,background .35s ease}
.end .button.v67-jade::before{content:"";position:absolute;inset:1px;border-radius:inherit;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(235,255,225,.22),rgba(235,255,225,0) 46%);opacity:.9}
.end .button.v67-jade::after{content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,transparent 35%,rgba(255,240,200,.32) 50%,transparent 65%) 130% 0/250% 100% no-repeat;
  animation:jdSheen 5s ease-in-out 1.2s infinite}
@keyframes jdSheen{0%,55%{background-position:130% 0}85%,100%{background-position:-40% 0}}
.end .button.v67-jade:hover{transform:translateY(-3px) scale(1.03);color:#fff;
  background:linear-gradient(115deg,#0d2c1c 0%,#215a38 35%,#318050 52%,#1d5233 70%,#10331f 100%);
  box-shadow:inset 0 1px 0 rgba(220,245,210,.44),inset 0 -10px 18px rgba(0,0,0,.3),0 18px 46px -10px rgba(60,170,100,.7),0 0 0 1px rgba(0,0,0,.4)}
.end .button.v67-jade.jd-press{animation:jdPress .58s cubic-bezier(.3,1.5,.45,1)}
@keyframes jdPress{0%{scale:1}24%{scale:1.07 .9}52%{scale:.97 1.05}76%{scale:1.01 .99}100%{scale:1}}
.end .button.v67-jade .cta-t{position:relative}
.end .button.v67-jade .v67-jg{display:inline-grid;place-items:center;width:clamp(30px,2.6vw,36px);height:clamp(30px,2.6vw,36px);border-radius:50%;
  background:linear-gradient(140deg,#f8eab2,#d2b25a);color:#10240f;font-size:clamp(14px,1.2vw,17px);font-weight:800;line-height:1;text-shadow:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 4px 12px -4px rgba(0,0,0,.6),0 0 14px rgba(246,214,120,.35)}
@media(prefers-reduced-motion:reduce){.end .button.v67-jade::after,.end .button.v67-jade.jd-press{animation:none!important}}

/* the packaging cards' glass icons (bbb-v67-story) breathe while on screen, lift on hover, squash on tap */
.pcap>i.pcap-gl{transition:scale .45s cubic-bezier(.3,1.6,.45,1),filter .35s ease;transform-origin:50% 70%}
.pcaps.pg-on .pcap>i.pcap-gl img{animation:pgFloat 5.2s ease-in-out infinite}
.pcaps.pg-on .pcap:nth-child(2)>i.pcap-gl img{animation-delay:-1.7s}
.pcaps.pg-on .pcap:nth-child(3)>i.pcap-gl img{animation-delay:-3.4s}
@keyframes pgFloat{0%,100%{translate:0 0;filter:drop-shadow(0 8px 14px rgba(0,0,0,.55)) drop-shadow(0 0 0 rgba(255,214,120,0))}
  50%{translate:0 -5px;filter:drop-shadow(0 14px 16px rgba(0,0,0,.5)) drop-shadow(0 0 14px rgba(255,214,120,.5))}}
.pcap:hover>i.pcap-gl{scale:1.08}
.pcap>i.pcap-gl.pg-press{animation:pgPress .62s cubic-bezier(.3,1.5,.45,1)}
@media(prefers-reduced-motion:reduce){.pcaps .pcap>i.pcap-gl img,.pcap>i.pcap-gl{animation:none!important}}