/* =====================================================================
   MCA ACADEMY - PUBLIC WEBSITE ("Escola"): simple, friendly, school look
   Cream notebook paper + ruled lines, blue pencil, yellow highlighter,
   chalkboard green. Dark mode = chalkboard. Loads after store.css/aurora.css.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');

html body.st{
   --sc-bg:#fffaf0; --sc-card:#ffffff; --sc-ink:#1e2a4a; --sc-muted:#64708a; --sc-line:#ebe2cf;
   --sc-blue:#2f6bff; --sc-blue-d:#1f4fd1; --sc-yellow:#ffc93c; --sc-green:#1f7a62; --sc-pink:#ff7a90; --sc-orange:#ff9a3c; --sc-sky:#e8f0ff; --sc-rule:#cfe0ff;
   --blue:#1f4fd1; --blue2:#2f6bff; --blue3:#2f6bff; --red:#1f4fd1; --red2:#2f6bff; --gold:#ffc93c; --green:#1f7a62;
   --bg:var(--sc-bg); --card:var(--sc-card); --ink:var(--sc-ink); --muted:var(--sc-muted); --line:var(--sc-line); --radius:16px; --shadow:none;
   --au-bg:var(--sc-bg); --au-card:var(--sc-card); --au-solid:var(--sc-card); --au-ink:var(--sc-ink); --au-muted:var(--sc-muted); --au-line:var(--sc-line);
   --au-p:var(--sc-blue); --au-pg:linear-gradient(135deg,#4a82ff,#2f6bff);
   --au-font:'Nunito','Segoe UI',system-ui,sans-serif;
}
html.dark body.st{
   --sc-bg:#0f1f1a; --sc-card:#173028; --sc-ink:#f6f1e1; --sc-muted:#a9c2b7; --sc-line:#28493e; --sc-sky:#17342b; --sc-rule:#1d3b32;
   --sc-blue:#7aa5ff; --sc-blue-d:#5b8cff; --sc-yellow:#ffd45e;
   --blue:#7aa5ff; --blue2:#7aa5ff; --blue3:#7aa5ff; --red:#5b8cff; --red2:#7aa5ff;
}
html body.st{background:var(--sc-bg)!important;color:var(--sc-ink);font-family:var(--au-font);font-size:16px;line-height:1.55}
html body.st::before,html body.st::after{display:none}
.st *{font-family:inherit}
.st i[class*="fa-"]{font-family:"Font Awesome 6 Free","Font Awesome 6 Brands"}
.st h1,.st h2,.st h3,.st h4{color:var(--sc-ink);font-weight:800;letter-spacing:-.01em}

/* ---------- header ---------- */
.st-head{background:var(--sc-card)!important;color:var(--sc-ink)!important;border-bottom:2px dashed var(--sc-line)!important;box-shadow:none!important}
.st-head a,.st-head .st-link,.st-head .st-icon{color:var(--sc-ink)}
.st-bar{min-height:68px}
.st-logo{font-size:21px;font-weight:900;color:var(--sc-ink)!important;display:flex;align-items:center;gap:10px}
.st-logo span{background:var(--sc-yellow)!important;color:#1e2a4a!important;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;transform:rotate(-6deg);transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.st-logo:hover span{transform:rotate(8deg) scale(1.1)}
.st-logo em{font-style:normal;color:var(--sc-blue);font-weight:800}
.st-logo.light{color:#fff!important}.st-logo.light em{color:var(--sc-yellow)}
.st-link{font-weight:700;border-radius:10px;padding:8px 12px;transition:background .2s,color .2s}
.st-link:hover{background:var(--sc-sky);color:var(--sc-blue)}
.st-search{background:var(--sc-bg)!important;border:2px solid var(--sc-line)!important;border-radius:999px!important;transition:border-color .2s,box-shadow .2s}
.st-search:focus-within{border-color:var(--sc-blue)!important;box-shadow:0 0 0 4px rgba(47,107,255,.14)!important}
.st-search input{background:transparent!important;color:var(--sc-ink)!important;font-weight:600}
.st-icon,.st-cart{border-radius:12px;transition:background .2s,transform .3s cubic-bezier(.34,1.56,.64,1)}
.st-icon:hover,.st-cart:hover{background:var(--sc-sky);transform:translateY(-2px) rotate(-6deg)}
.st-cart b{background:var(--sc-pink)!important;color:#fff}
.st-avatar{background:var(--sc-yellow)!important;color:#1e2a4a!important;font-weight:900}
.st-sub{display:none!important}
.st-drop{background:var(--sc-card)!important;border:2px solid var(--sc-line)!important;border-radius:14px!important;box-shadow:0 14px 30px -16px rgba(30,42,74,.35)!important}
.st-drop a{color:var(--sc-ink)!important;font-weight:600;border-radius:8px}
.st-drop a:hover,.st-drop a.on{background:var(--sc-sky)!important;color:var(--sc-blue)!important}
.st-mobile{background:var(--sc-card)!important}.st-mobile a{color:var(--sc-ink)!important;font-weight:700}

/* chunky, tactile buttons */
.st-btn{border-radius:12px!important;font-weight:800;border:2px solid var(--sc-line);background:var(--sc-card);color:var(--sc-ink)!important;position:relative;overflow:hidden;
   transition:transform .15s,box-shadow .15s,background .2s!important;box-shadow:0 3px 0 var(--sc-line)}
.st-btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 var(--sc-line)}
.st-btn:active{transform:translateY(2px)!important;box-shadow:0 1px 0 var(--sc-line)!important}
.st-btn.solid{background:var(--sc-blue)!important;border-color:var(--sc-blue-d)!important;color:#fff!important;box-shadow:0 4px 0 var(--sc-blue-d)}
.st-btn.solid:hover{filter:none;background:#3d78ff!important;box-shadow:0 6px 0 var(--sc-blue-d)}
.st-btn.solid:active{box-shadow:0 1px 0 var(--sc-blue-d)!important}
.st-btn.ghost{background:transparent}
.st-btn.big{padding:14px 26px;font-size:17px}

/* ---------- hero: notebook paper ---------- */
.hero{background:
   linear-gradient(90deg,transparent 0 58px,rgba(255,122,144,.55) 58px 60px,transparent 60px),
   repeating-linear-gradient(transparent 0 35px,var(--sc-rule) 35px 36px),var(--sc-card)!important;
   color:var(--sc-ink);border-bottom:2px dashed var(--sc-line);position:relative;overflow:hidden}
.hero::after{display:none}
.hero-in{padding-top:56px;padding-bottom:56px;align-items:center;gap:32px}
.hero-text{position:relative;z-index:1}
.hero-text h1{color:var(--sc-ink)!important;font-size:clamp(30px,5vw,50px);line-height:1.1;font-weight:900;margin-bottom:14px;
   background:linear-gradient(transparent 66%,rgba(255,201,60,.65) 66% 92%,transparent 92%);display:inline;padding:0 4px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hero-text p{color:var(--sc-muted)!important;font-size:18px;font-weight:600;margin-top:18px;max-width:520px}
.hero-search{background:var(--sc-card);border:2px solid var(--sc-ink);border-radius:999px;box-shadow:0 5px 0 var(--sc-ink);overflow:hidden;max-width:520px;transition:transform .2s,box-shadow .2s}
.hero-search:focus-within{transform:translateY(2px);box-shadow:0 3px 0 var(--sc-ink)}
.hero-search input{background:transparent!important;color:var(--sc-ink)!important;font-weight:700;font-size:16px}
.hero-search button{background:var(--sc-yellow)!important;color:#1e2a4a!important;border-radius:999px;margin:4px;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.hero-search button:hover{transform:scale(1.1) rotate(-8deg)}
.hero-art{position:relative;min-height:290px;display:grid;place-items:center}
.hero-art .orb{display:none}
.sc-illus{width:min(100%,360px);height:auto;animation:scFloat 5s ease-in-out infinite;filter:drop-shadow(0 12px 0 rgba(30,42,74,.08))}
@keyframes scFloat{50%{transform:translateY(-10px) rotate(1deg)}}
.sc-illus .pencil{transform-box:fill-box;transform-origin:50% 100%;animation:scWiggle 3.2s ease-in-out infinite}
@keyframes scWiggle{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg)}}
.hero-card{position:absolute;background:#fff7c9;color:#1e2a4a;border:2px solid #1e2a4a;border-radius:6px 6px 14px 6px;padding:10px 16px;box-shadow:0 4px 0 #1e2a4a;display:flex;flex-direction:column;align-items:flex-start;transform:rotate(-5deg);
   animation:scBob 4.5s ease-in-out infinite;top:6%;left:0;right:auto;bottom:auto}
.hero-card.two{background:#d8e6ff;transform:rotate(4deg);top:auto;bottom:6%;left:auto;right:0;animation-delay:-2s}
.hero-card i{color:var(--sc-blue)}.hero-card b{font-size:26px;font-weight:900;color:#1e2a4a}.hero-card span{font-size:12.5px;font-weight:700;color:#4a557a}
@keyframes scBob{50%{transform:translateY(-8px) rotate(var(--r,-5deg))}}

/* ---------- sections ---------- */
.trust{margin-top:34px}
.trust>div{background:var(--sc-card)!important;border:2px solid var(--sc-line)!important;border-radius:18px!important;box-shadow:0 4px 0 var(--sc-line)!important;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.trust>div:hover{transform:translateY(-4px) rotate(-.6deg)}
.trust i{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:20px;background:var(--sc-sky);color:var(--sc-blue)}
.trust>div:nth-child(2) i{background:#fff3cf;color:#d99a00}.trust>div:nth-child(3) i{background:#ddf5ec;color:var(--sc-green)}
html.dark .trust>div:nth-child(2) i{background:#3b3714}html.dark .trust>div:nth-child(3) i{background:#1d4437}
.trust b{color:var(--sc-ink)}.trust span{color:var(--sc-muted)}
.block-head h2{font-size:26px;font-weight:900;position:relative;display:inline-block}
.block-head h2::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:8px;border-radius:6px;background:rgba(255,201,60,.6);z-index:-1}
.block-head a{color:var(--sc-blue);font-weight:800}

.ccard{background:var(--sc-card)!important;border:2px solid var(--sc-line)!important;border-radius:18px!important;box-shadow:0 4px 0 var(--sc-line)!important;overflow:hidden;
   transition:transform .3s cubic-bezier(.34,1.56,.64,1),border-color .2s,box-shadow .2s}
.ccard:hover{transform:translateY(-6px) rotate(-.5deg);border-color:var(--sc-blue)!important;box-shadow:0 8px 0 rgba(47,107,255,.25)!important}
.ccard:nth-child(even):hover{transform:translateY(-6px) rotate(.5deg)}
.ccard-img{border-bottom:2px dashed var(--sc-line)}
.ccard-body h3{font-size:16.5px;font-weight:800;color:var(--sc-ink)}
.ccard-body .by,.ccard-body .meta{color:var(--sc-muted);font-weight:600}
.ccard-body .price{font-weight:900;font-size:18px;color:var(--sc-blue)}
.ccard-body .price .owned{color:var(--sc-green)}
.tag{background:var(--sc-yellow)!important;color:#1e2a4a!important;border-radius:8px!important;font-weight:900;transform:rotate(-3deg)}
.tag.best{background:var(--sc-pink)!important;color:#fff!important}
.rate b{color:#d99a00}

.cat-tiles a{background:var(--sc-card)!important;border:2px solid var(--sc-line)!important;border-radius:18px!important;box-shadow:0 4px 0 var(--sc-line)!important;font-weight:800;color:var(--sc-ink);transition:transform .3s cubic-bezier(.34,1.56,.64,1),border-color .2s}
.cat-tiles a:hover{transform:translateY(-5px) rotate(-1deg);border-color:var(--sc-blue)!important}
.cat-tiles a i{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:22px;margin:0 auto 8px;background:var(--sc-sky);color:var(--sc-blue);transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.cat-tiles a:hover i{transform:rotate(-10deg) scale(1.12)}
.cat-tiles a:nth-child(4n+2) i{background:#fff3cf;color:#d99a00}.cat-tiles a:nth-child(4n+3) i{background:#ffe3e8;color:#e0486a}.cat-tiles a:nth-child(4n+4) i{background:#ddf5ec;color:var(--sc-green)}
.cat-tiles small{color:var(--sc-muted);font-weight:600}

/* chalkboard call-to-action */
.teach-cta{background:#17483c!important;color:#f6f1e1;border-radius:26px;margin:40px auto;max-width:1190px;border:6px solid #b98a52;outline:2px dashed rgba(255,255,255,.28);outline-offset:-16px;position:relative;overflow:hidden}
.teach-cta h2{color:#fff;font-weight:900}.teach-cta p{color:#cfe3da}
.teach-cta .st-btn.solid{background:var(--sc-yellow)!important;color:#1e2a4a!important;border-color:#d9a400!important;box-shadow:0 4px 0 #d9a400}
.teach-cta::after{content:"A² + B² = C²";position:absolute;right:30px;bottom:10px;font:800 22px 'Nunito',sans-serif;color:rgba(255,255,255,.14);transform:rotate(-6deg);pointer-events:none}

.st-foot{background:#17483c!important;color:#cfe3da!important;border-top:0!important;border-radius:0!important;margin-top:20px}
.st-foot a,.st-foot p{color:#cfe3da}.st-foot a:hover{color:var(--sc-yellow)}.st-foot h4{color:#fff}
.st-copy{border-top:2px dashed rgba(255,255,255,.2)!important;color:#a9c8bb!important}

/* ---------- inner pages ---------- */
.cd-hero{background:linear-gradient(90deg,transparent 0 40px,rgba(255,122,144,.4) 40px 42px,transparent 42px),repeating-linear-gradient(transparent 0 35px,var(--sc-rule) 35px 36px),var(--sc-card)!important;color:var(--sc-ink)!important;border-bottom:2px dashed var(--sc-line)}
.cd-hero h1,.cd-hero .cd-sub,.cd-hero .cd-meta,.cd-hero .cd-by,.crumbs,.crumbs a{color:var(--sc-ink)!important}
.cd-hero .cd-sub{color:var(--sc-muted)!important}
.box,.buy-card,.cart-side,.cart-row,.order-row,.pay-opt,.filters details,.learn-card,.rev-form{background:var(--sc-card)!important;border:2px solid var(--sc-line)!important;border-radius:16px!important;box-shadow:none!important;color:var(--sc-ink)}
.buy-card{box-shadow:0 5px 0 var(--sc-line)!important}
.buy-price{color:var(--sc-blue);font-weight:900}
.filters a.on,.tabs-bar a.on{color:var(--sc-blue)!important;font-weight:800}
.sortbar select,.st input,.st select,.st textarea{background:var(--sc-card)!important;color:var(--sc-ink)!important;border:2px solid var(--sc-line)!important;border-radius:12px!important;font-weight:600}
.st input:focus,.st select:focus,.st textarea:focus{border-color:var(--sc-blue)!important;box-shadow:0 0 0 4px rgba(47,107,255,.14)!important;outline:0}
.list-title,.cart-page h1,.checkout-page h1,.learn-page h1{font-weight:900}
.auth-page{background:repeating-linear-gradient(transparent 0 35px,var(--sc-rule) 35px 36px)}
.auth-card{background:var(--sc-card)!important;border:2px solid var(--sc-ink)!important;border-radius:20px!important;box-shadow:0 8px 0 var(--sc-ink)!important;animation:scCard .7s cubic-bezier(.34,1.56,.64,1) both}
@keyframes scCard{from{opacity:0;transform:translateY(30px) rotate(-2deg)}to{opacity:1;transform:none}}
.auth-card h1{font-weight:900}.auth-switch a{color:var(--sc-blue);font-weight:800}
.err-msg{background:#ffe3e8;color:#b3203f;border-radius:10px;font-weight:700}
.pbar i,.pct{background:var(--sc-green)!important}
.badge.paid,.badge.active,.badge.approved{background:#ddf5ec;color:var(--sc-green)}
#st-progress span{background:var(--sc-yellow)!important}
.reveal{transition:opacity .6s,transform .7s cubic-bezier(.34,1.56,.64,1)}
.au-fab{background:var(--sc-yellow)!important;color:#1e2a4a!important;box-shadow:0 4px 0 #d9a400!important}

/* ---------- responsive ---------- */
@media (max-width:900px){
   .hero{background:repeating-linear-gradient(transparent 0 35px,var(--sc-rule) 35px 36px),var(--sc-card)!important}
   .hero-in{grid-template-columns:1fr!important;padding-top:34px;padding-bottom:34px}
   .hero-art{min-height:230px;order:2}
   .teach-cta{margin:28px 14px;border-width:4px}
}
@media (max-width:600px){
   .st-wrap{padding:0 14px}
   .hero-text p{font-size:16px}
   .hero-card{transform:scale(.85) rotate(-5deg)}.hero-card.two{transform:scale(.85) rotate(4deg)}
   .block-head h2{font-size:22px}
   .teach-cta .st-wrap{flex-direction:column;align-items:flex-start;gap:14px}
}
@media (prefers-reduced-motion:reduce){.sc-illus,.sc-illus .pencil,.hero-card{animation:none}}

/* tablet: keep the header inside the screen (720-1000px) */
@media (max-width:1000px){
   .st-bar{gap:10px;flex-wrap:nowrap}
   .st-bar .st-search{flex:1;min-width:0;max-width:none}
   .st-hide-m{display:none!important}
   .st-cats-wrap{display:none}
   .st-burger{display:block}
   .st-bar>*{min-width:0}
   .st-wrap{padding:0 16px}
}
@media (max-width:600px){.hero-art{display:none!important}.hero-in{padding-top:26px;padding-bottom:30px}}
@media (min-width:601px) and (max-width:919px){.hero-art{display:grid}}
