/* Festive Lights Collection — Christmas accents on Kintsugi cream/charcoal/gold */
:root{
  --festive-green:#2F4A3C;
  --festive-green-soft:rgba(47,74,60,.10);
  --festive-red:#7B1E2B;
  --festive-red-soft:rgba(123,30,43,.08);
  --festive-gold-glow:rgba(217,191,106,.55);
}
.fl-note{
  border:1px dashed var(--gold);
  background:linear-gradient(180deg,rgba(201,162,39,.08),rgba(47,74,60,.05));
  padding:22px 26px;
  margin:0 auto 48px;
  max-width:720px;
  text-align:center;
  font-size:13.5px;
  color:var(--charcoal);
  position:relative;
}
.fl-note strong{color:var(--ink);letter-spacing:.08em;text-transform:uppercase;font-size:11px;display:block;margin-bottom:8px;font-weight:500}
.fl-note::before,.fl-note::after{content:"✦";position:absolute;top:14px;color:var(--gold);font-size:11px;opacity:.7}
.fl-note::before{left:16px}.fl-note::after{right:16px}
.product .buy .btn.disabled,
.product .buy a.btn[aria-disabled="true"]{opacity:.55;pointer-events:none;cursor:not-allowed}
.fl-story .lede{max-width:560px}
.product .price-note{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);margin-top:4px}
.product .coll .dot{color:var(--festive-green);margin:0 .35em}

/* Announce + soft string-light glow */
.announce{
  background:linear-gradient(90deg,#151515 0%,#1a221c 40%,#22181a 70%,#151515 100%);
  position:relative;
}
.announce::after{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent 0%,var(--festive-green) 18%,var(--gold) 50%,var(--festive-red) 82%,transparent 100%);
  opacity:.55;
}
.announce b{color:var(--gold-soft)}

/* Festive ribbon banner under hero / above story */
.fl-ribbon{
  display:flex;align-items:center;justify-content:center;gap:14px;
  padding:14px 20px;margin:0;
  background:linear-gradient(180deg,rgba(47,74,60,.09),rgba(250,247,240,.0));
  border-bottom:1px solid rgba(201,162,39,.28);
  color:var(--charcoal);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
  text-align:center;
}
.fl-ribbon .dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 10px var(--festive-gold-glow);
  flex:0 0 auto;
}
.fl-ribbon .berry{color:var(--festive-red)}
.fl-ribbon .pine{color:var(--festive-green)}

/* Soft falling snow (CSS only; paused when capture=1 via capture.css) */
.festive-lights{position:relative}
.fl-snow{pointer-events:none;position:fixed;inset:0;z-index:40;overflow:hidden}
 .fl-snow > span{
  position:absolute;top:-12px;left:var(--x);
  width:var(--s);height:var(--s);border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff,rgba(255,255,255,.55));
  opacity:var(--o);animation:fl-fall var(--d) linear infinite;animation-delay:var(--delay);
  box-shadow:0 0 6px rgba(255,255,255,.35);
}
@keyframes fl-fall{
  0%{transform:translate3d(0,-10px,0);opacity:0}
  8%{opacity:var(--o)}
  100%{transform:translate3d(var(--drift),110vh,0);opacity:0}
}
@media (prefers-reduced-motion:reduce){
   .fl-snow > span{animation:none;display:none}
}

.fl-motif{position:relative}
.fl-motif::before{
  content:"❄";position:absolute;right:clamp(8px,4vw,40px);top:-6px;
  font-size:22px;color:var(--gold);opacity:.28;pointer-events:none;
}
.hero .copy .eyebrow::after{content:" · ✦";color:var(--gold);opacity:.75}
.hero h1 em{
  background:linear-gradient(120deg,var(--charcoal),var(--festive-green));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
@supports not (background-clip:text){
  .hero h1 em{color:var(--charcoal);background:none}
}
.band .eyebrow.gold{color:var(--gold-soft)}
.product .ph{position:relative}
.product .ph::after{
  content:"";position:absolute;inset:auto 14px 14px auto;width:7px;height:7px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 10px var(--festive-gold-glow);opacity:.55;pointer-events:none;
}
.product.premium .ph::after{background:var(--festive-red);box-shadow:0 0 10px rgba(123,30,43,.45)}
.fl-twinkle{
  display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 8px var(--festive-gold-glow);
  margin:0 8px 2px;vertical-align:middle;opacity:.7;
}
.birthstone-accent-dec{color:var(--festive-green)}
.birthstone-accent-jan{color:var(--festive-red)}


/* Premium section */
#premium.sec{padding-top:12px}
.fl-premium-band{
  background:
    linear-gradient(180deg,rgba(47,74,60,.07),transparent 42%),
    linear-gradient(0deg,rgba(123,30,43,.04),transparent 35%);
  border-top:1px solid rgba(201,162,39,.25);
  border-bottom:1px solid rgba(201,162,39,.18);
  padding:56px 0 64px;margin:8px 0 0;
}
.fl-premium-band .intro h2 em{color:var(--festive-green);font-style:italic}
.fl-badge{
  display:inline-block;margin-bottom:10px;padding:5px 10px;
  border:1px solid rgba(201,162,39,.55);border-radius:999px;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--festive-green);
  background:rgba(255,255,255,.55);
}
.products.premium-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));max-width:1100px;margin-left:auto;margin-right:auto}
@media (max-width:900px){
  .products.premium-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .products.premium-grid{grid-template-columns:1fr}
}

