/* Christmas campaign landing page (templates/page-christmas.php). Tokens only. Loaded on that template alone. */

/* ---------- Hero: orange, falling snow, white tree, scalloped bottom edge ---------- */
.xmas-hero{background:var(--surface-signal);color:var(--text-on-signal);padding-bottom:calc(var(--section-pad) + 16px)}
.xmas-hero__snow{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.xmas-hero__snow i,.xmas-hero__snow svg{position:absolute;top:0;display:block;background:var(--cm-white);will-change:transform;animation:xmas-snowfall var(--dur) linear var(--delay) infinite}
.xmas-hero__snow svg{background:none;color:var(--cm-white);animation:xmas-snowfall var(--dur) linear var(--delay) infinite,xmas-spin calc(var(--dur) * .8) linear infinite}
@keyframes xmas-snowfall{from{transform:translate3d(0,-10vh,0)}to{transform:translate3d(var(--drift),110vh,0)}}
@keyframes xmas-spin{to{rotate:360deg}}
.section > .wrap.xmas-hero__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:var(--space-6) var(--space-5);align-items:end}
.xmas-hero__copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:var(--space-5);align-items:flex-start;padding-bottom:var(--space-4)}
.xmas-hero__copy .d-xl{text-wrap:balance}
.xmas-hero__copy .body-l,.xmas-hero__copy .label{color:var(--text-on-signal)}
.xmas-hero__copy .body-l{max-width:46ch}
.xmas-hero__tree{display:flex;justify-content:center;align-items:flex-end;pointer-events:none}
.xmas-hero__tree img{height:clamp(360px,52vw,720px);width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(21,24,22,.28))}
@media (max-width:1024px){.xmas-hero__tree{display:none}}
.xmas-hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;z-index:3;height:28px;background-image:radial-gradient(circle at 50% 100%,var(--surface-page) 17px,transparent 18px);background-size:34px 28px;background-repeat:repeat-x}

/* ---------- Deadline strip with countdown ---------- */
.section.xmas-deadline{padding-top:var(--space-6);padding-bottom:0}
.xmas-deadline__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-5) var(--space-7);border:var(--border-hair) solid var(--line-grid);background:var(--surface-panel);padding:var(--space-5)}
.xmas-deadline .label{display:flex;align-items:center;gap:var(--space-3)}
.xmas-deadline .sq{width:8px;height:8px;flex:none;background:var(--cm-orange)}
.xmas-clock{display:flex;gap:1px;background:var(--line-grid)}
.xmas-clock__cell{background:var(--surface-page);padding:10px var(--space-4);min-width:72px;text-align:center}
.xmas-clock__cell b{display:block;font-family:var(--font-display);font-stretch:var(--stretch-display);font-weight:var(--weight-display);font-size:36px;line-height:.9;font-variant-numeric:tabular-nums}
.xmas-clock__cell .label-s{display:block;margin-top:6px;color:var(--text-secondary)}

