/* The Christmas section on the home page. Uses the home page's own colours, fonts and buttons (its variables);
   the lights, holly and stars come from christmas-deco.css. Hidden by "xmas-over" (christmas-date.js) after the season. */
/* Sacramento is declared here too because the catalogue page does not load it (the home page already does; the same file). */
@font-face{font-family:"Sacramento";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sacramento.woff2) format("woff2")}
html.xmas-over .xmas{display:none}
.xmas{padding-block:0 56px}
.xmas.xmas-cat{padding-block:0 12px}
.xm-card{position:relative;overflow:hidden;display:grid;gap:28px;padding:64px 24px 40px;border-radius:calc(var(--radius, 28px) + 10px);background:linear-gradient(160deg,#fff,var(--blush));box-shadow:inset 0 0 0 1.5px var(--line),0 30px 60px -40px rgba(120,40,60,.4)}
.xm-copy{position:relative;z-index:1;display:grid;gap:14px;justify-items:start;min-width:0}
.xm-copy h2{font-size:var(--h2, clamp(34px, 4.2vw, 50px))}
.xm-lede{color:var(--ink-soft);max-width:44ch}
.xm-pills{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.xm-pills li{padding:8px 16px;border-radius:999px;font-weight:600;font-size:15px;background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ribbon)}
.xm-pills .xm-gold{background:#2c6a44;color:#fff;box-shadow:none}
.xm-copy .btn{max-width:100%;white-space:nowrap;font-size:15px;padding-inline:14px;justify-self:stretch}
@media (min-width:600px){.xm-copy .btn{justify-self:start;font-size:16px;padding-inline:24px}}
.xm-photos{position:relative;justify-self:center;width:min(240px,72%);margin-bottom:18px}
.xm-arch{aspect-ratio:4/5;border-radius:999px 999px 24px 24px;overflow:hidden;border:6px solid #fff;box-shadow:0 24px 40px -22px rgba(120,40,60,.55);background:var(--blush)}
.xm-arch img,.xm-round img{display:block;width:100%;height:100%;object-fit:cover}
.xm-round{position:absolute;left:-16%;bottom:-12%;width:46%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:5px solid #fff;box-shadow:0 14px 26px -14px rgba(120,40,60,.6)}
.xm-card .d-holly.tl{display:none}
.xm-card .d-holly{top:30px}.xm-card .d-holly.br{top:auto;bottom:4px;right:4px}
.xm-card .d-star.s1{right:22px;top:52px}
@media (min-width:821px){
  .xm-card{grid-template-columns:1.1fr .9fr;align-items:center;gap:48px;padding:72px 56px 56px}
  .xm-photos{width:min(320px,100%);margin-bottom:0}
  .xm-card .d-holly.br{right:24px;bottom:16px}
}
.xm-deco{display:contents}
