/**
 * bday-theme-schnitzeljagd — blocky treasure-hunt skin + own sections (0.300.9).
 *
 * Scoped to .rc-bp--schnitzeljagd. Look: grass, earth, stone, gold and gems — square
 * corners and stepped shadows drawn with CSS only, no Minecraft textures, logos or
 * characters. Brand colours and text sizes stay on var(--robbo-*); Plakkaat only for h2.
 */

.rc-bp--schnitzeljagd {
    --sj-gras: #5d9b3a;
    --sj-gras-dark: #3f6e26;
    --sj-gras-soft: #e6f2dc;
    --sj-erde: #8b5a2b;
    --sj-erde-dark: #5e3b1b;
    --sj-erde-soft: #f4ebe1;
    --sj-stein: #8d9196;
    --sj-stein-dark: #5f6368;
    --sj-himmel: #e6f4ff;
    --sj-gold: #f2c230;
    --sj-gold-dark: #b8901c;
    --sj-diamant: #47c8c0;
    --sj-diamant-dark: #23928b;
    --sj-smaragd: #26b553;
    --sj-redstone: #c0392b;
    --sj-tinte: #26292d;
    --sj-motor: #3f6fd8;
    --sj-motor-soft: #e4ecff;
    --sj-ctrl: #2f9b6a;
    --sj-ctrl-soft: #e2f5ec;
    --sj-var: #d0702a;
    --sj-var-soft: #fde9da;
    --sj-say: #7b56c8;
    --sj-say-soft: #efe8fb;
    --sj-event: #3b8fd9;
    --sj-event-soft: #e2f0fc;
    --sj-ok: #1f7a2a;
}

/* ---- Skin on shared components ------------------------------------------ */
.rc-bp--schnitzeljagd .rc-comp-hero {
    background:
        radial-gradient(circle at 86% 20%, rgba(242, 194, 48, .25) 0, rgba(242, 194, 48, 0) 320px),
        linear-gradient(180deg, var(--sj-himmel) 0%, var(--robbo-white) 78%, var(--sj-gras-soft) 100%);
}
.rc-bp--schnitzeljagd .rc-comp-hero-eyebrow { color: var(--sj-gras-dark); background: var(--sj-gras-soft); }
.rc-bp--schnitzeljagd .rc-comp-hero-confetti { display: none; }

/* Ablauf: six steps → 3 + 3, block colours, square corners */
.rc-bp--schnitzeljagd .rc-comp-program-step { --st: var(--sj-gras); border-top: 6px solid var(--st); border-radius: 6px; }
.rc-bp--schnitzeljagd .rc-comp-program-num { background: var(--st); border-radius: 6px; box-shadow: 4px 4px 0 rgba(0, 0, 0, .18); }
.rc-bp--schnitzeljagd .rc-comp-program-step:nth-child(3n+2) { --st: var(--sj-erde); }
.rc-bp--schnitzeljagd .rc-comp-program-step:nth-child(3n) { --st: var(--sj-diamant-dark); }

/* ---- Own sections -------------------------------------------------------- */
.rc-sj { padding: 56px 0; font-family: 'ProximaNova', 'Proxima Nova', 'Noto Sans', sans-serif; color: var(--robbo-coal); }
.rc-sj-wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
.rc-sj-head { max-width: 800px; margin: 0 auto 28px; text-align: center; }
.rc-sj-eyebrow {
    display: inline-block;
    font-size: var(--robbo-fs-badge);
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--robbo-white);
    background: var(--sj-gras-dark);
    padding: 6px 12px;
    border-radius: 4px;
    box-shadow: 3px 3px 0 var(--sj-erde-dark);
}
.rc-sj-eyebrow--gold { color: var(--sj-tinte); background: var(--sj-gold); box-shadow: 3px 3px 0 var(--sj-gold-dark); }
.rc-sj-h2 { font-family: 'Plakkaat', 'ProximaNova', sans-serif; font-weight: 500; font-size: 32px; line-height: 1.2; margin: 14px 0 10px; color: var(--robbo-coal); }
.rc-sj-h3 { font-family: 'ProximaNova', 'Proxima Nova', 'Noto Sans', sans-serif; font-weight: 800; font-size: 20px; line-height: 1.25; margin: 0 0 10px; color: var(--robbo-coal); }
.rc-sj-lead { font-size: var(--robbo-fs-lg); line-height: 1.6; margin: 0; }
.rc-sj-note { font-size: var(--robbo-fs-md); line-height: 1.55; text-align: center; max-width: 760px; margin: 22px auto 0; }

/* Facts */
.rc-sj-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 10px; margin: 0 0 44px; padding: 0; }
.rc-sj-fact { background: var(--robbo-white); border: 2px solid var(--sj-erde); border-radius: 6px; box-shadow: 4px 4px 0 var(--sj-erde-soft); padding: 12px 14px; min-width: 0; }
.rc-sj-fact dt { font-size: var(--robbo-fs-badge); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--sj-erde); margin: 0 0 4px; }
.rc-sj-fact dd { font-size: var(--robbo-fs-md); font-weight: 700; line-height: 1.4; margin: 0; overflow-wrap: anywhere; }

