/* Circles Contact Animation: live open / closed sign */
.cos{--w:clamp(200px,24vw,300px);position:relative;width:100%;display:flex;flex-direction:column;align-items:center;font-family:"Eina01-Regular","Helvetica Neue",Arial,sans-serif;color:#2A1620}
.cos *{box-sizing:border-box}
.cos i,.cos b{font-style:normal}
.cos-hang{position:relative;width:var(--w);transform-origin:50% 0;perspective:900px}
.cos-flip{position:relative;padding-top:calc(var(--w)*.2);transform-style:preserve-3d}
.cos-strings{position:absolute;left:0;top:0;width:100%;height:calc(var(--w)*.3);overflow:visible;pointer-events:none}
.cos-nail{position:absolute;left:50%;top:calc(var(--w)*.01);width:calc(var(--w)*.045);height:calc(var(--w)*.045);margin-left:calc(var(--w)*-.0225);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 18%,#c9bcc1 22%,#8f7c84 100%);box-shadow:0 1px 2px rgba(0,0,0,.3);z-index:2}
.cos-board{position:relative;width:100%;aspect-ratio:1/.6;transform-style:preserve-3d}
.cos-closed .cos-flip{transform:rotateY(180deg)}
.cos-face{position:absolute;inset:0;border-radius:calc(var(--w)*.06);backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;
  box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 -3px 0 rgba(0,0,0,.12) inset,0 calc(var(--w)*.05) calc(var(--w)*.09) calc(var(--w)*-.03) rgba(90,20,40,.4)}
.cos-face::before{content:"";position:absolute;inset:calc(var(--w)*.035);border-radius:calc(var(--w)*.04);border:1.5px solid currentColor;opacity:.45}
.cos-face::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.2) 45%,transparent 58%);background-size:250% 100%;background-position:120% 0}
.cos-face .hole{position:absolute;top:calc(var(--w)*.06);width:calc(var(--w)*.035);height:calc(var(--w)*.035);border-radius:50%;background:rgba(40,10,20,.55);box-shadow:inset 0 1px 1px rgba(0,0,0,.5)}
.cos-face .hole.l{left:calc(var(--w)*.1)}.cos-face .hole.r{right:calc(var(--w)*.1)}
.cos-face.f{background:linear-gradient(160deg,#EE3340,#D51A25 60%,#B8121F);color:#FBD6E7}
.cos-face.b{background:linear-gradient(160deg,#FFF8F5,#FBE6EC);color:#E41E2C;transform:rotateY(180deg)}
.cos-sm{font:700 calc(var(--w)*.05)/1 "Circular-Bold","Helvetica Neue",Arial,sans-serif;letter-spacing:.28em;padding-left:.28em;opacity:.9}
.cos .cos-face .cos-logo{display:block!important;position:static!important;width:calc(var(--w)*.17)!important;height:calc(var(--w)*.17)!important;max-width:none!important;min-height:0!important;object-fit:contain!important;border-radius:50%!important;margin:0 0 calc(var(--w)*.012)!important;padding:0!important;box-shadow:0 1px 4px rgba(80,0,10,.25)}
.cos-face.b .cos-logo{box-shadow:0 0 0 1.5px rgba(228,30,44,.25)}
.cos-big{font:700 calc(var(--w)*.17)/.95 "Circular-Bold","Helvetica Neue",Arial,sans-serif;letter-spacing:.02em;margin:calc(var(--w)*.025) 0}
.cos-face.f .cos-big{color:#fff}
.cos-ft{font:400 calc(var(--w)*.045)/1.2 "Eina01-Regular","Helvetica Neue",Arial,sans-serif;opacity:.95}

.cos-card{margin-top:calc(var(--w)*.12);width:min(100%,calc(var(--w)*1.35));text-align:center}
.cos-st{display:inline-flex;align-items:center;gap:8px;font:700 17px/1.2 "Circular-Bold","Helvetica Neue",Arial,sans-serif;color:#2A1620}
.cos-dot{width:10px;height:10px;border-radius:50%;background:#1FA463;box-shadow:0 0 0 0 rgba(31,164,99,.5)}
.cos-closed .cos-dot{background:#E41E2C;box-shadow:none}
.cos .cos-sub{margin:6px auto 0!important;padding:0!important;font-size:14.5px!important;line-height:1.5!important;color:#6B6360!important;text-align:center!important;max-width:none!important}
.cos-cd{display:flex;justify-content:center;gap:8px;margin:10px 0 2px}
.cos-cd span{min-width:58px;padding:8px 6px 6px;border-radius:12px;background:#fff;box-shadow:0 6px 16px -10px rgba(90,20,40,.35);font:700 24px/1 "Circular-Bold","Helvetica Neue",Arial,sans-serif;color:#720026;font-variant-numeric:tabular-nums}
.cos-cd span small{display:block;margin-top:4px;font:400 11px/1 "Eina01-Regular","Helvetica Neue",Arial,sans-serif;letter-spacing:.08em;color:#8a6f78;text-transform:uppercase}
.cos-acts{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:14px}
.cos-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 24px;border-radius:999px;background:#E41E2C;color:#fff!important;font:700 14px/1 "Circular-Bold","Helvetica Neue",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none!important;box-shadow:0 10px 22px -12px rgba(228,30,44,.7)}
.cos-btn:hover{background:#c51424}
.cos-alt{font-size:14px;color:#6B6360}
.cos-alt a{color:#E41E2C!important;font-weight:700;text-decoration:underline!important;text-underline-offset:3px}

/* timeline */
.cos.armed:not(.play) .cos-hang,.cos.armed:not(.play) .cos-card{opacity:0}
.cos.play .cos-hang{animation:cos-drop .5s cubic-bezier(.3,1.2,.5,1) both,cos-swing 2.2s .35s cubic-bezier(.3,0,.4,1) both,cos-sway 6s 3s ease-in-out infinite}
.cos.play.cos-open .cos-flip{animation:cos-flip .8s 1.15s cubic-bezier(.3,1.35,.5,1) both}
.cos.play .cos-face::after{animation:cos-sheen 1s 1.9s ease-in-out both}
.cos.play .cos-card{animation:cos-up .6s 1.75s ease-out both}
.cos.play.cos-open .cos-dot{animation:cos-pulse 1.8s 2.2s ease-out infinite}
@keyframes cos-drop{from{opacity:0;transform:translateY(-36px)}to{opacity:1;transform:none}}
@keyframes cos-swing{0%{rotate:9deg}22%{rotate:-7deg}44%{rotate:4.5deg}64%{rotate:-2.5deg}82%{rotate:1deg}100%{rotate:0deg}}
@keyframes cos-sway{0%,100%{rotate:0deg}50%{rotate:1.2deg}}
@keyframes cos-flip{0%{transform:rotateY(180deg)}100%{transform:rotateY(360deg)}}
@keyframes cos-sheen{from{background-position:120% 0}to{background-position:-20% 0}}
@keyframes cos-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes cos-pulse{0%{box-shadow:0 0 0 0 rgba(31,164,99,.55)}100%{box-shadow:0 0 0 12px rgba(31,164,99,0)}}

/* menu preview */
.cos-mini{--w:150px}
.cos-mini .cos-card{margin-top:12px}
.cos-mini .cos-st{font-size:14px}
.cos-mini .cos-sub{font-size:12.5px;margin-top:4px}
.cos-mini .cos-acts{margin-top:10px}
.cos-mini .cos-btn{min-height:38px;padding:8px 18px;font-size:12.5px;letter-spacing:.04em;text-transform:none}
.cos-mini.play .cos-hang{animation:cos-drop .35s cubic-bezier(.3,1.2,.5,1) both,cos-swing 1.4s .2s cubic-bezier(.3,0,.4,1) both}
.cos-mini.play.cos-open .cos-flip{animation:cos-flip .6s .55s cubic-bezier(.3,1.35,.5,1) both}
.cos-mini.play .cos-card{animation:cos-up .4s .8s ease-out both}
.cos-mini.play .cos-face::after{animation-delay:1s}

/* contact header: same panel as the gift card page, sign in place of the photo */
.cx-hero:has(.cos-wrap):not(#cos-x){background:radial-gradient(70% 90% at 0% 0%,rgba(244,196,184,.45),transparent 70%),radial-gradient(60% 80% at 100% 100%,rgba(200,192,240,.45),transparent 70%),#FBF6F5!important;border:0!important;border-radius:28px!important;
  padding:clamp(28px,4vw,56px) clamp(24px,4vw,64px)!important;align-items:center;column-gap:clamp(24px,4vw,64px)}
.cx-hero:has(.cos-wrap) > .cx-copy{padding:0!important;background:none!important}
.cx-hero:has(.cos-wrap) .cx-btns a[href^="tel:"]{display:none!important}
.cx-hero:has(.cos-wrap) .cx-copy .cx-from{display:none!important}
.cx-hero:has(.cos-wrap) .cx-btns a:first-child{margin-left:0!important}
.cx-hero:has(.cos-wrap) .cx-art{background:none!important;overflow:visible!important;border-radius:0!important;display:flex;align-items:center;justify-content:center;min-height:0!important}
.cx-hero:has(.cos-wrap) .cx-art > :not(.cos-wrap){display:none!important}
.cx-hero:has(.cos-wrap) .cx-copy > h1{line-height:1.02!important}
.cx-hero:has(.cos-wrap) .cx-copy > .cx-lead{font-size:18px!important;line-height:1.65!important;color:#6B6360!important;max-width:40ch!important;margin-top:22px!important}
@media (max-width:900px){
  .cx-hero:has(.cos-wrap):not(#cos-x){padding:30px 18px 26px!important;border-radius:22px!important}
  .cx-hero:has(.cos-wrap) .cx-copy > .cx-lead{font-size:16px!important}
  .cx-hero:has(.cos-wrap) .cx-art{order:2;margin-top:18px;margin-bottom:30px!important}
}

/* title: words open on a hinge, then a chat bubble pops after the last word, types, and says "Hi!" */
.cos-title{perspective:700px}
.cos-title .cos-w{display:inline-block;transform-origin:50% 0;backface-visibility:hidden}
.cos-title .cos-lastw{position:relative;display:inline-block}
.cos-title .cos-bub{position:absolute;left:calc(100% + .14em);top:.1em;bottom:auto;width:1.24em;height:.74em;border-radius:.37em;background:#FBD6E7;box-shadow:0 .04em .12em rgba(90,20,40,.2);transform-origin:0 100%;display:flex;align-items:center;justify-content:center;text-transform:none;letter-spacing:0}
.cos-title .cos-bub::after{content:"";position:absolute;left:.08em;bottom:-.13em;width:.2em;height:.17em;background:inherit;clip-path:polygon(0 0,100% 0,0 100%)}
/* no room beside the last word (phones): sit just above its end instead */
.cos-title .cos-bub.cos-bub-up{left:auto;right:-.06em;top:auto;bottom:calc(100% - .1em);transform-origin:100% 100%}
.cos-title .cos-bub.cos-bub-up::after{left:auto;right:.1em;clip-path:polygon(0 0,100% 0,100% 100%)}
.cos-title .cos-dots{display:flex;gap:.09em}
.cos-title .cos-dots i{display:block;width:.12em;height:.12em;border-radius:50%;background:#E41E2C;opacity:.85}
.cos-title .cos-hi{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:600 .5em/1 "Caveat","Segoe Print","Bradley Hand",cursive;color:#E41E2C;opacity:0;transform:rotate(-4deg)}
.cos-title.armed .cos-bub{opacity:0;transform:scale(0)}
.cos-title.play .cos-w{animation:cos-wopen .62s cubic-bezier(.3,1.35,.5,1) both;animation-delay:calc(var(--i)*.07s)}
.cos-title.armed .cos-w{opacity:0;transform:rotateX(-92deg)}
.cos-title.play .cos-bub{animation:cos-bubpop .5s 1.05s cubic-bezier(.3,1.6,.5,1) both}
.cos-title.play .cos-dots i{animation:cos-type .9s ease-in-out 3 both;animation-delay:calc(1.3s + var(--d)*.15s)}
.cos-title.play .cos-dots{animation:cos-out .25s 4s ease-in forwards}
.cos-title.play .cos-hi{animation:cos-hi .5s 4.15s cubic-bezier(.3,1.5,.5,1) forwards}
.cos-fadein.armed{opacity:0;filter:blur(6px);transform:translateY(8px)}
.cos-fadein.play{animation:cos-leadin .7s ease-out both;animation-delay:var(--dl,1s)}
@keyframes cos-wopen{0%{opacity:0;transform:rotateX(-92deg)}35%{opacity:1}100%{opacity:1;transform:rotateX(0)}}
@keyframes cos-bubpop{0%{opacity:0;transform:scale(0)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes cos-type{0%,60%,100%{transform:translateY(0);opacity:.55}30%{transform:translateY(-.07em);opacity:1}}
@keyframes cos-out{to{opacity:0;transform:scale(.6)}}
@keyframes cos-hi{0%{opacity:0;transform:rotate(-4deg) scale(.5)}100%{opacity:1;transform:rotate(-4deg) scale(1)}}
@keyframes cos-leadin{from{opacity:0;filter:blur(6px);transform:translateY(8px)}to{opacity:1;filter:none;transform:none}}

@media (prefers-reduced-motion:reduce){
  .cos.play *,.cos.play .cos-hang,.cos-title *,.cos-fadein{animation:none!important}
  .cos.armed .cos-hang,.cos.armed .cos-card,.cos-title .cos-w,.cos-fadein{opacity:1!important;transform:none!important;filter:none!important}
  .cos-open .cos-flip{transform:none!important}
  .cos-title .cos-bub{opacity:1!important;transform:none!important}.cos-title .cos-dots{display:none!important}.cos-title .cos-hi{opacity:1!important}
}

.cosa-pop{position:fixed;z-index:100000;width:290px;padding:6px 16px 16px;background:#fff;border:1px solid #f3c9d6;border-radius:16px;box-shadow:0 18px 40px -18px rgba(90,10,25,.35);opacity:0;transform:translateY(-6px);transition:opacity .16s ease,transform .16s ease;pointer-events:none;text-align:center;font-family:inherit}
.cosa-pop.on{opacity:1;transform:none;pointer-events:auto}

/* 1.x consistency: all menu hover cards share one layout */
.cosa-pop{padding:14px 16px 16px!important}
.cosa-pop .cosa-link{display:flex!important;align-items:center;justify-content:center;height:180px;padding:0!important;overflow:visible}
.cosa-pop .cosa-t{margin:8px 0 2px!important;font-weight:700;font-size:15px;line-height:1.3;color:#2A1620}
.cosa-pop .cosa-s{margin:0 0 12px!important;font-size:12.5px;line-height:1.45;color:#6E5A61}
.cosa-pop .cosa-b{min-height:38px;padding:8px 18px;font-size:13px;font-weight:700;letter-spacing:0;text-transform:none}
.cosa-pop .cos-mini{--w:170px}
.cosa-pop .cos-mini .cos-hang{margin:0 auto}
.cosa-pop .cosa-t{display:flex;align-items:center;justify-content:center;gap:7px}
.cosa-pop .cosa-dot{width:8px;height:8px;border-radius:50%;background:#1FA463;box-shadow:0 0 0 3px rgba(31,164,99,.18)}
.cosa-pop .cosa-dot.off{background:#B9A9AE;box-shadow:0 0 0 3px rgba(185,169,174,.2)}
.cosa-pop .cosa-link{color:inherit;text-decoration:none!important}
.cosa-pop .cosa-b{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#E41E2C;color:#fff!important;text-decoration:none!important}
.cosa-pop .cosa-b:hover{background:#c51424}
.cosa-pop .cosa-s{min-height:calc(1.45em*3)}