/* Gift-wrap cue on gifting block */
.care .img{position:relative}
.care .img::before{
  content:"";position:absolute;inset:18px auto auto 18px;z-index:2;
  width:44px;height:44px;
  background:
    linear-gradient(var(--gold),var(--gold)) center/100% 2px no-repeat,
    linear-gradient(var(--gold),var(--gold)) center/2px 100% no-repeat;
  opacity:.55;pointer-events:none;
}
.care .img::after{
  content:"";position:absolute;top:12px;left:12px;width:18px;height:18px;z-index:2;
  border:2px solid var(--festive-red);border-radius:2px;opacity:.45;pointer-events:none;
}

/* Full 12-month photographic birthstone grid */
.fl-birth .months{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:1100px;margin:32px auto 0;
}
.fl-birth .month{
  pointer-events:none;padding:22px 14px 20px;
  background:linear-gradient(180deg,#fffef9,rgba(47,74,60,.04));
  border:1px solid rgba(46,46,46,.10);
  box-shadow:0 10px 28px rgba(46,46,46,.05);
  text-align:center;
}
.fl-birth .month .no{display:block;font-size:10px;letter-spacing:.3em;color:var(--stone)}
.fl-birth .month .mn{display:block;font-family:var(--serif);font-size:22px;color:var(--ink);line-height:1.1;margin-top:2px}
.fl-birth .month .st{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);margin-top:8px;line-height:1.55}
.fl-birth .month .gem{display:none}
.stone-row{
  display:flex;justify-content:center;align-items:center;gap:8px;
  margin:12px 0 14px;flex-wrap:wrap;
}

/* Harden photographic chips (multi-stone months were expanding to intrinsic 400px) */
.fl-birth .stone-chip{
  position:relative;
  display:block;
  box-sizing:border-box;
  width:56px !important;
  height:56px !important;
  max-width:56px !important;
  max-height:56px !important;
  border-radius:50%;
  overflow:hidden;
  flex:0 0 56px !important;
  box-shadow:0 6px 16px rgba(46,46,46,.14),0 0 0 1px rgba(201,162,39,.4);
  background:#FAF7F0;
}
.fl-birth .stone-chip.lg{
  width:72px !important;
  height:72px !important;
  max-width:72px !important;
  max-height:72px !important;
  flex:0 0 72px !important;
}
.fl-birth .stone-chip picture{
  display:block;width:100%!important;height:100%!important;max-width:100%;
}
.fl-birth .stone-chip img{
  display:block;width:100%!important;height:100%!important;max-width:100%!important;object-fit:cover;
}
.fl-birth .stone-row{min-height:56px;display:flex;justify-content:center;align-items:center;gap:8px;margin:12px 0 14px;flex-wrap:wrap}
.stone-credit{
  margin:22px auto 0;max-width:720px;text-align:center;
  font-size:11px;line-height:1.55;color:var(--stone);letter-spacing:.02em;
}

