/* Friendsgiving × Magic UI-style layer: warm dot pattern + drifting glow, falling leaves,
   3D tilt flyer with border beam + glare, shiny badge, shine title, countdown ticker,
   spotlight fact cards, shimmer + pulse register button. Same cream/cranberry/amber branding. */
.fg-feature{isolation:isolate}
.fg-feature::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(163,23,62,.16) 1.1px,transparent 1.4px);background-size:22px 22px;
  -webkit-mask:radial-gradient(ellipse 60% 70% at 70% 40%,#000 20%,transparent 75%);mask:radial-gradient(ellipse 60% 70% at 70% 40%,#000 20%,transparent 75%)}
.fgm-glow{position:absolute;z-index:-1;border-radius:50%;filter:blur(60px);opacity:.38;pointer-events:none;animation:fgm-drift 16s ease-in-out infinite alternate}
.fgm-glow.a{width:420px;height:420px;left:-120px;top:10%;background:#F2B24C}
.fgm-glow.b{width:360px;height:360px;right:-80px;bottom:-60px;background:#E57A8F;animation-delay:-8s}
@keyframes fgm-drift{to{transform:translate(60px,-40px) scale(1.15)}}

/* Falling leaves */
.fgm-leaves{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.fgm-leaves i{position:absolute;top:-40px;width:var(--s,18px);height:var(--s,18px);border-radius:0 80% 0 80%;background:var(--c,#E8901C);opacity:.55;animation:fgm-fall var(--d,14s) linear infinite;animation-delay:var(--dl,0s)}
@keyframes fgm-fall{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(var(--x,40px),50vh) rotate(200deg)}100%{transform:translate(calc(var(--x,40px) * -.5),110vh) rotate(420deg)}}

/* Flyer: 3D tilt + float + beam + glare */
.fg-flyer-wrap{perspective:1000px}
.fg-flyer{transform-style:preserve-3d;will-change:transform;transition:transform .35s ease,box-shadow .35s ease;animation:fgm-float 6s ease-in-out infinite}
.fg-flyer.fgm-tilting{animation:none;transition:transform .08s linear}
@keyframes fgm-float{0%,100%{transform:rotate(-1.5deg) translateY(0)}50%{transform:rotate(-1deg) translateY(-8px)}}
.fgm-beam{position:absolute;inset:0;border-radius:6px;padding:3px;pointer-events:none;z-index:2;
  background:conic-gradient(from var(--fgm-a,0deg),transparent 0 70%,#E8901C 80%,#A3173E 88%,#F7C873 94%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:fgm-beam 5s linear infinite}
@property --fgm-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes fgm-beam{to{--fgm-a:360deg}}
.fgm-glare{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(320px circle at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.45),transparent 60%)}
.fg-flyer:hover .fgm-glare{opacity:1}

/* Badge: shiny sweep + pulsing dot */
.fg-only{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:9px}
.fg-only::before{content:"";width:7px;height:7px;border-radius:50%;background:#F7C873;box-shadow:0 0 0 0 rgba(247,200,115,.8);animation:fgm-dot 1.8s ease-out infinite}
@keyframes fgm-dot{70%,100%{box-shadow:0 0 0 8px rgba(247,200,115,0)}}
.fg-only::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);animation:fgm-sweep 3.6s ease-in-out infinite}
@keyframes fgm-sweep{55%,100%{transform:translateX(120%)}}

/* Title shine */
.fg-copy h2{background:linear-gradient(100deg,#A3173E 0%,#A3173E 35%,#E8901C 50%,#A3173E 65%,#A3173E 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:fgm-shine 5s linear infinite}
.fg-copy h2 small{-webkit-text-fill-color:var(--fg-plum);background:none}
@keyframes fgm-shine{from{background-position:100% 0}to{background-position:-150% 0}}

/* Countdown */
.fgm-count{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}
.fgm-count .lbl{font:800 .72rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-cran);margin-right:4px}
.fgm-count .u{display:grid;justify-items:center;min-width:64px;padding:10px 10px 8px;border-radius:12px;background:var(--fg-plum);color:var(--fg-cream);box-shadow:0 10px 22px -14px rgba(43,15,30,.8)}
.fgm-count .u b{font:600 1.7rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.fgm-count .u small{font:700 .62rem/1.4 var(--f-body);letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.fgm-count .u b.tick{animation:fgm-tick .45s ease}
@keyframes fgm-tick{0%{transform:translateY(-35%);opacity:0}100%{transform:none;opacity:1}}

/* Fact cards: warm spotlight + stagger in */
.fg-facts li{transition:transform .25s,box-shadow .25s,border-color .25s}
.fg-facts li:hover{transform:translateY(-3px);border-color:#E8B48A;box-shadow:0 16px 30px -22px rgba(163,23,62,.6)}
.fg-facts li.mg-spot::before{background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(232,144,28,.18),transparent 70%)}
.fg-facts li.mg-spot::after{background:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),rgba(163,23,62,.75),transparent 70%)}
.fgm-in{opacity:0;transform:translateY(12px);filter:blur(6px);transition:opacity .7s ease,transform .7s ease,filter .7s ease}
.fgm-in.on{opacity:1;transform:none;filter:none}

/* Register: shimmer + pulse */
.fg-register{position:relative;overflow:hidden;isolation:isolate;animation:fgm-pulse 2.6s ease-out infinite}
.fg-register::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);transform:translateX(-130%);animation:fgm-sweep 3s ease-in-out infinite}
@keyframes fgm-pulse{0%{box-shadow:0 0 0 0 rgba(163,23,62,.45),0 12px 26px -12px rgba(163,23,62,.75)}80%,100%{box-shadow:0 0 0 14px rgba(163,23,62,0),0 12px 26px -12px rgba(163,23,62,.75)}}

@media (max-width:620px){.fg-only{font-size:.64rem;letter-spacing:.1em;padding:9px 13px;white-space:nowrap}.fgm-count .u{min-width:56px}.fgm-count .u b{font-size:1.4rem}.fgm-glow{opacity:.28}}
@media (prefers-reduced-motion:reduce){
  .fgm-glow,.fgm-leaves i,.fg-flyer,.fgm-beam,.fg-only::before,.fg-only::after,.fg-copy h2,.fg-register,.fg-register::after{animation:none}
  .fgm-leaves{display:none}.fgm-in{opacity:1;transform:none;filter:none}
}