/* Verdia — kersteditie (enkel voor index-kerst.html) */

body.kerst {
  --vd-gold:      #c9a13b;
  --vd-gold-dark: #a8822a;
  --vd-cream:     #fbf7ef;
  --vd-sand:      #f0e8d8;
  --vd-line:      #e2d5bd;
  --vd-footer:    #0f2a1d;
  --xm-green:     #14402c;
  --xm-red:       #a3202a;
  --cnvs-themecolor: #a3202a;
  --cnvs-themecolor-rgb: 163, 32, 42;
}

/* Feestelijk lettertype voor de grote titels */
body.kerst .vd-title,
body.kerst .vd-hero-h1,
body.kerst .vd-banner-box h2 { font-family: 'Mountains of Christmas', cursive; font-weight: 700; }
body.kerst .vd-title { color: var(--xm-green); }
body.kerst .vd-hero-h1 em { color: #f3d27a; text-shadow: 0 0 16px rgba(243,210,122,0.6); }
body.kerst .vd-tag { color: var(--xm-red); }

/* Knoppen in kerstrood, goud blijft voor accenten */
body.kerst .vd-btn { background: var(--xm-red); border-color: var(--xm-red); }
body.kerst .vd-btn:hover { background: #821820; border-color: #821820; }
body.kerst .vd-card-link { color: var(--xm-red) !important; }
body.kerst .vd-card:hover .vd-card-link { color: #821820 !important; }
body.kerst .vd-divider i, body.kerst .vd-usp i, body.kerst .vd-step-nr { color: var(--xm-red); }

/* Dennengroene vlakken */
body.kerst #vd-werkwijze { background: var(--xm-green); }
body.kerst #vd-werkwijze .vd-title, body.kerst #vd-werkwijze .vd-step h4 { color: #fbf7ef; }
body.kerst #vd-werkwijze .vd-lead, body.kerst #vd-werkwijze .vd-step p { color: rgba(251,247,239,0.75); }
body.kerst #vd-werkwijze .vd-tag, body.kerst #vd-werkwijze .vd-step-nr, body.kerst #vd-werkwijze .vd-divider i { color: #f3d27a; }
body.kerst #vd-hero::before { background: linear-gradient(to right, rgba(15,42,29,0.85) 30%, rgba(15,42,29,0.3) 100%); }
body.kerst .vd-banner-box { background: rgba(15,42,29,0.68); }
body.kerst .vd-banner-box h2 { color: #f3d27a; }
.xm-sub { display: block; font-style: italic; color: #f6e7c1; margin: -0.4rem 0 1.2rem; }

/* Kaarten met een gouden randje */
body.kerst .vd-card { border-color: rgba(201,161,59,0.45); }
body.kerst .vd-card:hover { box-shadow: 0 10px 30px rgba(163,32,42,0.15); }

/* Lint bovenaan */
.xm-ribbon { position: relative; z-index: 400; background: var(--xm-red); color: #fff; text-align: center; font-family: 'Jost', sans-serif; font-weight: 600; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.45rem 1rem; }
.xm-ribbon a { color: #fff; text-decoration: underline; margin-left: 0.6rem; text-transform: none; letter-spacing: 0; font-weight: 500; }

/* Dwarrelende sneeuw */
.xm-snow { position: fixed; inset: 0; pointer-events: none; z-index: 350; overflow: hidden; }
.xm-snow span { position: absolute; top: -40px; color: #fff; text-shadow: 0 0 4px rgba(120,140,160,0.6); opacity: 0.85; animation: xm-fall linear infinite; }
.xm-snow span:nth-child(4n+1) { font-size: 0.9rem; animation-duration: 11s; }
.xm-snow span:nth-child(4n+2) { font-size: 1.3rem; animation-duration: 15s; }
.xm-snow span:nth-child(4n+3) { font-size: 0.7rem; animation-duration: 9s; }
.xm-snow span:nth-child(4n)   { font-size: 1.6rem; animation-duration: 19s; }
.xm-snow span:nth-child(1)  { left: 3%;  animation-delay: 0s; }
.xm-snow span:nth-child(2)  { left: 8%;  animation-delay: 4s; }
.xm-snow span:nth-child(3)  { left: 13%; animation-delay: 2s; }
.xm-snow span:nth-child(4)  { left: 18%; animation-delay: 7s; }
.xm-snow span:nth-child(5)  { left: 23%; animation-delay: 1s; }
.xm-snow span:nth-child(6)  { left: 28%; animation-delay: 9s; }
.xm-snow span:nth-child(7)  { left: 33%; animation-delay: 3s; }
.xm-snow span:nth-child(8)  { left: 38%; animation-delay: 6s; }
.xm-snow span:nth-child(9)  { left: 43%; animation-delay: 0.5s; }
.xm-snow span:nth-child(10) { left: 48%; animation-delay: 8s; }
.xm-snow span:nth-child(11) { left: 53%; animation-delay: 2.5s; }
.xm-snow span:nth-child(12) { left: 58%; animation-delay: 5s; }
.xm-snow span:nth-child(13) { left: 63%; animation-delay: 1.5s; }
.xm-snow span:nth-child(14) { left: 68%; animation-delay: 10s; }
.xm-snow span:nth-child(15) { left: 73%; animation-delay: 3.5s; }
.xm-snow span:nth-child(16) { left: 78%; animation-delay: 6.5s; }
.xm-snow span:nth-child(17) { left: 83%; animation-delay: 0.8s; }
.xm-snow span:nth-child(18) { left: 88%; animation-delay: 7.5s; }
.xm-snow span:nth-child(19) { left: 93%; animation-delay: 4.5s; }
.xm-snow span:nth-child(20) { left: 97%; animation-delay: 2.2s; }
.xm-snow span:nth-child(21) { left: 25%; animation-delay: 11s; }
.xm-snow span:nth-child(22) { left: 50%; animation-delay: 12s; }
.xm-snow span:nth-child(23) { left: 70%; animation-delay: 13s; }
.xm-snow span:nth-child(24) { left: 90%; animation-delay: 14s; }
@keyframes xm-fall {
  0%   { transform: translate(0, 0) rotate(0deg); }
  50%  { transform: translate(25px, 55vh) rotate(180deg); }
  100% { transform: translate(-15px, 110vh) rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) { .xm-snow { display: none; } }

/* Ster in plaats van het pijltje naar boven */
body.kerst #gotoTop { background: transparent !important; font-size: 0; width: 46px; height: 46px; }
body.kerst #gotoTop::before { content: '⭐'; font-size: 2rem; line-height: 46px; display: block; text-align: center; }

/* Footer in dennengroen */
body.kerst #footer { --cnvs-footer-bg: var(--xm-green); }
body.kerst #copyrights { background: #0b1f15; }