/* Page-wide festive decorations (corners + bottom border + snow already global) */
.fl-page-garlands{pointer-events:none;position:fixed;inset:0;z-index:35;overflow:hidden}
.fl-page-garlands .fl-g{
  position:absolute;display:block;margin:0;line-height:0;
}
.fl-page-garlands .fl-g img{
  display:block;width:100%;height:auto;opacity:.78;
  filter:saturate(.72) sepia(.14) brightness(1.04) contrast(.95) drop-shadow(0 2px 10px rgba(42,36,32,.1));
}
.fl-page-garlands .fl-g-tl{
  top:-4px;left:-10px;width:clamp(120px,18vw,210px);
  -webkit-mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.fl-page-garlands .fl-g-tr{
  top:-4px;right:-10px;width:clamp(120px,18vw,210px);transform:scaleX(-1);
  -webkit-mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.fl-page-garlands .fl-g-bl{
  bottom:-2px;left:-10px;width:clamp(120px,18vw,210px);transform:scaleY(-1);
  -webkit-mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.fl-page-garlands .fl-g-br{
  bottom:-2px;right:-10px;width:clamp(120px,18vw,210px);transform:rotate(180deg);
  -webkit-mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  mask-image:linear-gradient(to right,#000 38%,transparent 94%),linear-gradient(to bottom,#000 38%,transparent 94%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}

/* Hero + section bottom garland borders */
.hero{position:relative}
.hero .fl-hero-garlands{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.hero .fl-hero-garlands .fl-g{position:absolute;display:block;margin:0;line-height:0}
.hero .fl-hero-garlands .fl-g img{
  display:block;width:100%;height:auto;opacity:.86;
  filter:saturate(.7) sepia(.12) brightness(1.04) contrast(.95) drop-shadow(0 2px 8px rgba(42,36,32,.12));
}
.hero .fl-hero-garlands .fl-g-tl{
  top:-6px;left:-8px;width:clamp(140px,22vw,240px);
  -webkit-mask-image:linear-gradient(to right,#000 40%,transparent 92%),linear-gradient(to bottom,#000 40%,transparent 92%);
  mask-image:linear-gradient(to right,#000 40%,transparent 92%),linear-gradient(to bottom,#000 40%,transparent 92%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.hero .fl-hero-garlands .fl-g-br{
  right:-8px;bottom:42px;width:clamp(140px,22vw,240px);transform:rotate(180deg);
  -webkit-mask-image:linear-gradient(to right,#000 40%,transparent 92%),linear-gradient(to bottom,#000 40%,transparent 92%);
  mask-image:linear-gradient(to right,#000 40%,transparent 92%),linear-gradient(to bottom,#000 40%,transparent 92%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.hero .fl-hero-garlands .fl-g-bottom{
  left:0;right:0;bottom:-1px;width:100%;height:clamp(40px,7vw,68px);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 45%,#000 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 45%,#000 100%);
}
.hero .fl-hero-garlands .fl-g-bottom img{
  width:100%;height:100%;object-fit:cover;object-position:center 70%;opacity:.84;
}
.hero .copy{position:relative;z-index:3}
.hero .scroll-cue{z-index:3}

/* Soft bottom garland under key sections */
.fl-sec-garland{
  position:relative;
}
.fl-sec-garland::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:clamp(28px,5vw,48px);
  background:url("../images/ks-festive-bottom-garland.webp") center bottom / cover no-repeat;
  opacity:.55;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 55%,#000 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 55%,#000 100%);
  filter:saturate(.65) sepia(.15) brightness(1.05);
}
.fl-premium-band.fl-sec-garland::after{opacity:.4}

/* Stronger page snow: more flakes, softer */
.fl-snow{z-index:40}
 .fl-snow > span{opacity:calc(var(--o) * .85)}

@media (max-width:900px){
  .fl-birth .months{grid-template-columns:repeat(2,1fr);max-width:560px;gap:14px}
  .stone-chip{width:48px;height:48px}.stone-chip.lg{width:64px;height:64px}
  .fl-page-garlands .fl-g-tl,.fl-page-garlands .fl-g-tr,
  .fl-page-garlands .fl-g-bl,.fl-page-garlands .fl-g-br{width:clamp(96px,28vw,140px)}
  .hero .fl-hero-garlands .fl-g-tl,.hero .fl-hero-garlands .fl-g-br{width:clamp(110px,34vw,150px)}
  .hero .fl-hero-garlands .fl-g-bottom{height:clamp(32px,10vw,48px)}
  .fl-sec-garland::after{height:clamp(22px,8vw,36px);opacity:.45}
}
@media (max-width:640px){
  .fl-birth .months{grid-template-columns:1fr 1fr;max-width:420px}
  .fl-birth .month .mn{font-size:18px}
  .fl-birth .month .st{font-size:9px;letter-spacing:.12em}
  .stone-chip{width:44px;height:44px}.stone-chip.lg{width:56px;height:56px}
  .fl-page-garlands .fl-g-tr,.fl-page-garlands .fl-g-bl{display:none}
  .fl-snow > span:nth-child(n+12){display:none}
}
@media (prefers-reduced-motion:reduce){
   .fl-snow > span{animation:none;display:none}
}
