/* Circles Gift Card Animation */
.cgc{--w:clamp(118px,30vw,190px);--h:calc(var(--w)*.943);--cw:calc(var(--w)*.80);--ch:calc(var(--cw)/1.527);
  position:relative;width:min(100%,calc(var(--w)*2.6));height:calc(var(--h)*1.88);margin:0 auto;perspective:1300px;perspective-origin:50% 30%;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}
.cgc:focus-visible{box-shadow:0 0 0 3px #E41E2C;border-radius:12px}
.cgc *{box-sizing:border-box}
.cgc i,.cgc b{display:block;font-style:normal}
.cgc .cgc-floor{position:absolute;left:50%;top:calc(var(--h)*1.6);width:calc(var(--w)*1.4);height:calc(var(--h)*.22);transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(120,20,40,.26),transparent);filter:blur(6px)}
.cgc .cgc-stage{position:absolute;inset:0;transform-style:preserve-3d}
.cgc .cgc-rig{position:absolute;left:50%;top:calc(var(--h)*1.12);width:var(--w);height:var(--h);transform-style:preserve-3d;transform:translate(-50%,-50%) translateX(calc(var(--w)*.5)) rotateX(18deg)}
.cgc .cgc-panel,.cgc .cgc-cover{position:absolute;inset:0;transform-style:preserve-3d}
.cgc .cgc-face{position:absolute;inset:0;background-size:100% 100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:2px}
.cgc .cgc-base .f{background-image:var(--cgc-inr);overflow:hidden}
.cgc .cgc-base .b{background-image:var(--cgc-back);transform:rotateY(180deg)}
.cgc .cgc-cover{transform-origin:0 50%;transform:translateZ(2.4px) rotateY(-180deg)}
.cgc .cgc-cover .f{background-image:var(--cgc-front);box-shadow:inset -10px 0 18px -14px rgba(0,0,0,.35)}
.cgc .cgc-cover .b{background-image:var(--cgc-inl);transform:rotateY(180deg);box-shadow:inset 10px 0 18px -14px rgba(0,0,0,.3)}
.cgc .hand{position:absolute;left:13%;font:600 calc(var(--w)*.105)/1 "Caveat","Segoe Print","Bradley Hand",cursive;color:#7a1830;transform:rotate(-3deg);white-space:nowrap;letter-spacing:0}
.cgc .hand.to{top:calc(34.8% - var(--w)*.1)}
.cgc .hand.from{top:calc(60.4% - var(--w)*.1)}
.cgc .cgc-shadow{position:absolute;left:calc((var(--w) - var(--cw))/2);top:calc((var(--h) - var(--ch))/2);width:var(--cw);height:var(--ch);border-radius:calc(var(--cw)*.045);background:rgba(90,10,25,.55);filter:blur(1px);opacity:0}
.cgc .cgc-slot{position:absolute;left:calc((var(--w) - var(--cw))/2);top:calc((var(--h) - var(--ch))/2);width:var(--cw);height:var(--ch);transform-style:preserve-3d}
.cgc .cgc-bob{position:absolute;inset:0;transform-style:preserve-3d}
.cgc .cgc-card{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 100%;
  transform:translateX(calc(var(--w)*-.5)) translateY(calc(var(--h)*-.48)) translateZ(calc(var(--w)*.5)) rotateX(-14deg) rotateY(367deg) rotateZ(-4deg)}
.cgc .cgc-card > i{position:absolute;inset:0;border-radius:calc(var(--cw)*.045);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.cgc .cgc-card .cf{background:var(--cgc-giftcard) center/cover;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.cgc .cgc-card .cf::after,.cgc .cgc-card .cb::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.22) 45%,transparent 58%);background-size:250% 100%;background-position:120% 0;mix-blend-mode:screen}
.cgc .cgc-card .cb::after{background-image:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.45) 45%,transparent 58%);mix-blend-mode:normal}
.cgc .cgc-card .ce{background:#9e0f1c;transform:translateZ(-.8px)}
.cgc .cgc-card .ce2{background:#c51424;transform:translateZ(-.4px)}
.cgc .cgc-card .cb{background:#fbd6e7;transform:translateZ(-1.6px) rotateY(180deg);overflow:hidden;font-family:"Montserrat",system-ui,sans-serif;color:#E41E2C;text-align:left}
.cgc .cb span{position:absolute;display:block}
.cgc .cb .strip{left:0;right:0;top:9%;height:19%;background:#E41E2C}
.cgc .cb .logo{right:7%;top:38%;width:24%;aspect-ratio:1;border-radius:50%;background:#E41E2C;color:#fbd6e7;display:grid;place-items:center;text-align:center;font-weight:800;font-size:calc(var(--cw)*.042);letter-spacing:.14em;line-height:1.15}
.cgc .cb .copy{left:7%;top:38%;width:58%;font-size:calc(var(--cw)*.036);line-height:1.35;font-weight:500}
.cgc .cb .copy b{font-weight:800;font-size:calc(var(--cw)*.05);letter-spacing:.06em;margin-bottom:3%}
.cgc .cb .bar{left:7%;bottom:9%;width:46%;height:13%;background:repeating-linear-gradient(90deg,#3a1420 0 2px,transparent 2px 3px,#3a1420 3px 4px,transparent 4px 6px,#3a1420 6px 9px,transparent 9px 10px);opacity:.85}
.cgc .cb .site{right:7%;bottom:9%;font-size:calc(var(--cw)*.036);font-weight:700}

/* hero timeline (about 6 s, then a gentle drift) */
.cgc-hero.play{animation:cgc-fade .6s ease-out both}
.cgc-hero.play .cgc-rig{animation:cgc-rig 3s cubic-bezier(.45,0,.2,1) both}
.cgc-hero.play .cgc-cover{animation:cgc-open 1.5s .9s cubic-bezier(.55,0,.25,1) both}
.cgc-hero.play .cgc-card{animation:cgc-out 3.4s 2.4s linear both}
.cgc-hero.play .cgc-shadow{animation:cgc-shadow 3.4s 2.4s linear both}
.cgc-hero.play .cgc-card .cb::after{animation:cgc-sheen 1s 3.9s ease-in-out both}
.cgc-hero.play .cgc-card .cf::after{animation:cgc-sheen 1.2s 4.9s ease-in-out both}
.cgc-hero.play .cgc-bob{animation:cgc-bob 5s 5.9s ease-in-out infinite}

/* menu preview: holder already open, card peels and spins */
.cgc-mini{--w:112px}
.cgc-mini.play .cgc-card{animation:cgc-out 1.7s linear both}
.cgc-mini.play .cgc-shadow{animation:cgc-shadow 1.7s linear both}
.cgc-mini.play .cgc-card .cb::after{animation:cgc-sheen .6s .7s ease-in-out both}
.cgc-mini.play .cgc-bob{animation:cgc-bob 5s 1.8s ease-in-out infinite}

@keyframes cgc-fade{from{opacity:0}to{opacity:1}}
@keyframes cgc-rig{
  0%{transform:translate(-50%,-50%) translateX(0) translateY(30px) rotateX(24deg) rotateY(-28deg) rotateZ(-3deg)}
  30%{transform:translate(-50%,-50%) translateX(0) translateY(0) rotateX(20deg) rotateY(-16deg) rotateZ(-1deg)}
  100%{transform:translate(-50%,-50%) translateX(calc(var(--w)*.5)) rotateX(18deg) rotateY(0deg)}
}
@keyframes cgc-open{from{transform:translateZ(2.4px) rotateY(0deg)}to{transform:translateZ(2.4px) rotateY(-180deg)}}
@keyframes cgc-out{
  0%{transform:translateX(0px) translateY(0px) translateZ(1px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);animation-timing-function:cubic-bezier(.45,0,.35,1)}
  16%{transform:translateX(0px) translateY(calc(var(--ch)*-.04)) translateZ(2px) rotateX(-38deg) rotateY(0deg) rotateZ(-2deg);animation-timing-function:cubic-bezier(.3,0,.4,1)}
  34%{transform:translateX(calc(var(--w)*-.2)) translateY(calc(var(--h)*-.3)) translateZ(calc(var(--w)*.32)) rotateX(-20deg) rotateY(24deg) rotateZ(-5deg);animation-timing-function:cubic-bezier(.25,0,.35,1)}
  64%{transform:translateX(calc(var(--w)*-.45)) translateY(calc(var(--h)*-.53)) translateZ(calc(var(--w)*.5)) rotateX(-14deg) rotateY(205deg) rotateZ(-7deg);animation-timing-function:cubic-bezier(.2,0,.3,1)}
  84%{transform:translateX(calc(var(--w)*-.5)) translateY(calc(var(--h)*-.47)) translateZ(calc(var(--w)*.5)) rotateX(-14deg) rotateY(376deg) rotateZ(-3deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}
  100%{transform:translateX(calc(var(--w)*-.5)) translateY(calc(var(--h)*-.48)) translateZ(calc(var(--w)*.5)) rotateX(-14deg) rotateY(367deg) rotateZ(-4deg)}
}
@keyframes cgc-shadow{
  0%{transform:translate(0,0);opacity:0;filter:blur(1px)}
  16%{transform:translate(0,calc(var(--ch)*-.08));opacity:.32;filter:blur(3px)}
  34%{transform:translate(calc(var(--w)*-.15),calc(var(--h)*-.2));opacity:.14;filter:blur(12px)}
  50%,100%{transform:translate(calc(var(--w)*-.3),calc(var(--h)*-.4));opacity:0;filter:blur(18px)}
}
@keyframes cgc-sheen{from{background-position:120% 0}to{background-position:-20% 0}}
@keyframes cgc-bob{0%,100%{transform:translateZ(0) rotateX(0) rotateY(0)}50%{transform:translateZ(6px) rotateX(2deg) rotateY(-3deg)}}

/* before it plays: keep the hero closed so it opens on cue (end state shows if JS never runs) */
.cgc-hero.armed:not(.play) .cgc-rig{transform:translate(-50%,-50%) translateX(0) translateY(30px) rotateX(24deg) rotateY(-28deg) rotateZ(-3deg)}
.cgc-hero.armed:not(.play) .cgc-cover{transform:translateZ(2.4px) rotateY(0deg)}
.cgc-hero.armed:not(.play) .cgc-card{transform:translateZ(1px)}
.cgc-hero.armed:not(.play){opacity:0}

@media (prefers-reduced-motion:reduce){
  .cgc.play,.cgc.play *{animation:none!important}
  .cgc-hero.armed:not(.play){opacity:1}
}

/* gift card page hero */
.cgc-hero-wrap{margin:18px auto 0;display:flex;flex-direction:column;align-items:center;gap:4px}
.cgc-hero-wrap .cgc-note{margin:0;font-size:13.5px;color:#6E5A61;text-align:center;max-width:44ch;line-height:1.5}

/* menu hover preview (desktop only) */
.cgca-pop{position:fixed;z-index:100000;width:290px;padding:14px 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}
.cgca-pop.on{opacity:1;transform:none;pointer-events:auto}
.cgca-pop .cgc{height:calc(var(--h)*1.85)}
.cgca-pop .cgc .cgc-rig{top:calc(var(--h)*1.02)}
.cgca-pop .cgc .cgc-floor{top:calc(var(--h)*1.45)}
.cgca-pop .cgca-t{margin:2px 0 2px;font-weight:700;font-size:15px;color:#2A1620}
.cgca-pop .cgca-s{margin:0 0 10px;font-size:12.5px;color:#6E5A61;line-height:1.45}
.cgca-pop .cgca-b{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 18px;border-radius:999px;background:#E41E2C;color:#fff!important;font-weight:700;font-size:13px;text-decoration:none!important}
.cgca-pop .cgca-b:hover{background:#c51424}

.cgca-pop .cgca-link{display:block;color:inherit;text-decoration:none!important;cursor:pointer}

/* ---------- v1.1: gift card page header block (title + lead + holder) ---------- */
div:has(> .cgc-hero-wrap){display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);column-gap:clamp(24px,4vw,64px);align-items:center;
  margin:8px 0 28px!important;padding:clamp(28px,4vw,56px) clamp(24px,4vw,64px)!important;border-radius:28px;text-align:left!important;
  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}
div:has(> .cgc-hero-wrap) > *{grid-column:1}
div:has(> .cgc-hero-wrap) > h1{margin:0!important;text-align:left!important;line-height:1.02}
div:has(> .cgc-hero-wrap) > .cx-lead{margin:20px 0 0!important;text-align:left!important;max-width:34ch;font-size:clamp(17px,1.4vw,20px)!important;line-height:1.55}
div:has(> .cgc-hero-wrap) > .cgc-hero-wrap{grid-column:2;grid-row:1 / span 6;margin:0!important}
@media (max-width:900px){
  div:has(> .cgc-hero-wrap){grid-template-columns:minmax(0,1fr);padding:30px 18px 6px!important;border-radius:22px;text-align:center!important}
  div:has(> .cgc-hero-wrap) > h1,div:has(> .cgc-hero-wrap) > .cx-lead{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
  div:has(> .cgc-hero-wrap) > .cgc-hero-wrap{grid-column:1;grid-row:auto;margin-top:4px!important}
}

/* title: words open on a top hinge like the holder cover, ribbon + bow under GIFT CARD */
.cgc-title{perspective:700px}
.cgc-title .cgc-w{display:inline-block;transform-origin:50% 0;backface-visibility:hidden}
.cgc-title .cgc-key{position:relative;display:inline-block;white-space:nowrap;color:#E41E2C;z-index:0}
.cgc-title .cgc-rib{position:absolute;left:-.06em;right:-.06em;bottom:.04em;height:.3em;z-index:-1;border-radius:2px;
  background:linear-gradient(180deg,#FAD0DC,#F4AFC3);box-shadow:inset 0 -2px 0 rgba(200,60,100,.18);transform-origin:0 50%}
.cgc-title .cgc-bow{position:absolute;right:-.42em;bottom:-.12em;width:.62em;height:.5em;transform-origin:30% 60%}
.cgc-title.armed .cgc-w{opacity:0;transform:rotateX(-92deg)}
.cgc-title.armed .cgc-rib{transform:scaleX(0)}
.cgc-title.armed .cgc-bow{opacity:0;transform:scale(0) rotate(-40deg)}
.cgc-lead-a.armed{opacity:0;filter:blur(6px);transform:translateY(8px)}
.cgc-title.play .cgc-w{animation:cgc-wopen .62s cubic-bezier(.3,1.35,.5,1) both;animation-delay:calc(var(--i)*.09s)}
.cgc-title.play .cgc-rib{animation:cgc-rib .55s .55s cubic-bezier(.65,0,.25,1) both}
.cgc-title.play .cgc-bow{animation:cgc-bowpop .55s 1.02s cubic-bezier(.3,1.6,.5,1) both}
.cgc-lead-a.play{animation:cgc-leadin .7s 1.05s ease-out both}
@keyframes cgc-wopen{0%{opacity:0;transform:rotateX(-92deg)}35%{opacity:1}100%{opacity:1;transform:rotateX(0)}}
@keyframes cgc-rib{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cgc-bowpop{0%{opacity:0;transform:scale(0) rotate(-40deg)}60%{opacity:1}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes cgc-leadin{from{opacity:0;filter:blur(6px);transform:translateY(8px)}to{opacity:1;filter:none;transform:none}}
@media (prefers-reduced-motion:reduce){
  .cgc-title .cgc-w,.cgc-title .cgc-rib,.cgc-title .cgc-bow,.cgc-lead-a{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
}
.cgc-title .cgc-w{color:#720026!important}
.cgc-title .cgc-key .cgc-w{color:#E41E2C!important}
.cgc-title .cgc-rib{height:.34em;bottom:.06em}
.cgc-title .cgc-bow{width:.9em;height:.72em;right:-.62em;bottom:-.16em}

/* v1.1.1: copy sizes and spacing shared by the Gift Card, Price List and Style Me headers */
div:has(> .cgc-hero-wrap):not(#cgc-x){padding:clamp(28px,4vw,56px) clamp(24px,4vw,64px)!important}
div:has(> .cgc-hero-wrap) > h1{line-height:1.02!important}
div:has(> .cgc-hero-wrap) > .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){div:has(> .cgc-hero-wrap) > .cx-lead{font-size:16px!important}}

/* 1.x consistency: all menu hover cards share one layout */
.cgca-pop{padding:14px 16px 16px!important}
.cgca-pop .cgca-link{display:flex!important;align-items:center;justify-content:center;height:180px;padding:0!important;overflow:visible}
.cgca-pop .cgca-t{margin:8px 0 2px!important;font-weight:700;font-size:15px;line-height:1.3;color:#2A1620}
.cgca-pop .cgca-s{margin:0 0 12px!important;font-size:12.5px;line-height:1.45;color:#6E5A61}
.cgca-pop .cgca-b{min-height:38px;padding:8px 18px;font-size:13px;font-weight:700;letter-spacing:0;text-transform:none}
.cgca-pop .cgca-s{min-height:calc(1.45em*3)}