/* Two adventures */
.rc-sj-abenteuer { background: var(--sj-gras-soft); }
.rc-sj-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.rc-sj-card { background: var(--robbo-white); border: 3px solid var(--sj-tinte); border-radius: 8px; box-shadow: 6px 6px 0 rgba(38, 41, 45, .16); overflow: hidden; min-width: 0; }
.rc-sj-card-top { padding: 18px 20px 16px; color: var(--robbo-white); background: var(--sj-card, var(--sj-diamant-dark)); border-bottom: 3px solid var(--sj-tinte); }
.rc-sj-card--meer { --sj-card: var(--sj-diamant-dark); }
.rc-sj-card--pirat { --sj-card: var(--sj-erde); }
.rc-sj-card-fuer { display: block; font-size: var(--robbo-fs-badge); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .95; }
.rc-sj-card-name { font-size: 26px; font-weight: 800; line-height: 1.2; margin: 6px 0 2px; color: var(--robbo-white); }
.rc-sj-card-orig { display: block; font-size: var(--robbo-fs-md); font-style: italic; opacity: .9; }
.rc-sj-card-dl { margin: 0; padding: 4px 20px 20px; }
.rc-sj-card-dl dt { font-size: var(--robbo-fs-badge); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--sj-card, var(--sj-erde)); margin: 14px 0 4px; }
.rc-sj-card-dl dd { font-size: var(--robbo-fs-md); line-height: 1.55; margin: 0; }

