/* ============================================================================
 * Component: camp-theme-weihnachtsferien (0.324.1) — the Christmas look of /feriencamp/weihnachtsferien/ (activity 14557).
 * Winter-blue hero so the white snowflakes of the owner's image show; red and gold as decoration only; every action stays
 * ROBBO green. Decoration colours are the variables below; brand colours come from tokens.
 * ========================================================================= */
.rc-camp-landing[data-activity-id="14557"] {
    --xm-red: #B3202A;
    --xm-red-soft: #FBEDEC;
    --xm-gold: #C9962E;
    --xm-ice: #E8F2F8;
    --xm-ice-2: #F5FAFC;
}

/* ------------------------------------------------------------- hero --- */
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero {
    position: relative;
    background: linear-gradient(180deg, var(--xm-ice) 0%, var(--xm-ice-2) 68%, var(--robbo-white) 100%) !important;
}
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero-eyebrow {
    background: var(--robbo-white) !important;
    border-color: color-mix(in srgb, var(--xm-red) 30%, transparent) !important;
    color: var(--xm-red) !important;
}
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero::before,
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-repeat: repeat;
}
/* Snow: two slow layers of soft white dots; still under reduced motion. */
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero::before {
    background-image: radial-gradient(circle, var(--robbo-white) 0 2px, transparent 2.5px), radial-gradient(circle, var(--robbo-white) 0 3px, transparent 3.5px);
    background-size: 120px 120px, 190px 190px;
    background-position: 10px 20px, 70px 90px;
    opacity: 0.9;
    animation: rc-xm-snow 26s linear infinite;
}
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero::after {
    background-image: radial-gradient(circle, var(--robbo-white) 0 1.5px, transparent 2px);
    background-size: 90px 90px;
    background-position: 40px 0;
    opacity: 0.8;
    animation: rc-xm-snow2 38s linear infinite;
}
@keyframes rc-xm-snow { from { background-position: 10px 20px, 70px 90px; } to { background-position: 10px 140px, 70px 280px; } }
@keyframes rc-xm-snow2 { from { background-position: 40px 0; } to { background-position: 40px 90px; } }
.rc-camp-landing[data-activity-id="14557"] .rc-comp-hero > * { position: relative; z-index: 1; }

/* --------------------------------------------------- the story band --- */
.rc-xm { position: relative; padding: 48px 16px; background: linear-gradient(180deg, var(--xm-ice-2) 0%, var(--robbo-white) 100%); font-family: 'ProximaNova', 'Proxima Nova', 'Noto Sans', sans-serif; color: var(--robbo-coal); }
.rc-xm *, .rc-xm *::before, .rc-xm *::after { box-sizing: border-box; }
.rc-xm-wrap { max-width: 1180px; margin: 0 auto; text-align: center; }
.rc-xm-eyebrow { display: inline-block; padding: 4px 12px; border-radius: 999px; background: var(--robbo-white); border: 1px solid color-mix(in srgb, var(--xm-red) 30%, transparent); font-size: var(--robbo-fs-badge); font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: var(--xm-red); }
.rc-xm-h2 { margin: 12px auto 12px; max-width: 860px; font-family: 'Plakkaat', sans-serif; font-weight: 500; font-size: 28px; line-height: 1.2; color: var(--robbo-black); }
.rc-xm-lead { max-width: 820px; margin: 0 auto 24px; font-size: var(--robbo-fs-base); line-height: 1.6; text-wrap: pretty; }
.rc-xm-camps { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; text-align: left; }
.rc-xm-camp { display: flex; flex-direction: column; align-items: flex-start; margin: 0; padding: 20px; border: 1px solid var(--robbo-line); border-radius: 16px; background: var(--robbo-white); }
.rc-xm-ico { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0 0 14px; border-radius: 12px; background: var(--xm-red-soft); color: var(--xm-red); }
.rc-xm-h3 { margin: 0 0 8px; font-size: 20px; font-weight: 800; line-height: 1.25; color: var(--robbo-black); }
.rc-xm-h3 span { display: block; margin-top: 2px; font-size: var(--robbo-fs-md); font-weight: 700; color: var(--xm-red); }
.rc-xm-p { margin: 0 0 14px; font-size: var(--robbo-fs-md); line-height: 1.6; }
.rc-xm-link { margin-top: auto; font-size: var(--robbo-fs-md); font-weight: 700; color: var(--robbo-green-dark); text-decoration: underline; text-underline-offset: 3px; }
.rc-xm-link:hover { color: var(--robbo-green); }
@media (min-width: 720px) { .rc-xm-camps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } .rc-xm-camp { padding: 24px; } }
@media (min-width: 1024px) { .rc-xm { padding: 64px 32px; } .rc-xm-h2 { font-size: 32px; } }

/* ---------------------------------------- the shared tabs on this page: white cards instead of six pastels --- */
.rc-camp-landing[data-activity-id="14557"] .rc-ta-pcard {
    background: var(--robbo-white) !important;
    border: 1px solid var(--robbo-line) !important;
    box-shadow: none !important;
}
.rc-camp-landing[data-activity-id="14557"] .rc-ta-pcard > div:first-child { background: var(--xm-red) !important; }

@media (prefers-reduced-motion: reduce) {
    .rc-camp-landing[data-activity-id="14557"] .rc-comp-hero::before,
    .rc-camp-landing[data-activity-id="14557"] .rc-comp-hero::after { animation: none; }
}