.pkcd {
    --pkcd-bg-dark: #080d17;
    --pkcd-bg-card: #111827;
    --pkcd-gold: #e9be62;
    --pkcd-gold-soft: #f6d996;
    --pkcd-text: #f8fafc;
    --pkcd-muted: #c7ccd6;
    --pkcd-border: rgba(153, 172, 208, .38);
    --pkcd-radius: 18px;
    box-sizing: border-box;
    width: 100%;
    max-width: 1380px;
    margin: 2rem auto;
    padding: clamp(20px, 3.6vw, 48px);
    color: var(--pkcd-text);
    background:
        radial-gradient(circle at 11% 3%, rgba(230, 178, 74, .13), transparent 19%),
        radial-gradient(circle at 92% 1%, rgba(218, 67, 69, .15), transparent 24%),
        linear-gradient(180deg, #0b101b 0%, var(--pkcd-bg-dark) 100%);
    border-radius: 24px;
    overflow: hidden;
    font-family: inherit;
}
.pkcd *, .pkcd *::before, .pkcd *::after { box-sizing: border-box; }
.pkcd__header { text-align: center; margin: 0 auto clamp(20px, 3vw, 36px); }
.pkcd__header h2 { margin: .25rem 0 .35rem; color: #fff; font-size: clamp(2rem, 4.5vw, 4rem); line-height: 1.05; font-family: Georgia, 'Times New Roman', serif; font-weight: 700; letter-spacing: -.025em; }
.pkcd__header p { margin: 0; color: var(--pkcd-muted); font-size: clamp(1rem, 1.7vw, 1.35rem); }
.pkcd__ornament { display: flex; align-items: center; justify-content: center; gap: 18px; color: var(--pkcd-gold); margin-bottom: .5rem; }
.pkcd__ornament span { width: 70px; height: 1px; background: linear-gradient(90deg, transparent, var(--pkcd-gold)); }
.pkcd__ornament span:last-child { background: linear-gradient(90deg, var(--pkcd-gold), transparent); }
.pkcd__ornament b { font-size: 1.1rem; font-weight: 400; }

.pkcd-featured, .pkcd-card {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(90deg, rgba(3, 7, 14, .94) 0%, rgba(3, 7, 14, .76) 43%, rgba(3, 7, 14, .30) 100%),
        var(--pkcd-bg, radial-gradient(circle at 76% 35%, rgba(255, 180, 62, .27), transparent 9%), radial-gradient(circle at 81% 29%, rgba(255, 90, 95, .18), transparent 15%), linear-gradient(135deg, #10192a, #251722));
    background-size: cover;
    background-position: center;
    border: 1px solid var(--pkcd-border);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
}
.pkcd-featured::after, .pkcd-card::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 80% 35%, rgba(255, 205, 95, .10), transparent 25%);
}
.pkcd-featured { min-height: 400px; border-radius: var(--pkcd-radius); }
.pkcd-featured__content { position: relative; z-index: 2; width: min(72%, 900px); min-height: 400px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(26px, 4vw, 58px); }
.pkcd-badge { display: inline-flex; gap: 10px; align-items: center; padding: 8px 16px; border: 1px solid var(--pkcd-gold); border-radius: 999px; color: var(--pkcd-gold-soft); background: rgba(7, 8, 12, .58); font-weight: 600; }
.pkcd-featured h3 { margin: .65rem 0 .2rem; color: #fff; font-size: clamp(2.6rem, 6vw, 5.3rem); line-height: .98; font-family: Georgia, 'Times New Roman', serif; letter-spacing: -.035em; text-transform: uppercase; }
.pkcd-event-link { color: inherit !important; text-decoration: none !important; }
.pkcd-event-link:hover { text-decoration: underline !important; text-decoration-thickness: 1px !important; text-underline-offset: .16em; }
.pkcd-date { display: flex; gap: 10px; align-items: center; color: #f1f3f6; font-size: clamp(1rem, 1.7vw, 1.32rem); }

.pkcd-countdown { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); gap: 12px; margin-top: 28px; width: min(100%, 720px); }
.pkcd-countdown__unit { min-height: 122px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 14px 10px; border: 1px solid rgba(240, 207, 141, .55); border-radius: 14px; background: rgba(16, 14, 14, .78); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); }
.pkcd-countdown__unit strong { color: var(--pkcd-gold-soft); font: 700 clamp(2.2rem, 5vw, 3.7rem)/1 Georgia, 'Times New Roman', serif; font-variant-numeric: tabular-nums; }
.pkcd-countdown__unit span { margin-top: 7px; color: #fff; font-size: .98rem; }

.pkcd__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 18px; }
.pkcd-card { min-height: 245px; border-radius: 15px; background-image: linear-gradient(180deg, rgba(6, 10, 18, .30), rgba(6, 10, 18, .94)), var(--pkcd-bg, radial-gradient(circle at 70% 20%, rgba(255, 170, 61, .3), transparent 14%), linear-gradient(145deg, #121d31, #261720)); }
.pkcd-card__body { position: relative; z-index: 2; height: 100%; min-height: 245px; padding: 25px 26px 20px; display: flex; flex-direction: column; align-items: flex-start; }
.pkcd-card__icon { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--pkcd-gold); border-radius: 50%; color: var(--pkcd-gold); background: rgba(5, 8, 14, .65); }
.pkcd-card h3 { margin: 13px 0 4px; color: #fff; font: 700 clamp(1.35rem, 2.2vw, 2rem)/1.05 Georgia, 'Times New Roman', serif; }
.pkcd-card__date { color: #f5f5f6; font-size: 1rem; }
.pkcd-card__remaining { width: 100%; margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .28); color: #f1f1f2; font-size: .98rem; }
.pkcd-card__remaining > span:first-child { color: var(--pkcd-gold); margin-right: 7px; }

.pkcd-theme-new-year { background-position: center 46%; }
.pkcd-theme-venetsialaiset { background-position: center 50%; }

@media (max-width: 900px) {
    .pkcd { padding: 20px; border-radius: 18px; }
    .pkcd-featured { min-height: 0; }
    .pkcd-featured__content { width: 100%; min-height: 0; padding: 28px 22px; background: linear-gradient(90deg, rgba(3, 7, 14, .91), rgba(3, 7, 14, .62)); }
    .pkcd-featured h3 { font-size: clamp(2.15rem, 9vw, 4rem); word-break: break-word; }
    .pkcd-countdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pkcd__grid { grid-template-columns: 1fr; }
    .pkcd-card { min-height: 210px; }
    .pkcd-card__body { min-height: 210px; }
}

@media (max-width: 480px) {
    .pkcd { padding: 14px; margin: 1rem auto; }
    .pkcd__header h2 { font-size: 2rem; }
    .pkcd-featured__content { padding: 22px 17px; }
    .pkcd-badge { padding: 7px 12px; font-size: .88rem; }
    .pkcd-featured h3 { font-size: clamp(1.95rem, 11vw, 3rem); }
    .pkcd-date { font-size: .95rem; }
    .pkcd-countdown { gap: 9px; margin-top: 22px; }
    .pkcd-countdown__unit { min-height: 96px; }
    .pkcd-countdown__unit strong { font-size: 2.25rem; }
    .pkcd-countdown__unit span { font-size: .82rem; }
}

@media (prefers-reduced-motion: reduce) {
    .pkcd * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
