/* ===== Kerst theme (light touch). Remove the <link>/<script> lines for christmas.* to switch it off. ===== */
html.christmas{ --xm-red:#C0262D; --xm-red-deep:#9E1B22; --xm-green:#14502F; --xm-green-soft:#EAF4EE; --xm-gold:#E8B64A; }

/* Announcement bars: deep green + red */
html.christmas .announce{ background:var(--xm-green); color:#FFF3D6; position:relative; overflow:hidden; letter-spacing:.04em; }
html.christmas .announce .timer span{ background:var(--xm-red); color:#fff; font-weight:800; }
html.christmas .announce-sub{ background:var(--xm-red); color:#fff; }

/* Snowflakes drifting through the top bar */
.xm-snow{ position:absolute; inset:0; pointer-events:none; }
.xm-snow span{ position:absolute; top:1px; right:-30px; font-size:.8rem; line-height:1; opacity:.85; animation:xmDrift 15s linear infinite; }
.xm-snow span:nth-child(2){ animation-delay:-5s; font-size:.65rem; }
.xm-snow span:nth-child(3){ animation-delay:-10s; font-size:.75rem; top:2px; }
@keyframes xmDrift{ 0%{ right:-30px; transform:translateY(0) rotate(0); } 100%{ right:calc(100% + 30px); transform:translateY(2px) rotate(360deg); } }

/* String of lights along the header */
html.christmas header.site{ position:sticky; }
html.christmas header.site::before{
  content:""; position:absolute; left:0; right:0; top:0; height:6px; pointer-events:none; opacity:.9;
  background:
    radial-gradient(circle at 10px 3px, #C0262D 0 2.5px, transparent 3px) 0 0/48px 6px repeat-x,
    radial-gradient(circle at 22px 3px, #E8B64A 0 2.5px, transparent 3px) 0 0/48px 6px repeat-x,
    radial-gradient(circle at 34px 3px, #2E9B5B 0 2.5px, transparent 3px) 0 0/48px 6px repeat-x;
}

/* Discounts in Christmas colours */
html.christmas .product-card .badge-sale{ background:var(--xm-red); color:#fff; box-shadow:0 6px 14px -8px rgba(192,38,45,.9); }
html.christmas .product-card .badge-sale::before{ content:"🎄 "; font-size:.78em; }
html.christmas .save-tag{ background:var(--xm-red); color:#fff; }
html.christmas .bundle .ribbon{ background:var(--xm-green); color:#fff; }
html.christmas .bundle.selected{ border-color:var(--xm-green); }
html.christmas .bundle .gift{ color:var(--xm-green); }
html.christmas .price-row .was{ text-decoration-color:var(--xm-red); }
html.christmas .cs-row.sav{ color:var(--xm-red-deep); }
html.christmas .cart-drawer{ border-top:4px solid var(--xm-red); }
html.christmas .cart-shipping{ background:var(--xm-green-soft); }
html.christmas .ticker-wrap{ background:var(--xm-green); }
html.christmas .ticker span{ color:#FFF3D6; }
html.christmas .xm-eyebrow{ color:var(--xm-red-deep); }

/* Homepage Christmas band */
.xm-band{ background:linear-gradient(135deg,#14502F,#1B6B40 55%,#9E1B22); color:#fff; position:relative; overflow:hidden; }
.xm-band .wrap{ display:grid; grid-template-columns:1.1fr .9fr; gap:1.6rem; align-items:center; padding-block:2.2rem; }
.xm-band h2{ font-family:"Poppins",sans-serif; font-size:clamp(1.5rem,3.2vw,2.3rem); margin:.2em 0 .3em; color:#fff; }
.xm-band h2 em{ font-style:normal; color:#E8B64A; }
.xm-band p{ color:#E3F1E8; margin:0 0 1rem; max-width:52ch; }
.xm-band .eyebrow{ color:#F3D58A; }
.xm-band .xm-cta{ display:flex; gap:.7rem; flex-wrap:wrap; }
.xm-band .btn-xm{ background:#E8B64A; color:#2A1408; font-weight:800; }
.xm-band .btn-xm:hover{ background:#F2C76A; }
.xm-band .btn-outline{ border:1.5px solid #F3D58A; color:#FFF3D6; background:transparent; }
.xm-band .btn-outline:hover{ background:rgba(243,213,138,.15); }
.xm-band .pics{ display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
.xm-band .pics a{ display:block; border-radius:16px; overflow:hidden; border:2px solid rgba(243,213,138,.55); position:relative; background:#0d3a21; }
.xm-band .pics img{ display:block; width:100%; aspect-ratio:1/1; object-fit:cover; transition:transform .4s var(--ease); }
.xm-band .pics a:hover img{ transform:scale(1.05); }
.xm-band .pics span{ position:absolute; left:8px; bottom:8px; background:#C0262D; color:#fff; font-weight:800; font-size:.72rem; padding:.25em .7em; border-radius:999px; }
.xm-band::before, .xm-band::after{ content:"❄"; position:absolute; font-size:2.6rem; opacity:.14; pointer-events:none; }
.xm-band::before{ left:2%; bottom:-6px; transform:rotate(-14deg); }
.xm-band::after{ right:3%; top:-4px; transform:rotate(12deg); }
@media (max-width:860px){ .xm-band .wrap{ grid-template-columns:1fr; } html.christmas header.site::before{ height:5px; } }

/* ===== Extra festive layer ===== */
#xm-snow-canvas{ position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:60; }

/* Festive strip under the header */
.xm-strip{ background:linear-gradient(90deg,#9E1B22,#C0262D 50%,#9E1B22); color:#fff; text-align:center; font-size:.82rem; font-weight:700; letter-spacing:.03em; padding:.55rem 1rem; }
.xm-strip b{ color:#F3D58A; }
.xm-strip span.sep{ opacity:.55; margin:0 .6em; }
@media (max-width:640px){ .xm-strip{ font-size:.72rem; padding:.45rem .6rem; } .xm-strip .hide-sm{ display:none; } }

/* Hero: soft red/green glow + round sticker */
html.christmas .hero{ position:relative; background:
  radial-gradient(60rem 28rem at 8% -10%, rgba(192,38,45,.10), transparent 60%),
  radial-gradient(52rem 26rem at 105% 10%, rgba(20,80,47,.12), transparent 60%); }
.xm-sticker{ position:absolute; top:-10px; right:-6px; z-index:5; width:92px; height:92px; border-radius:50%; background:#C0262D; color:#fff; display:grid; place-items:center; text-align:center; font-weight:800; font-size:.7rem; line-height:1.15; letter-spacing:.04em; box-shadow:0 12px 24px -10px rgba(158,27,34,.8); border:3px dashed rgba(255,255,255,.75); transform:rotate(12deg); animation:xmWiggle 4s ease-in-out infinite; }
.xm-sticker b{ display:block; font-size:1.25rem; }
@keyframes xmWiggle{ 0%,100%{ transform:rotate(12deg); } 50%{ transform:rotate(6deg) scale(1.04); } }
.hero-art{ position:relative; }

/* Gift ribbon on product cards */
.product-card .shot{ position:relative; }
.xm-gift{ position:absolute; left:10px; bottom:10px; z-index:3; background:#14502F; color:#fff; font-size:.7rem; font-weight:800; padding:.3em .7em; border-radius:999px; box-shadow:0 6px 14px -8px rgba(0,0,0,.6); }

/* Sparkle on eyebrows */
html.christmas .eyebrow::before{ content:"❄ "; opacity:.8; }
html.christmas .xm-band .eyebrow::before, html.christmas .xm-gifts .eyebrow::before{ content:""; }

/* Gift guide */
.xm-gifts{ background:#FFF9EE; border-block:1px solid #F0E3C4; padding-block:2.6rem; position:relative; }
.xm-gifts .center{ text-align:center; max-width:640px; margin-inline:auto; }
.xm-gifts h2{ font-family:"Poppins",sans-serif; margin:.2em 0 .3em; }
.xm-gifts h2 em{ font-style:normal; color:#C0262D; }
.xm-gift-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; margin-top:1.6rem; }
.xm-gift-card{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #F0E3C4; border-radius:16px; overflow:hidden; text-decoration:none; color:inherit; transition:transform .2s ease, box-shadow .2s ease; }
.xm-gift-card:hover{ transform:translateY(-4px); box-shadow:0 18px 28px -20px rgba(158,27,34,.5); }
.xm-gift-card img{ width:100%; aspect-ratio:1/1; object-fit:cover; background:#f6f1e7; }
.xm-gift-card .tag{ position:absolute; top:8px; left:8px; background:#C0262D; color:#fff; font-size:.66rem; font-weight:800; padding:.25em .65em; border-radius:999px; z-index:2; }
.xm-gift-card .b{ padding:.7rem .8rem .9rem; display:flex; flex-direction:column; gap:.15rem; }
.xm-gift-card .b small{ color:#14502F; font-weight:800; font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; }
.xm-gift-card .b strong{ font-size:.95rem; }
.xm-gift-card .b span{ font-size:.9rem; }
.xm-gift-card .b s{ color:#8a8a8a; margin-left:.4em; font-size:.8rem; }
.xm-gift-note{ text-align:center; margin-top:1.3rem; font-size:.88rem; color:#5b4b2a; font-weight:600; }
@media (max-width:1000px){ .xm-gift-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .xm-gift-grid{ grid-template-columns:repeat(2,1fr); } .xm-sticker{ width:74px; height:74px; font-size:.6rem; } .xm-sticker b{ font-size:1rem; } }

/* Snow drift on top of the footer */
html.christmas footer{ position:relative; margin-top:34px; }
html.christmas footer::before{ content:""; position:absolute; left:0; right:0; top:-33px; height:34px; pointer-events:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 34' preserveAspectRatio='none'><path d='M0 34V20c10 0 10-14 20-14s10 14 20 14 10-12 20-12 10 12 20 12 10-14 20-14 10 14 20 14v14z' fill='%23ffffff'/></svg>") repeat-x left bottom / 120px 34px; }

/* Kerst product page banner */
.xm-page-banner{ background:#14502F; color:#FFF3D6; text-align:center; font-size:.85rem; font-weight:700; padding:.55rem 1rem; letter-spacing:.03em; }
.xm-page-banner b{ color:#F3D58A; }