/* The bolusing series on the type 1 home page: four cookies, one more bite out of each, one per page.
   The joke is that these are the only bites you don't bolus for. */
.bs-card{--paper:#FDF8F6;--ink:#2F2622;--hyssop:#A3326F;--hyssop-deep:#7E2154;--petal:#F296BD;--blush:#F4D6E2;--garden:#3F6B3A;--line:#EBD9DE;--crumb:#FFF3E3;--crumb-line:#F2C9A0;--display:"Besley",Georgia,serif;--body:"Atkinson Hyperlegible",Arial,sans-serif;font-family:var(--body);color:var(--ink)}
.bite{position:relative;overflow:hidden;border-radius:22px;background:var(--crumb);border:1.5px solid var(--crumb-line);padding:28px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.bite-eb{display:inline-block;font:700 12px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--hyssop-deep);background:var(--blush);border-radius:999px;padding:6px 12px;margin:0 0 10px}
.bite h2{margin:0;font:500 40px/1.05 var(--display);color:var(--hyssop);text-wrap:balance}
.bite h2 em{font-style:italic;color:#B44E14}
.bite-sub{margin:8px 0 0;max-width:48ch}
.cookies{position:relative;list-style:none;margin:18px 0 14px;padding:0;width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.trail{position:absolute;left:0;top:44px;width:100%;height:40px;pointer-events:none}
.cookies li{position:relative}
.cookies a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;height:100%;padding:6px 8px 10px;border-radius:16px;text-decoration:none;color:var(--ink);transition:transform .15s}
.cookies li:nth-child(odd) a{transform:rotate(-1.5deg)}
.cookies li:nth-child(even) a{transform:translateY(10px) rotate(1.5deg)}
.cookies a:hover{transform:translateY(-4px) rotate(0)}
.cookie{width:112px;height:112px;filter:drop-shadow(0 6px 6px rgba(120,60,20,.18))}
.cookies a:hover .cookie{animation:wob .5s ease}
@keyframes wob{30%{transform:rotate(-8deg)}60%{transform:rotate(6deg)}}
@media (prefers-reduced-motion:reduce){.cookies a:hover .cookie{animation:none}.cookies a{transition:none}}
.bt{display:flex;flex-direction:column;gap:3px;align-items:center;min-width:0}
.bn2{font:700 12px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--garden)}
.bt b{font:500 19px/1.15 var(--display);color:var(--hyssop)}
.bt > span:last-child{font-size:14px;line-height:1.4}
.bite-go{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:999px;background:var(--hyssop);color:#fff;font:700 16px var(--body);text-decoration:none;box-shadow:0 5px 0 var(--hyssop-deep)}
.bite-go:hover{transform:translateY(2px);box-shadow:0 3px 0 var(--hyssop-deep)}
@media (max-width:760px){
  .bite{padding:20px 16px}
  .bite h2{font-size:32px}
  .cookies{grid-template-columns:minmax(0,1fr);gap:2px}
  .trail{display:none}
  .cookies li::before{content:"";position:absolute;left:43px;top:0;bottom:0;border-left:2.5px dashed #E4A15C;z-index:-1}
  .cookies li:first-child::before{top:50%}.cookies li:last-child::before{bottom:50%}
  .cookies a,.cookies li:nth-child(odd) a,.cookies li:nth-child(even) a{flex-direction:row;text-align:left;gap:12px;padding:6px 0;transform:none}
  .cookie{width:86px;height:86px;flex:none}
  .bt{align-items:flex-start}
  .bite-go{width:100%;justify-content:center}
}
