/* ThemeParkBooqi, 12 okt 2026 (Nout: "te somber, te digitaal: bruin, felle kleuren, zwart op donker,
   html-achtige blokken"). Vrolijk: wit en lucht in plaats van steen, geen zwarte vlakken, geen scankader.
   Hoort bij card.stijl = "vrolijk" in config/themepark.json (het drukwerk). */

/* Geen beige meer (13 okt, Nout: "het beige bevalt me ook niet meer"): wit en het zachte lila van de animatie
   (het parkverhaal, assets/css/parkscroll.css), in plaats van crème #faf8f3 en steen #f3efe7 */
body.market-themepark .hbstory{--papier:#F4F1FB;--wit:#FFFFFF;--rand:#E4DEF3;background:#FFFFFF}
body.market-themepark .hbstory .topnav{background:rgba(255,255,255,.94) !important}
body.market-themepark .hbstory section#pijler-1,
body.market-themepark .hbstory section#opbrengst,
body.market-themepark .hbstory section#fits,
body.market-themepark .hbstory section#faq{background:#F4F1FB !important}

/* De hero: een zonnige foto, dus een lichte waas links en donkere tekst in plaats van een bruine waas */
body.market-themepark .hbstory .h3kader{background:#e9f4ff}
body.market-themepark .hbstory .h3kader .h3beeld::before{
  background:linear-gradient(90deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.66) 34%,rgba(255,255,255,.12) 60%,rgba(255,255,255,0) 72%) !important}
body.market-themepark .hbstory .h3tekst,
body.market-themepark .hbstory .h3tekst h1,
body.market-themepark .hbstory .h3tekst .h3pk,
body.market-themepark .hbstory .h3tekst .h3bewijs{color:#1d1a17 !important;text-shadow:none !important}
body.market-themepark .hbstory .h3tekst .h3sub{color:rgba(29,26,23,.82) !important;text-shadow:none !important}
body.market-themepark .hbstory .h3knoppen .btn.o{color:#1d1a17 !important;background:rgba(255,255,255,.72) !important;
  border-color:rgba(29,26,23,.28) !important}

/* De vouwkaart in HTML: het paarse en het zwarte vak worden wit en koraal, zoals het drukwerk */
body.market-themepark .hbstory .bqface.c-gold{background:#fff !important;border-left:1px solid #e6e3dc}
body.market-themepark .hbstory .bqface.c-gold .bqeb{color:#6C4BF4 !important}
body.market-themepark .hbstory .bqface.c-gold .bqti,
body.market-themepark .hbstory .bqface.c-gold .bqmini i b{color:#1d1a17 !important}
body.market-themepark .hbstory .bqface.c-gold .bqmini i{color:#5c5850 !important}
body.market-themepark .hbstory .bqface.qr.c-dark{background:#FF8C7A !important}
body.market-themepark .hbstory .bqface.qr.c-dark .bqqc{color:#1d1a17 !important}

/* Geen scankader: de paarse hoekjes in de telefoon en het richtkruis bij de muis lazen als software */
body.market-themepark #pgcam .br,
body.market-themepark #scancur{display:none !important}

/* 13 okt: het dagverhaal is weg (het parkverhaal bovenaan vertelt de dag nu), dus ook de links "See it in the day" */
body.market-themepark .hbstory .hnaar{display:none !important}

/* De hero zonder handen (13 okt 2026, Nout: "themepark heeft nog niet de nieuwe hero"): zoals hotel en museum de productmockup met de
   covers en de telefoon met BooqiConnect (cta-set), heel in beeld naast de kop en gecentreerd op mobiel. Iets specifieker dan de
   gedeelde handenregels in v3.css en echt.css, zodat deze regels winnen zonder die bestanden te raken. */
@media (min-width:821px){
  html body.market-themepark .hbstory .h3kader .h3hand{left:auto !important;right:calc(var(--links) - 40px) !important;bottom:7% !important;
    top:auto !important;height:84% !important;width:calc(100vw - 2 * var(--links) - 23.5vw - 280px) !important;max-width:none !important;
    transform:none !important;object-fit:contain !important;object-position:center center !important;filter:drop-shadow(0 24px 40px rgba(40,30,90,.18)) !important}
}
@media (max-width:820px){
  html body.market-themepark .hbstory .h3kader .h3beeld{height:clamp(240px,70vw,360px) !important}
  html body.market-themepark .hbstory .h3kader .h3hand{left:50% !important;right:auto !important;transform:translateX(-50%) !important;height:92% !important;
    width:auto !important;max-width:94% !important;bottom:4% !important;top:auto !important;object-fit:contain !important;object-position:center bottom !important;filter:none !important}
}

/* Hero overal hetzelfde (13 okt 2026, Nout: "zonder kader alleen die losse mockup", "alles hetzelfde doen altijd"): de uitgevouwen
   Booqi met de covers en de telefoon, als losse mockup. Desktop naast de kop; mobiel zonder fotokader, gecentreerd en heel. */
@media (min-width:821px){
  html body.market-themepark .hbstory .h3kader .h3hand{left:auto !important;right:calc(var(--links) - 40px) !important;bottom:7% !important;top:auto !important;
    height:84% !important;width:calc(100vw - 2 * var(--links) - 23.5vw - 280px) !important;max-width:none !important;transform:none !important;
    object-fit:contain !important;object-position:center center !important;filter:none !important}
}
@media (max-width:820px){
  html body.market-themepark .hbstory .h3kader .h3beeld{background:none !important;border-radius:0 !important;box-shadow:none !important;
    height:clamp(260px,78vw,440px) !important;overflow:visible !important;animation:none !important}
  html body.market-themepark .hbstory .h3kader .h3beeld::before,html body.market-themepark .hbstory .h3kader .h3beeld::after{display:none !important}
  html body.market-themepark .hbstory .h3kader .h3hand{left:50% !important;right:auto !important;top:auto !important;bottom:0 !important;transform:translateX(-50%) !important;
    height:100% !important;width:auto !important;max-width:100% !important;object-fit:contain !important;object-position:center bottom !important;filter:none !important}
}