/* lookmyth.com — canvas.css */
@font-face{font-family:'Antonio';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/antonio-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/inter-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122;}

:root{
  --lm7-magenta:#db3c8a; --lm7-magenta-text:#b8226b; --lm7-ink:#00522d; --lm7-blush:#fce5df; --lm7-chalk:#fff8f6;
  --lm7-black:#000; --lm7-bubblegum:#f29ebd; --lm7-cotton:#e878b2; --lm7-foot-muted:#cfe3d8;
  --lm7-display:'Antonio',ui-sans-serif,system-ui,sans-serif;
  --lm7-body:'Inter',ui-sans-serif,system-ui,sans-serif;
  --lm7-gap:clamp(48px,8vw,120px);
  --lm7-fallback-metrics: -apple-system, BlinkMacSystemFont;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--lm7-chalk);color:var(--lm7-ink);font-family:var(--lm7-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--lm7-ink)}
h1,h2,h3{font-family:var(--lm7-display);font-weight:700;line-height:.92;margin:0 0 .3em;color:var(--lm7-magenta);letter-spacing:-.01em}
h1{font-size:clamp(40px,8vw,96px)}
h2{font-size:clamp(28px,5vw,52px)}
h3{font-size:clamp(20px,3vw,28px);color:var(--lm7-ink)}
p{max-width:62ch}
.lm7-wrap{max-width:1120px;margin:0 auto;padding-inline:20px}

/* header */
.lm7-head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;position:relative}
.lm7-head__mark{text-decoration:none;font-family:var(--lm7-display);font-size:22px;letter-spacing:-.01em;display:inline-flex}
.lm7-head__a{color:var(--lm7-magenta-text)}
.lm7-head__b{color:var(--lm7-ink)}
.lm7-nav{display:flex;gap:28px}
.lm7-nav__link{font-family:var(--lm7-body);font-weight:500;font-size:15px;text-decoration:none;color:var(--lm7-ink);padding:4px 0;border-bottom:2px solid transparent}
.lm7-nav__link:hover,.lm7-nav__link--active{border-bottom-color:var(--lm7-magenta)}
.lm7-burger{display:none;width:46px;height:46px;border-radius:9999px;background:var(--lm7-magenta);border:0;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer}
.lm7-burger span{width:18px;height:2px;background:#fff;display:block}
@media (max-width:820px){
  .lm7-nav{position:fixed;inset:0 0 0 30%;background:var(--lm7-chalk);flex-direction:column;padding:100px 32px;transform:translateX(100%);transition:transform .25s ease;z-index:40}
  .lm7-nav.lm7-nav--open{transform:translateX(0)}
  .lm7-nav__link{font-size:22px}
  .lm7-burger{display:inline-flex}
}

/* hero */
.lm7-hero{padding:calc(var(--lm7-gap) * .6) 24px var(--lm7-gap);text-align:center}
.lm7-hero__eyebrow{font-family:var(--lm7-body);font-weight:500;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--lm7-ink);display:block;margin-bottom:14px}
.lm7-hero__title{margin-inline:auto;max-width:14ch}
.lm7-hero__lead{margin-inline:auto;max-width:52ch;font-size:19px;color:var(--lm7-ink)}
.lm7-hero__stat{display:inline-block;margin-top:22px;padding:9px 20px;border-radius:9999px;background:var(--lm7-blush);color:var(--lm7-ink);font-weight:500;font-size:14px}
.lm7-hero__cta{margin-top:30px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* buttons */
.lm7-btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--lm7-body);font-weight:700;font-size:15px;padding:13px 26px;border-radius:10px;text-decoration:none;cursor:pointer;border:2px solid transparent;transition:transform .15s ease,background .15s ease}
.lm7-btn--primary{background:var(--lm7-magenta-text);color:#fff}
.lm7-btn--primary:hover{transform:translateY(-2px)}
.lm7-btn--ghost{background:transparent;color:var(--lm7-ink);border-color:var(--lm7-ink)}
.lm7-btn--ghost:hover{background:var(--lm7-blush)}
.lm7-btn:focus-visible{outline:3px solid var(--lm7-magenta);outline-offset:3px}

.lm7-play-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:9999px;border:2px solid var(--lm7-ink);color:var(--lm7-ink);text-decoration:none;font-weight:600;font-size:13px;transition:background .15s ease,transform .15s ease}
.lm7-play-btn:hover{background:var(--lm7-blush);transform:translateY(-1px)}
.lm7-play-btn:focus-visible{outline:3px solid var(--lm7-magenta);outline-offset:3px}
.lm7-play-btn svg{width:16px;height:16px;flex:none}
.lm7-facts__play{margin-top:18px}
.lm7-related__play{font-size:12px;padding:6px 14px;margin-left:8px}

