:root{--cream:#fff9ec;--paper:#fffdf7;--wine:#64182d;--wine2:#8c2942;--gold:#e0b84e;--ink:#2b2020;--muted:#6d5b55}*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:Inter,Segoe UI,sans-serif;color:var(--cream);background:#20181a;position:relative;isolation:isolate}body:before{content:"";position:fixed;inset:-6px;z-index:-2;background:url("klassenspiele.webp") center/cover no-repeat;filter:blur(2px) brightness(.72) saturate(.92);transform:scale(1.012)}body:after{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,12,13,.25),rgba(20,15,16,.38) 55%,rgba(15,12,13,.48));pointer-events:none}button,select{font:inherit}.topbar{width:min(1240px,calc(100% - 30px));margin:auto;padding:20px 0;
    display:flex;justify-content:space-between;align-items:center;gap:20px}.brand,.back{color:white;text-decoration:none;font-weight:900}.brand{font-size:clamp(19px,2vw,26px)}.brand span,.eyebrow{color:var(--gold)}.top-actions{display:flex;align-items:end;gap:12px}.top-actions label{display:grid;gap:4px;font-size:12px;font-weight:800}.top-actions select,.back{border:1px solid #f0d47b;border-radius:12px;background:rgba(24,18,19,.78);color:white;padding:10px 13px}.back{min-height:42px}main{width:min(1180px,calc(100% - 30px));margin:auto;padding-bottom:80px}.hero{text-align:center;padding:clamp(40px,7vw,86px) 10px 34px;text-shadow:0 2px 18px #000}.eyebrow{letter-spacing:.2em;font-weight:950;font-size:13px}.hero h1{font:900 clamp(44px,8vw,86px)/1 Georgia,serif;margin:12px}.hero>p:last-child{font-size:clamp(17px,2vw,22px);max-width:760px;margin:20px auto;color:#fff7e8}.featured{display:grid;grid-template-columns:minmax(300px,42%) 1fr;border:1px solid rgba(243,213,123,.78);border-radius:32px;overflow:hidden;background:rgba(255,253,247,.96);color:var(--ink);box-shadow:0 24px 70px #0009;backdrop-filter:blur(8px)}.featured-image{min-height:460px;background:#eadbbd}.featured-image img{width:100%;height:100%;object-fit:cover}.featured-copy{padding:clamp(25px,5vw,58px);display:flex;flex-direction:column;align-items:flex-start}.featured-kicker{width:100%;display:flex;justify-content:space-between;align-items:center;color:var(--wine2);font-weight:900;text-transform:uppercase;letter-spacing:.1em}.featured-copy h2{font:900 clamp(38px,5vw,64px)/1.05 Georgia,serif;color:var(--wine);margin:16px 0}.featured-copy>p{font-size:17px;line-height:1.65;margin:6px 0}.featured-copy #featuredLead{font-size:20px;font-weight:800}.uses{display:grid;gap:7px;padding-left:20px;color:var(--muted);line-height:1.45}.primary{margin-top:auto;border:0;border-radius:15px;background:linear-gradient(135deg,#69182f,#9e3650);color:white;padding:15px 24px;font-weight:900;cursor:pointer;box-shadow:0 8px 22px #60132944}.star{border:1px solid #d5ad45;background:#fff7dd;color:#9a6e00;border-radius:50%;width:44px;height:44px;font-size:28px;line-height:1;cursor:pointer}.star.active{background:var(--gold);color:#4b2900}.collection{margin-top:55px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:22px;text-shadow:0 2px 12px #000}.section-heading h2{font:900 clamp(31px,5vw,48px) Georgia,serif;margin:5px 0}.section-heading>p{max-width:470px;line-height:1.5}.games-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.game-card{background:rgba(255,253,247,.96);color:var(--ink);border-radius:22px;overflow:hidden;border:1px solid #f1d77e;box-shadow:0 15px 35px #0007;display:flex;flex-direction:column;transition:.25s}.game-card:hover{transform:translateY(-5px)}.card-image{height:170px;position:relative;background:#eadbbd}.card-image img{width:100%;height:100%;object-fit:cover}.card-image .star{position:absolute;right:11px;top:11px}.card-body{padding:18px;display:flex;flex-direction:column;flex:1}.category{color:var(--wine2);font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.1em}.game-card h3{font:900 25px Georgia,serif;color:var(--wine);margin:8px 0}.game-card p{color:var(--muted);line-height:1.5;flex:1}.card-button{width:100%;border:1px solid #b88822;border-radius:12px;background:#fff4d3;color:var(--wine);padding:11px;font-weight:900;cursor:pointer}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,130%);background:#2a171b;color:white;border:1px solid var(--gold);padding:13px 20px;border-radius:999px;transition:.3s;z-index:20}.toast.show{transform:translate(-50%,0)}@media(max-width:980px){.games-grid{grid-template-columns:repeat(2,1fr)}.featured{grid-template-columns:1fr}.featured-image{min-height:290px;max-height:380px}}@media(max-width:600px){main,.topbar{width:min(100% - 16px,1180px)}.hero{padding-top:30px}.games-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start;flex-direction:column;gap:5px}.top-actions label span{display:none}.back{font-size:0}.back:after{content:"✕";font-size:18px}.featured-copy{padding:23px}.featured-copy h2{font-size:38px}.featured-image{min-height:220px}.star{width:42px;height:42px}}
.featured-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:auto}
.featured-actions .primary{margin-top:0}
.demo-primary{border:1px solid #8eb9df;border-radius:15px;background:linear-gradient(135deg,#eaf5ff,#d7ebfb);color:#174873;padding:15px 24px;font-weight:900;cursor:pointer;box-shadow:0 8px 22px #17487328}
.demo-primary[hidden]{display:none}
@media(max-width:560px){.featured-actions{width:100%;display:grid}.featured-actions button{width:100%}}