/* holiday countdown maker */
.cd-hero{padding:28px 0 24px}
.cd-hero h1{font-size:clamp(2.25rem,8vw,3.75rem);max-width:16ch;margin:18px 0 16px}
.cd-hero .cta-row{margin-top:24px}
.cd-maker{padding:16px 0 56px;scroll-margin-top:12px}
.cd-grid{display:grid;gap:24px;align-items:start}
.cd-panel{border-radius:28px;padding:22px 18px;max-width:44rem}
.cd-panel h2{font-size:clamp(1.5rem,5vw,2rem);margin-bottom:6px}
.cd-panel>p{color:var(--muted)}
.cd-panel fieldset{border:0;margin:0 0 20px;padding:0;min-width:0}
.cd-panel legend,.cd-panel label.lbl{display:block;font-weight:700;font-size:1.0625rem;margin:0 0 10px;padding:0}
.cd-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cd-opt{position:relative;min-width:0}
.cd-opt input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.cd-opt span{display:flex;align-items:center;justify-content:center;min-height:52px;padding:6px 10px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.05);font-weight:700;text-align:center;line-height:1.2;transition:background .2s,border-color .2s,transform .2s var(--ease)}
.cd-opt input:hover+span{background:rgba(139,123,255,.18)}
.cd-opt input:checked+span{background:linear-gradient(135deg,rgba(91,79,240,.55),rgba(217,96,154,.4));border-color:rgba(200,190,255,.7);box-shadow:0 0 18px -4px rgba(139,92,246,.7)}
.cd-opt input:focus-visible+span{outline:3px solid var(--violet);outline-offset:3px}
.cd-panel .hint{font-size:.875rem;color:var(--muted);margin:6px 0 0}
.cd-actions{display:grid;gap:12px;margin-top:22px}
.cd-actions .btn{width:100%;min-height:56px}
.cd-actions .btn.ghost{min-height:52px}
.cd-msg{min-height:1.6em;margin:14px 0 0;font-weight:600;color:var(--mint)}
.cd-stage{display:flex;justify-content:center}
.cd-frame{width:100%;max-width:420px;border-radius:28px;padding:10px;background:var(--glass);border:1px solid var(--line);box-shadow:var(--shadow)}
.cd-frame canvas{width:100%;height:auto;aspect-ratio:1080/1350;border-radius:20px;display:block;background:#0B1020}
.cd-info{padding:8px 0 48px}
.cd-info .prose{max-width:60rem}
.cd-steps{counter-reset:s;list-style:none;padding:0!important;display:grid;gap:12px}
.cd-steps li{counter-increment:s;position:relative;padding:14px 16px 14px 62px!important;min-height:60px;border-radius:20px;background:var(--glass);border:1px solid var(--line)}
.cd-steps li::before{content:counter(s);position:absolute;left:14px;top:12px;width:36px;height:36px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
.cd-more{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:14px 0 0}
.cd-more a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:rgba(139,123,255,.16);color:#d4ccff;font-weight:600}
.cd-more a:hover{background:rgba(139,123,255,.3)}
@media (min-width:720px){
  .cd-opts{grid-template-columns:repeat(4,1fr)}
  .cd-panel{padding:32px}
  .cd-actions{grid-template-columns:auto auto auto;justify-content:start}
  .cd-actions .btn{width:auto;min-width:14rem}
  .cd-actions .btn.ghost{min-width:0}
}
@media (min-width:960px){
  .cd-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px}
  .cd-opts{grid-template-columns:1fr 1fr}
  .cd-actions{grid-template-columns:1fr}
  .cd-actions .btn{width:100%}
  .cd-stage{position:sticky;top:16px}
}
@media (min-width:1100px){
  .cd-opts{grid-template-columns:repeat(4,1fr)}
}
@media (prefers-reduced-motion:reduce){.cd-opt span{transition:none}}
.sticky-cta.away{display:none!important}