/* Scroll-Reveal: Richtung je nach Blocktyp, respektiert prefers-reduced-motion */
.lm7-reveal{opacity:0;transform:translateY(30px);transition:opacity .65s cubic-bezier(.2,.7,.2,1),transform .65s cubic-bezier(.2,.7,.2,1)}
.lm7-reveal--left{transform:translateX(-44px)}
.lm7-reveal--right{transform:translateX(44px)}
.lm7-reveal--up{transform:translateY(46px)}
.lm7-reveal--scale{transform:scale(.9);transform-origin:center}
.lm7-reveal--in{opacity:1;transform:none}

/* Hero: Erscheinen beim Laden ("Treppe"), h1 bekommt NUR transform (LCP-Kandidat, opacity bleibt 1) */
.lm7-hero__eyebrow,.lm7-hero__lead,.lm7-hero__stat,.lm7-hero__cta{opacity:0;transform:translateY(16px);animation:lm7-hero-fade .55s cubic-bezier(.2,.7,.2,1) forwards}
.lm7-hero__eyebrow{animation-delay:.04s}
.lm7-hero__title{transform:translateY(12px);animation:lm7-hero-shift .6s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:.02s}
.lm7-hero__lead{animation-delay:.22s}
.lm7-hero__stat{animation-delay:.4s}
.lm7-hero__cta{animation-delay:.54s}
@keyframes lm7-hero-fade{to{opacity:1;transform:none}}
@keyframes lm7-hero-shift{to{transform:none}}

@media (prefers-reduced-motion: reduce){
  .lm7-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .lm7-hero__eyebrow,.lm7-hero__lead,.lm7-hero__stat,.lm7-hero__cta,.lm7-hero__title{opacity:1!important;transform:none!important;animation:none!important}
}

/* sections */
.lm7-section{padding:var(--lm7-gap) 24px}
.lm7-section--tint{background:var(--lm7-blush)}
.lm7-section__label{font-size:13px;text-transform:uppercase;letter-spacing:.08em;font-weight:500;color:var(--lm7-ink);display:block;margin-bottom:10px}

/* game catalog cards */
.lm7-catalog{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:32px}
.lm7-card{background:var(--lm7-chalk);border-radius:20px;overflow:hidden}
.lm7-card img{aspect-ratio:16/9;object-fit:cover;width:100%}
.lm7-card__body{padding:20px}
.lm7-card__genre{font-size:12px;font-weight:500;color:var(--lm7-ink);background:var(--lm7-blush);display:inline-block;padding:5px 12px;border-radius:9999px;margin-bottom:10px}
.lm7-card h3{margin-bottom:6px}
.lm7-card__verdict{font-size:14px;color:var(--lm7-ink);opacity:.85}
.lm7-card__meta{display:flex;gap:14px;font-size:13px;margin-top:12px;color:var(--lm7-ink)}
.lm7-card__link{margin-top:14px;display:inline-block;font-weight:700;color:var(--lm7-magenta-text);text-decoration:none}

/* alternating feature rows (image left/right) */
.lm7-feature{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-top:var(--lm7-gap)}
.lm7-feature:first-of-type{margin-top:32px}
.lm7-feature--rev .lm7-feature__media{order:2}
.lm7-feature__media img{border-radius:20px}
@media (max-width:760px){.lm7-feature{grid-template-columns:1fr}.lm7-feature--rev .lm7-feature__media{order:0}}