/* ---------- Offers: two gift-wrapped rate cards ---------- */
.xmas-offers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:var(--space-8) var(--space-5);padding-top:var(--space-7)}
.xmas-gift{--ribbon-x:clamp(48px,7vw,80px);position:relative;color:var(--text-on-data);padding:clamp(32px,4vw,48px) clamp(24px,3vw,40px) clamp(24px,3vw,32px);display:flex;flex-direction:column;gap:var(--space-4)}
.xmas-gift--mint{background:var(--cm-mint)}
.xmas-gift--white{background:var(--cm-white)}
.xmas-gift__ribbon{position:absolute;background:var(--cm-orange)}
.xmas-gift__ribbon--v{top:0;bottom:0;right:var(--ribbon-x);width:24px}
.xmas-gift__ribbon--h{left:0;right:0;top:28px;height:24px}
.xmas-gift__bow{position:absolute;right:calc(var(--ribbon-x) - 28px);top:-52px;width:80px;height:80px;color:var(--cm-orange)}
.xmas-gift > :not(.xmas-gift__ribbon):not(.xmas-gift__bow){position:relative}
.xmas-gift__label{margin-top:40px;color:var(--text-on-data)}
.xmas-gift__weeks{font-family:var(--font-display);font-stretch:var(--stretch-display);font-weight:var(--weight-display);font-size:clamp(64px,8vw,104px);line-height:.85;letter-spacing:-.03em}
.xmas-gift__rate{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px var(--space-3);padding-top:var(--space-4);border-top:var(--border-hair) solid rgba(21,24,22,.28);margin-right:calc(var(--ribbon-x) + 20px)}
.xmas-gift__rate b{font-family:var(--font-display);font-stretch:var(--stretch-display);font-weight:var(--weight-display);font-size:44px;line-height:.9}
.xmas-gift__points{display:grid;gap:var(--space-2);margin-right:calc(var(--ribbon-x) + 20px)}
.xmas-gift__points li{display:flex;gap:10px;align-items:flex-start;line-height:1.4}
.xmas-gift__points .icon{flex:none;margin-top:2px}
.xmas-gift .btn{margin-top:var(--space-2)}

/* ---------- Street photo with audience figures overlapping it ---------- */
.xmas-street{position:relative;background:var(--cm-black-900);border-block:var(--border-hair) solid var(--line-grid)}
.xmas-street > img{display:block;width:100%;height:clamp(320px,52vw,720px);object-fit:cover;object-position:50% 52%}
.xmas-street__stats{position:relative;max-width:calc(var(--container-max) + 2 * var(--container-pad));margin:-72px auto 0;padding:0 var(--container-pad) var(--space-7)}
.xmas-street__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:1px;background:rgba(21,24,22,.25);border:var(--border-hair) solid rgba(21,24,22,.25)}
.xmas-street__cell{background:var(--cm-mint);color:var(--text-on-data);padding:var(--space-5)}
.xmas-street__cell b{display:block;font-family:var(--font-display);font-stretch:var(--stretch-display);font-weight:var(--weight-display);font-size:clamp(36px,4vw,56px);line-height:.9;letter-spacing:-.02em}
.xmas-street__cell span{display:block;margin-top:var(--space-2);font-size:15px}
.xmas-street__stats > p{margin-top:var(--space-4)}

/* ---------- Four steps ---------- */
.xmas-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1px;background:var(--line-grid);border:var(--border-hair) solid var(--line-grid)}
.xmas-steps li{background:var(--surface-page);padding:28px var(--space-5);display:flex;flex-direction:column;gap:14px;min-height:220px}
.xmas-steps .label-s{color:var(--cm-orange)}

/* ---------- Christmas questions ---------- */
.section.xmas-faq{padding-top:0}
.xmas-faq__grid{display:flex;flex-wrap:wrap;gap:var(--space-4) var(--space-7);align-items:flex-start;padding-top:var(--space-6);border-top:var(--border-hair) solid var(--line-grid)}
.xmas-faq__grid > h2{flex:1 1 260px}
.xmas-faq__grid > .faq{flex:2 1 min(100%,560px);min-width:0}

/* ---------- Closing call to action on mint ---------- */
.xmas-cta{background:var(--surface-data);color:var(--text-on-data)}
.xmas-cta__flake{position:absolute;opacity:.12;color:var(--cm-black);pointer-events:none}
.xmas-cta__row{display:flex;flex-wrap:wrap;gap:var(--space-6) var(--space-7);align-items:flex-end;justify-content:space-between}
.xmas-cta__copy{display:flex;flex-direction:column;gap:20px;max-width:760px}
.xmas-cta .d-xl{font-size:clamp(44px,6vw,96px);text-wrap:balance}
.xmas-cta .body-l{color:var(--text-on-data);max-width:52ch}

@media (prefers-reduced-motion:reduce){.xmas-hero__snow i,.xmas-hero__snow svg{animation:none}}