/* Must Know Money 4b "Bold Playful" theme, layered over site.css */
/* 4 Bold Playful: chunky 2D, thick borders, big shadows */
:root{--df:"Lilita One";--tf:"Lexend";--ink:#111}
body{background:#fffdf3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ccircle cx='2' cy='2' r='1.4' fill='%23e8e0c4'/%3E%3C/svg%3E")}
h1,h2,h3{font-weight:400!important;letter-spacing:.01em}
.hero h1{font-size:64px;line-height:1;text-shadow:3px 3px 0 #FFC93C}
.hdr{border-bottom:4px solid #111}
.logo{font-family:"Lilita One";font-weight:400;font-size:26px}
.lang>.t,.burger{border:3px solid #111;box-shadow:3px 3px 0 #111}
.hero-band{background:#8fd3ff;border-bottom:4px solid #111;background-image:repeating-linear-gradient(-45deg,rgba(255,255,255,.18) 0 14px,transparent 14px 28px)}
.btn{border:3px solid #111;border-radius:14px;box-shadow:6px 6px 0 #111;font-family:"Lexend";font-weight:800;transition:transform .1s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 #111}
.btn.y{background:#ffd23f}.btn.g{background:#fff}
.card{border:3px solid #111!important;box-shadow:8px 8px 0 #111!important;border-radius:22px}
.hnews{border:3px solid #111!important;box-shadow:10px 10px 0 #C8102E!important;transform:rotate(-.6deg)}
.hnews .btn{box-shadow:4px 4px 0 #111!important}
.exp .card:nth-child(1){background:#ffe27a}.exp .card:nth-child(2){background:#b8f0c2}.exp .card:nth-child(3){background:#ffc2cf}
.num{border:3px solid #111;width:40px;height:40px;font-family:"Lilita One";font-weight:400}
.nf input[type=email]{border:3px solid #111}
.crew img{filter:none}
.streak{border:3px solid #111;box-shadow:3px 3px 0 #111}
.tag{background:#111;color:#ffd23f;padding:3px 10px;border-radius:8px}
@media (max-width:900px){.lh-box{border:0!important;box-shadow:none!important;background:none!important;border-radius:0}}
@media (max-width:760px){.hero h1{font-size:38px!important;line-height:1.08}.hnews{transform:none!important}.hero{padding-top:24px}}

/* 4b: lower section redesign */
[data-page=home] main>.wrap{padding-top:80px}
main{padding-bottom:112px}
.exp-h{margin:0 0 28px;font-size:36px;text-align:center}
.exp-h:after{content:"";display:block;width:84px;height:8px;margin:12px auto 0;background:#ffd23f;border:3px solid #111;border-radius:999px}
.exp{gap:28px}
.exp .card{background:linear-gradient(#8fd3ff 0 14px,#111 14px 17px,#fff8e7 17px)!important;padding:40px 24px 26px;border-radius:22px;min-height:150px}
.exp .card:nth-child(2){background:linear-gradient(#ffd23f 0 14px,#111 14px 17px,#fff8e7 17px)!important}
.exp .num{background:#1E5BB8;color:#fff}
.exp .card:nth-child(2) .num{background:#ffd23f;color:#111}
.exp h3{font-size:21px;margin-bottom:6px}
.exp p{color:#2b2f36}
.foot{position:relative;background:#14264a;padding:56px 0 40px;margin-top:0}
.foot:before{content:"";position:absolute;left:0;right:0;top:-23px;height:24px;background:#14264a;
 -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24'%3E%3Cpath d='M0 24 Q12 0 24 12 T48 12 V24Z'/%3E%3C/svg%3E") repeat-x bottom/48px 24px;
 mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24'%3E%3Cpath d='M0 24 Q12 0 24 12 T48 12 V24Z'/%3E%3C/svg%3E") repeat-x bottom/48px 24px}
.foot p{line-height:1.9;font-size:16px;color:#e6edf8}
.foot p:first-child{margin-bottom:8px}
.foot b{font-family:"Lilita One";font-weight:400;font-size:20px;color:#ffd23f;letter-spacing:.02em}
.foot a{color:#fff;text-decoration-color:#8fd3ff;text-underline-offset:4px;text-decoration-thickness:2px}
.foot a:hover{color:#ffd23f}
@media (max-width:760px){[data-page=home] main>.wrap{padding-top:52px}main{padding-bottom:72px}.exp-h{font-size:30px}.exp{gap:22px}.exp .card{min-height:0}.foot{padding:44px 0 32px}.foot .wrap{padding:0 20px}}

.foot .wrap{max-width:1200px}
@media (max-width:760px){.exp .card{padding:34px 18px 20px}}
@media (max-width:760px){.exp .card{align-items:center;padding:30px 18px 18px}.exp h3{margin:0}.foot{padding-bottom:44px}}
.exp .card{transition:transform .15s}.exp .card:hover{transform:translate(-2px,-2px)}
/* hero scene */
.crew{position:relative;width:520px;height:470px;align-items:flex-end;justify-content:center;gap:0}
.crew .stand{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;z-index:0}
.crew img{position:relative;z-index:1;height:330px!important;filter:none;transform-origin:50% 100%;animation:bob 2.4s ease-in-out infinite}
.crew img+img{animation-delay:-1.2s;margin-left:-6px}
.crew img:first-of-type{margin-right:40px}
.stand .spark{transform-origin:125px 155px;animation:tw 1.6s ease-in-out infinite}
.stand .s2{animation:tw 1.6s ease-in-out -.8s infinite;transform-box:fill-box;transform-origin:center}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(-1.5deg)}}
@keyframes swing{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@keyframes tw{0%,100%{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1.1)}}
@media (prefers-reduced-motion:reduce){.crew img,.stand .spark,.stand .s2{animation:none}}
@media (max-width:760px){.hero{grid-template-columns:1fr!important}.crew{order:-1;width:100%;max-width:360px;height:320px;margin:0 auto}.crew img{height:215px!important}.crew img:first-of-type{margin-right:24px}}

/* sitewide 4b extras */
.pg{padding-top:40px}
.tabs a,.tabs .soon-tab,.terms a{border-width:3px;box-shadow:4px 4px 0 #111}
.tabs a.on{background:#1E5BB8}
.pbar{border-width:3px}
.band{border:3px solid #111;box-shadow:6px 6px 0 #111;background:#fff8e7}
.st.here{background:#ffd23f}
.sub{border-width:3px;box-shadow:6px 6px 0 #111}
.foot .nf input[type=email]{border:3px solid #111}
.fnl b{font-family:"Lexend";color:#fff}
.foot .wrap{gap:28px}
h1{text-shadow:none}
@media (max-width:760px){.wextra{grid-template-columns:1fr!important}.share-row .btn{flex:1 1 auto}}
@media (min-width:901px){.lhint{width:236px}}
@media (max-width:760px){.upnext{flex-direction:column!important;align-items:flex-start!important;gap:10px}.upnext p{flex:none}}
/* brand name in hero headline */
.hero h1 .bn{white-space:nowrap}
.hero h1 .bk,.hero h1 .bm{-webkit-text-stroke:5px #111;paint-order:stroke fill;text-shadow:4px 4px 0 #FFC93C}
.hero h1 .bk{color:#1E5BB8}.hero h1 .bm{color:#C8102E}
@media (max-width:760px){.hero h1 .bn{white-space:normal}.hero h1 .bk,.hero h1 .bm{-webkit-text-stroke:4px #111;text-shadow:3px 3px 0 #FFC93C}}

@media (max-width:900px){.lhint{background:#FFC93C!important;border-bottom:3px solid #111}.lhint .lh-box{background:none!important}}

.crew img:first-of-type{margin-right:70px}
/* stand v2 layout: stand raised behind, characters in front over their color halves */
.crew{height:470px}
.crew .stand{bottom:86px}
.crew img{position:absolute!important;bottom:0;height:300px!important;margin:0!important;width:auto}
.crew img:first-of-type{left:calc(29% - 66px)}
.crew img+img{left:calc(71% - 50px)}
@media (max-width:760px){.crew{height:330px}.crew .stand{bottom:58px}.crew img{height:206px!important}.crew img:first-of-type{left:calc(29% - 45px)}.crew img+img{left:calc(71% - 34px)}}
.crew img{height:250px!important}.crew img:first-of-type{left:calc(29% - 55px)}.crew img+img{left:calc(71% - 42px)}.crew{height:440px}
@media (max-width:760px){.crew{height:310px}.crew img{height:172px!important}.crew img:first-of-type{left:calc(29% - 38px)}.crew img+img{left:calc(71% - 29px)}}

/* headline colors (option 4): flat */
.hero h1{color:#0B1F44!important;text-shadow:none!important}
.hero h1 .bk,.hero h1 .bm{-webkit-text-stroke:0!important;text-shadow:none!important;white-space:nowrap}
.hero h1 .bk{color:#1A3A8F!important}.hero h1 .bm{color:#A50E26!important}
/* language hint option D: glowing button + tooltip with notch */
@keyframes lhglow{0%,100%{box-shadow:0 0 0 3px #FFC93C,0 0 12px 3px rgba(255,201,60,.7)}50%{box-shadow:0 0 0 5px #FFC93C,0 0 22px 7px rgba(255,201,60,.9)}}
html.lh-on .lang>.t{animation:lhglow 1.8s ease-in-out infinite;background:#FFF6D6}
.lhint{--nx:180px;--mx:340px}
.lh-box{position:relative}
@media (min-width:901px){.lhint{width:250px}
.lh-box:before,.lh-box:after{content:"";position:absolute;left:calc(var(--nx) - 11px);top:-13px;border:11px solid transparent;border-top:0;border-bottom:13px solid #111}
.lh-box:after{left:calc(var(--nx) - 8px);top:-8px;border-width:0 8px 10px;border-bottom-color:#FFC93C}}
@media (max-width:900px){html.lh-on .burger{animation:lhglow 1.8s ease-in-out infinite;background:#FFF6D6}
.lhint{position:relative!important;z-index:31}
.lhint:after{content:"";position:absolute;top:-12px;left:calc(var(--mx) - 10px);border:10px solid transparent;border-top:0;border-bottom:12px solid #FFC93C;filter:drop-shadow(0 -3px 0 #111)}}
@media (prefers-reduced-motion:reduce){html.lh-on .lang>.t,html.lh-on .burger{animation:none;box-shadow:0 0 0 4px #FFC93C}}

/* i18n: longer translated labels */
.upnext p{flex:1 1 260px;min-width:0}
.terms .tm,.word h1,.upnext h3{overflow-wrap:break-word;hyphens:auto}