/* review page */
.lm7-review-head{padding:60px 24px 20px}
.lm7-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;background:var(--lm7-blush);border-radius:20px;padding:24px;margin:24px 0}
.lm7-facts dt{font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:500}
.lm7-facts dd{margin:2px 0 0;font-weight:700;font-family:var(--lm7-display);font-size:20px;color:var(--lm7-ink)}
.lm7-proscons{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:32px 0}
.lm7-proscons ul{padding-left:20px;margin:8px 0}
@media (max-width:700px){.lm7-proscons{grid-template-columns:1fr}}
.lm7-related{display:flex;gap:16px;flex-wrap:wrap;margin-top:20px}
.lm7-related a{padding:10px 18px;border-radius:9999px;background:var(--lm7-blush);text-decoration:none;color:var(--lm7-ink);font-weight:500;font-size:14px}

/* table (comparison + main catalog table) */
.lm7-tablewrap{overflow-x:auto;margin-top:24px}
table.lm7-table{width:100%;border-collapse:collapse;font-size:15px}
table.lm7-table caption{text-align:left;font-weight:700;margin-bottom:12px;color:var(--lm7-ink)}
table.lm7-table th,table.lm7-table td{padding:14px 16px;text-align:left}
table.lm7-table thead th{border-bottom:2px solid var(--lm7-magenta);font-family:var(--lm7-display);font-weight:700}
table.lm7-table tbody tr:nth-child(odd){background:var(--lm7-blush)}

/* FAQ accordion */
.lm7-faq{margin-top:24px}
.lm7-faq__item{border-bottom:1px solid var(--lm7-bubblegum)}
.lm7-faq__q{width:100%;text-align:left;background:none;border:0;padding:18px 0;font-family:var(--lm7-body);font-weight:700;font-size:17px;color:var(--lm7-ink);cursor:pointer;display:flex;justify-content:space-between;gap:12px}
.lm7-faq__a{max-height:0;overflow:hidden;transition:max-height .25s ease}
.lm7-faq__a p{padding-bottom:16px;margin:0}
.lm7-faq__item[data-open="true"] .lm7-faq__a{max-height:400px}

/* purchases / amazon */
.lm7-picks{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:24px}
.lm7-picks__item{background:var(--lm7-chalk);border-radius:20px;padding:20px}
.lm7-picks__item a{font-weight:700;color:var(--lm7-magenta-text);text-decoration:none}
.lm7-picks__disclaimer{margin-top:18px;font-size:13px;color:var(--lm7-ink)}

/* breadcrumbs */
.lm7-crumbs{padding:14px 24px 0;font-size:13px;color:var(--lm7-ink);opacity:.8}
.lm7-crumbs a{color:var(--lm7-ink);text-decoration:none}
.lm7-crumbs a:hover{text-decoration:underline}
.lm7-crumbs__sep{opacity:.5;margin:0 4px}

/* footer */
.lm7-foot{background:var(--lm7-ink);color:var(--lm7-chalk);padding:var(--lm7-gap) 24px 40px;margin-top:var(--lm7-gap)}
.lm7-foot a{color:var(--lm7-chalk);text-decoration:none;display:block;margin-top:8px;font-size:14px}
.lm7-foot a:hover{text-decoration:underline;color:var(--lm7-foot-muted)}
.lm7-foot__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;max-width:1120px;margin:0 auto}
.lm7-foot__brand{font-family:var(--lm7-display);font-size:24px;color:#fff;margin:0 0 8px}
.lm7-foot__desc{font-size:14px;color:var(--lm7-foot-muted);max-width:32ch}
.lm7-foot__h{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--lm7-foot-muted);margin:0 0 6px}
.lm7-foot__legal{max-width:1120px;margin:32px auto 0;font-size:12px;color:var(--lm7-foot-muted)}
@media (max-width:700px){.lm7-foot__grid{grid-template-columns:1fr 1fr}}
.lm7-totop{position:fixed;right:20px;bottom:20px;width:46px;height:46px;border-radius:9999px;background:var(--lm7-magenta-text);color:#fff;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:18px}
.lm7-totop:focus-visible{outline:3px solid var(--lm7-ink);outline-offset:3px}

/* cookie banner */
.lm7-cookie{position:fixed;left:16px;right:16px;bottom:16px;max-width:640px;margin:0 auto;background:#fff;border-radius:20px;padding:20px 24px;box-shadow:0 4px 30px rgba(0,0,0,.12);z-index:50}
.lm7-cookie p{font-size:14px;max-width:none;margin:0 0 14px}
.lm7-cookie__actions{display:flex;gap:12px;justify-content:flex-end}

.lm7-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