/* Riddle quiz */
.rc-sj-code { background: var(--robbo-white); }
.rc-sj-quiz { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 28px; align-items: start; max-width: 1040px; margin: 0 auto; }
.rc-sj-quiz-main { min-width: 0; }
.rc-sj-door {
    position: relative; aspect-ratio: 3 / 4; width: 100%; max-width: 300px; justify-self: center; border-radius: 8px; overflow: hidden;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, .12) 1px, transparent 1px) 0 0 / 28px 28px,
        linear-gradient(0deg, rgba(0, 0, 0, .12) 1px, transparent 1px) 0 0 / 28px 28px,
        var(--sj-stein);
    border: 4px solid var(--sj-stein-dark);
    box-shadow: 6px 6px 0 rgba(38, 41, 45, .16);
}
.rc-sj-door::after { content: ''; position: absolute; inset: 18% 22% 0; background: radial-gradient(circle at 50% 30%, #fff6c9 0, var(--sj-gold) 40%, var(--sj-gold-dark) 100%); z-index: 0; }
.rc-sj-door-wing { position: absolute; top: 18%; bottom: 0; width: 28%; z-index: 1; background: linear-gradient(0deg, rgba(0, 0, 0, .14) 1px, transparent 1px) 0 0 / 100% 22px, var(--sj-erde); border: 3px solid var(--sj-erde-dark); transition: transform .9s ease; }
.rc-sj-door-wing--l { left: 22%; transform-origin: left center; }
.rc-sj-door-wing--r { right: 22%; transform-origin: right center; }
.rc-sj-door.is-open .rc-sj-door-wing--l { transform: perspective(600px) rotateY(-75deg); }
.rc-sj-door.is-open .rc-sj-door-wing--r { transform: perspective(600px) rotateY(75deg); }
.rc-sj-slots { position: absolute; top: 5%; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 2; }
.rc-sj-slot { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; font-family: 'ProximaNova', sans-serif; font-weight: 800; font-size: 22px; color: var(--sj-tinte); background: var(--robbo-grey-light); border: 3px solid var(--sj-stein-dark); border-radius: 4px; }
.rc-sj-slot.is-set { background: var(--sj-gold); border-color: var(--sj-gold-dark); }

.rc-sj-riddles { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.rc-sj-riddle { margin: 0; background: var(--sj-erde-soft); border: 2px solid var(--sj-erde); border-radius: 8px; padding: 18px 20px; box-shadow: 4px 4px 0 rgba(94, 59, 27, .14); }
.rc-sj-riddle-nr { display: block; font-size: var(--robbo-fs-badge); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--sj-erde); margin: 0 0 6px; }
.rc-sj-riddle-text { font-size: 20px; font-weight: 700; line-height: 1.45; margin: 0 0 10px; }
.rc-sj-tipps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.rc-sj-tipp { margin: 0; font-size: var(--robbo-fs-md); line-height: 1.5; }
.rc-sj-loesung { margin: 10px 0 0; font-size: var(--robbo-fs-md); }
.rc-sj-loesung summary { cursor: pointer; font-weight: 700; color: var(--sj-gras-dark); }
.rc-sj-loesung p { margin: 6px 0 0; }

/* JS mode: one riddle at a time, hints revealed on demand */
.rc-sj-quiz.is-live .rc-sj-riddle { display: none; }
.rc-sj-quiz.is-live .rc-sj-riddle.is-current { display: block; }
.rc-sj-quiz.is-live .rc-sj-tipp { display: none; }
.rc-sj-quiz.is-live .rc-sj-tipp.is-shown { display: block; }
.rc-sj-quiz.is-live .rc-sj-loesung { display: none; }
.rc-sj-quiz-ui[hidden], .rc-sj-btn[hidden] { display: none !important; }
.rc-sj-quiz-ui { margin: 14px 0 0; }
.rc-sj-quiz-row { margin: 0 0 12px; }
.rc-sj-answers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.rc-sj-answer {
    font-family: inherit; font-size: var(--robbo-fs-base); font-weight: 800; min-height: 52px; padding: 12px 14px;
    color: var(--sj-tinte); background: var(--robbo-white); border: 3px solid var(--sj-tinte); border-radius: 6px;
    box-shadow: 4px 4px 0 rgba(38, 41, 45, .2); cursor: pointer; transition: transform .1s ease, box-shadow .1s ease;
}
.rc-sj-answer:hover { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 rgba(38, 41, 45, .22); }
.rc-sj-answer:active { transform: translate(2px, 2px); box-shadow: 2px 2px 0 rgba(38, 41, 45, .2); }
.rc-sj-answer:focus-visible, .rc-sj-btn:focus-visible { outline: 3px solid var(--sj-gold); outline-offset: 2px; }
.rc-sj-answer.is-wrong { border-color: var(--sj-redstone); color: var(--sj-redstone); }
.rc-sj-answer.is-right { background: var(--sj-smaragd); border-color: var(--sj-gras-dark); color: var(--robbo-white); }
.rc-sj-answer[aria-disabled="true"] { cursor: default; }
.rc-sj-btn {
    font-family: inherit; font-size: var(--robbo-fs-base); font-weight: 800; min-height: 48px; padding: 12px 20px;
    border-radius: 6px; border: 3px solid var(--sj-gras-dark); cursor: pointer; color: var(--robbo-white); background: var(--sj-gras);
    box-shadow: 4px 4px 0 var(--sj-gras-dark);
}
.rc-sj-btn--ghost { color: var(--sj-tinte); background: var(--robbo-white); border-color: var(--sj-stein-dark); box-shadow: 4px 4px 0 rgba(95, 99, 104, .35); }
.rc-sj-btn:disabled, .rc-sj-btn[aria-disabled="true"] { opacity: .55; cursor: default; }
.rc-sj-result { font-size: var(--robbo-fs-lg); font-weight: 700; line-height: 1.5; margin: 14px 0 10px; min-height: 27px; }
.rc-sj-result.is-good { color: var(--sj-ok); }
.rc-sj-result.is-bad { color: var(--sj-redstone); }

/* So programmieren */
.rc-sj-prog { background: var(--sj-erde-soft); }
.rc-sj-progs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.rc-sj-progcard { background: var(--robbo-white); border: 2px solid var(--sj-erde); border-radius: 8px; padding: 18px; min-width: 0; box-shadow: 4px 4px 0 rgba(94, 59, 27, .14); }
.rc-sj-blocks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.rc-sj-b { margin: 0; padding: 9px 12px; border-radius: 4px; font-size: var(--robbo-fs-md); font-weight: 700; line-height: 1.35; border-left: 6px solid; overflow-wrap: anywhere; }
.rc-sj-b--event { background: var(--sj-event-soft); border-color: var(--sj-event); }
.rc-sj-b--ctrl  { background: var(--sj-ctrl-soft); border-color: var(--sj-ctrl); }
.rc-sj-b--var   { background: var(--sj-var-soft); border-color: var(--sj-var); }
.rc-sj-b--say   { background: var(--sj-say-soft); border-color: var(--sj-say); }

.rc-sj-legal { max-width: 1180px; margin: 0 auto; padding: 18px 24px 32px; box-sizing: border-box; font-family: 'ProximaNova', 'Proxima Nova', 'Noto Sans', sans-serif; font-size: var(--robbo-fs-legal); line-height: 1.5; color: var(--robbo-grey); text-align: center; }

@media (max-width: 1023px) {
    .rc-sj-cards { grid-template-columns: minmax(0, 1fr); max-width: 640px; margin: 0 auto; }
    .rc-sj-quiz { grid-template-columns: minmax(0, 1fr); max-width: 640px; }
    .rc-sj-door { max-width: 260px; margin: 0 auto; }
    .rc-sj-progs { grid-template-columns: minmax(0, 1fr); max-width: 640px; margin: 0 auto; }
}
@media (max-width: 719px) {
    .rc-sj { padding: 40px 0; }
    .rc-sj-wrap { padding: 0 16px; }
    .rc-sj-h2 { font-size: 26px; }
    .rc-sj-lead { font-size: var(--robbo-fs-base); }
    .rc-sj-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 32px; }
    .rc-sj-riddle-text { font-size: 18px; }
    .rc-sj-door { max-width: 200px; }
}
@media (prefers-reduced-motion: reduce) {
    .rc-sj *, .rc-sj-door-wing { animation: none !important; transition: none !important; }
}
