
:root {
  --blue: #2676ff;
  --blue-dark: #1454d8;
  --blue-soft: #e9f2ff;
  --purple: #7c4dff;
  --purple-dark: #5828cc;
  --purple-soft: #f0ebff;
  --yellow: #ffc928;
  --yellow-dark: #d89b00;
  --yellow-soft: #fff6cf;
  --green: #36c96f;
  --green-dark: #169a4b;
  --green-soft: #e5f9ed;
  --coral: #ff6577;
  --coral-dark: #df3d52;
  --coral-soft: #ffeaed;
  --cyan: #28c6d7;
  --cyan-dark: #1193a3;
  --cyan-soft: #e2f9fb;
  --orange: #ff9347;
  --orange-soft: #fff0e5;
  --ink: #24243b;
  --text: #616178;
  --line: #e7e9f4;
  --surface: #ffffff;
  --background: #f8f9ff;
  --shadow: 0 24px 70px rgba(52, 70, 137, 0.13);
  --radius: 26px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 94px; }
body { margin: 0; color: var(--ink); background: var(--surface); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.65; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; display: block; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: "Arial Rounded MT Bold", "Trebuchet MS", ui-rounded, system-ui, sans-serif; line-height: 1.08; letter-spacing: -0.035em; }
h1 { max-width: 680px; margin-bottom: 24px; font-size: clamp(2.65rem, 4.7vw, 3.85rem); }
h2 { margin-bottom: 20px; font-size: clamp(2rem, 3.3vw, 2.9rem); }
h3 { font-size: 1.16rem; letter-spacing: -0.02em; }
p { color: var(--text); }
.fi { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }

.section-shell { width: min(1220px, calc(100% - 48px)); margin-inline: auto; }
.section { padding-block: 106px; }

.site-header { position: sticky; top: 0; z-index: 50; min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 9px max(28px, calc((100vw - 1220px) / 2)); border-bottom: 1px solid rgba(225,230,246,.72); background: rgba(255,255,255,.82); box-shadow: 0 10px 35px rgba(47,62,116,.035); backdrop-filter: blur(18px); transition: min-height .28s ease,background .28s ease,box-shadow .28s ease,border-color .28s ease; }
.site-header.is-scrolled { min-height: 70px; border-color:rgba(215,222,244,.96); background:rgba(255,255,255,.96); box-shadow:0 13px 38px rgba(43,59,118,.11); }
.brand { width: 134px; flex: 0 0 auto; }
.brand img { width: 100%; height: auto; transition:transform .25s ease; }
.brand:hover img { transform:scale(1.035) rotate(-1deg); }
.site-header nav { display: flex; align-items: center; gap: 25px; color: #53536b; font-size: .9rem; font-weight: 750; }
.site-header nav a { position: relative; padding-block: 8px; transition:color .2s ease; }
.site-header nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 2px; height: 3px; border-radius: 8px; background: linear-gradient(90deg,var(--blue),var(--purple),var(--coral)); transition: right .2s ease; }
.site-header nav a:hover,.site-header nav a.is-active { color:var(--purple-dark); }
.site-header nav a:hover::after,.site-header nav a.is-active::after { right: 0; }
.header-cta { min-height: 45px; display: inline-flex; align-items: center; gap: 9px; padding: 10px 17px; border-radius: 14px; color: white; background: linear-gradient(135deg,var(--blue),var(--purple)); box-shadow: 0 12px 26px rgba(71,76,216,.23); font-size: .85rem; font-weight: 850; transition:transform .2s ease,box-shadow .2s ease; }
.header-cta:hover { transform:translateY(-2px);box-shadow:0 17px 31px rgba(71,76,216,.3); }
.menu-toggle { display:none;width:43px;height:43px;place-items:center;padding:0;border:0;border-radius:13px;color:var(--purple-dark);background:var(--purple-soft);font-size:1.1rem;cursor:pointer; }

.hero { position: relative; min-height: 690px; display: flex; align-items: center; overflow: hidden; background: radial-gradient(circle at 18% 16%,rgba(255,216,63,.25),transparent 23%),radial-gradient(circle at 80% 78%,rgba(37,205,218,.24),transparent 27%),linear-gradient(140deg,#fafdff 0%,#eef5ff 45%,#f7f1ff 100%); }
.hero::before { content: ""; position: absolute; width: 360px; height: 360px; right: -140px; top: -140px; border: 42px solid rgba(124,77,255,.08); border-radius: 50%; }
.hero::after { content: ""; position: absolute; width: 280px; height: 280px; left: -150px; bottom: -150px; border: 38px solid rgba(38,118,255,.07); border-radius: 50%; }
.hero-layout { position: relative; z-index: 2; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 64px; padding-block: 72px 84px; }
.hero-copy { position: relative; z-index: 3; }
.hero-copy > p:not(.hero-note) { max-width: 600px; font-size: 1.08rem; line-height: 1.75; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 18px; color: var(--blue-dark); font-size: .76rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.eyebrow .fi { color: var(--yellow-dark); font-size: 1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 31px; }
.button { position:relative;min-height: 53px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 13px 21px; overflow:hidden;border: 0; border-radius: 16px; font-weight: 850; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.button::after { content:"";position:absolute;inset:-120% auto -120% -38%;width:25%;background:rgba(255,255,255,.38);transform:rotate(18deg);transition:left .55s ease; }
.button:hover::after { left:118%; }
.button:hover { transform: translateY(-3px); }
.button:active { transform:translateY(0) scale(.98); }
.button-primary { color: white; background: linear-gradient(135deg,var(--blue),var(--purple)); box-shadow: 0 16px 34px rgba(61,82,214,.25); }
.button-secondary { color: var(--blue-dark); background: white; box-shadow: inset 0 0 0 2px #d8e6ff,0 12px 30px rgba(55,83,150,.08); }
.hero-note { display: flex; align-items: center; gap: 8px; margin: 18px 0 0; color: #77778d; font-size: .85rem; }
.hero-note .fi { color: var(--green); }
.hero-product { position: relative; min-height: 510px; }
.product-window { position: absolute; width: 92%; right: 0; top: 52px; z-index: 1; overflow: hidden; border: 8px solid white; border-radius: 28px; background: white; box-shadow: 0 35px 90px rgba(42,63,141,.2); transform: rotate(1deg); }
.window-bar { height: 37px; display: flex; align-items: center; gap: 7px; padding-inline: 13px; color: #85859a; background: #f3f5fb; font-size: .68rem; }
.window-bar > span { width: 8px; height: 8px; border-radius: 50%; background: var(--coral); }
.window-bar > span:nth-child(2) { background: var(--yellow); }
.window-bar > span:nth-child(3) { background: var(--green); }
.window-bar small { margin-left: 8px; }
.hero-screen { width: 100%; height: auto; }
.hero-mascot { position: absolute; z-index: 4; width: 34%; height: auto; right: -4%; bottom: -16px; filter: drop-shadow(0 22px 24px rgba(40,53,112,.22)); }
.hero-badge { position: absolute; z-index: 5; display: flex; align-items: center; gap: 11px; min-width: 175px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.9); border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 16px 38px rgba(43,61,122,.16); backdrop-filter: blur(10px); }
.hero-badge > span { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; color: white; font-size: 1.15rem; }
.hero-badge b,.hero-badge small { display: block; }.hero-badge b { font-size: .88rem; }.hero-badge small { color: #77778e; font-size: .7rem; }
.badge-games { left: -2%; top: 8px; }.badge-games > span { background: linear-gradient(145deg,var(--purple),var(--coral)); }
.badge-local { left: 3%; bottom: 8px; }.badge-local > span { color: #725400; background: var(--yellow); }
.hero-confetti { position: absolute; z-index: 1; border-radius: 9px; transform: rotate(24deg); }
.confetti-one { width: 18px; height: 18px; left: 7%; top: 18%; background: var(--coral); box-shadow: 46px 230px 0 var(--yellow),160px -54px 0 var(--cyan); }
.confetti-two { width: 14px; height: 14px; right: 7%; bottom: 20%; background: var(--green); box-shadow: -48px -360px 0 var(--yellow),-380px 25px 0 var(--purple); }

.hero { min-height:650px;color:white;background:radial-gradient(circle at 68% 44%,rgba(54,38,190,.5),transparent 29%),radial-gradient(circle at 90% 18%,rgba(91,34,181,.22),transparent 22%),linear-gradient(122deg,#0a032d 0%,#130342 44%,#20056b 100%); }
.hero::before,.hero::after { content:none; }
.hero-rays { position:absolute;z-index:0;inset:-75% -12% -10% -1%;opacity:.48;background:repeating-conic-gradient(from 238deg at 50% 72%,transparent 0deg 8deg,rgba(115,56,222,.2) 8deg 15deg,transparent 15deg 24deg);filter:blur(5px); }
.hero-layout { z-index:3;grid-template-columns:.82fr 1.18fr;gap:28px;padding-block:58px 104px; }
.hero-copy { z-index:6;padding-left:6px; }
.hero-title { display:grid;max-width:560px;margin:0 0 22px;font-size:clamp(2.75rem,4.6vw,4rem);line-height:.96;letter-spacing:-.045em;text-shadow:0 7px 0 rgba(0,0,0,.12),0 17px 38px rgba(3,0,24,.32); }
.hero-title span { display:block; }
.hero-title span:first-child { color:#fff; }
.hero-title span:nth-child(2) { color:#9bef05; }
.hero-title span:last-child { color:#12d5f4; }
.hero-copy>p:not(.hero-note) { max-width:445px;margin-bottom:0;color:rgba(255,255,255,.84);font-size:1rem;line-height:1.6;font-weight:620; }
.hero-actions { margin-top:27px; }
.hero-game-button { min-height:50px;padding-inline:23px;color:#122011;background:linear-gradient(135deg,#c4f510,#8fe800);box-shadow:0 15px 32px rgba(134,225,0,.2);font-size:.82rem;text-transform:uppercase; }
.hero-game-button:hover { box-shadow:0 20px 38px rgba(152,235,0,.3); }
.hero-school-button { min-height:50px;padding-inline:23px;border:1px solid rgba(169,99,255,.88);color:white;background:rgba(28,8,83,.35);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);font-size:.82rem;text-transform:uppercase;backdrop-filter:blur(8px); }
.hero-school-button:hover { border-color:#c69aff;background:rgba(102,44,186,.32);box-shadow:0 16px 34px rgba(66,19,148,.28); }
.hero-proof { display:flex;align-items:center;flex-wrap:wrap;gap:21px;margin-top:28px;color:rgba(255,255,255,.88);font-size:.71rem;font-weight:760; }
.hero-proof span { display:inline-flex;align-items:center;gap:7px;white-space:nowrap; }.hero-proof .fi{color:#ffd634;font-size:.9rem}.hero-proof span:nth-child(2) .fi{color:#8ee6ff}.hero-proof span:nth-child(3) .fi{color:#d6a4ff}
.hero-art { position:relative;z-index:4;min-height:550px;align-self:end; }
.hero-art-glow { position:absolute;width:74%;height:70%;left:17%;top:14%;border-radius:50%;background:radial-gradient(circle,rgba(34,122,255,.37),rgba(65,18,149,.18) 45%,transparent 70%);filter:blur(14px); }
.hero-character { position:absolute;z-index:3;width:min(680px,100%);height:610px;right:-6%;bottom:-25px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 28px 34px rgba(3,0,30,.4)); }
.hero-art .hero-mascot { position:absolute;z-index:5;width:300px;height:auto;left:-6%;top:auto;right:auto;bottom:30px;filter:drop-shadow(0 16px 18px rgba(2,0,27,.34));animation:mascotFloat 4.6s .8s ease-in-out infinite; }
.hero-curve { position:absolute;z-index:7;width:112%;height:126px;left:-6%;bottom:-74px;border-radius:50% 50% 0 0;background:white;pointer-events:none; }
.hero-particles { position:absolute;z-index:2;inset:0;pointer-events:none; }.hero-particles span{position:absolute;width:9px;height:9px;border-radius:2px;background:var(--coral);transform:rotate(35deg);animation:confettiDrift 5s ease-in-out infinite}.hero-particles span:nth-child(1){left:5%;top:30%;background:var(--orange)}.hero-particles span:nth-child(2){left:22%;top:11%;width:7px;height:7px;background:var(--purple)}.hero-particles span:nth-child(3){left:31%;top:28%;background:var(--cyan);animation-delay:.7s}.hero-particles span:nth-child(4){right:7%;top:18%;background:var(--yellow);animation-delay:1.2s}.hero-particles span:nth-child(5){right:12%;top:59%;width:8px;height:8px;background:var(--coral);animation-delay:.4s}.hero-particles span:nth-child(6){left:43%;bottom:19%;width:7px;height:7px;background:var(--green);animation-delay:1.6s}

.trust-strip { position: relative; z-index: 8; margin-top: -85px; display: grid; grid-template-columns: repeat(4,1fr); padding: 9px; border: 1px solid #e5e9f7; border-radius: 24px; background: white; box-shadow: 0 20px 56px rgba(44,63,127,.12); }
.trust-item { display: flex; align-items: center; gap: 13px; min-height: 86px; padding: 14px 17px; border-radius: 18px; transition:transform .2s ease,background .2s ease; }
.trust-item:hover { transform:translateY(-3px);background:var(--tone-soft); }
.trust-icon { transition:transform .25s cubic-bezier(.2,.8,.2,1); }
.trust-item:hover .trust-icon { transform:scale(1.1) rotate(-6deg); }
.trust-item + .trust-item { border-left: 1px solid var(--line); }
.trust-icon { width: 46px; height: 46px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 15px; font-size: 1.22rem; }
.trust-item strong,.trust-item small { display: block; }.trust-item strong { font-size: .85rem; line-height: 1.25; }.trust-item small { margin-top: 3px; color: #808096; font-size: .72rem; }

.section-heading { margin-bottom: 45px; }
.split-heading { display: grid; grid-template-columns: 1.18fr .72fr; gap: 75px; align-items: end; }
.split-heading h2 { max-width: 700px; margin-bottom: 0; }
.split-heading > p { max-width: 450px; margin: 0 0 6px; }
.centered-heading { max-width: 760px; margin-inline: auto; text-align: center; }
.centered-heading p { max-width: 650px; margin-inline: auto; }
.benefit-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.benefit-card { position: relative; min-height: 245px; padding: 27px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: 0 10px 35px rgba(51,68,125,.06); transition: transform .22s ease,box-shadow .22s ease; }
.benefit-card::before { content: ""; position: absolute; width: 120px; height: 120px; right: -54px; top: -54px; border-radius: 50%; background: var(--tone-soft); }
.benefit-card::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--tone); }
.benefit-card:hover { transform: translateY(-7px); border-color:color-mix(in srgb,var(--tone) 40%,#e3e8f7); box-shadow: 0 23px 54px color-mix(in srgb,var(--tone) 14%,rgba(51,68,125,.11)); }
.benefit-icon { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: 30px; border-radius: 18px; color: white; background: linear-gradient(145deg,var(--tone),var(--tone-dark)); box-shadow: 0 13px 26px color-mix(in srgb,var(--tone) 28%,transparent); font-size: 1.45rem; }
.benefit-icon,.benefit-arrow { transition:transform .25s cubic-bezier(.2,.8,.2,1); }
.benefit-card:hover .benefit-icon { transform:translateY(-3px) scale(1.08) rotate(-4deg); }
.benefit-card:hover .benefit-arrow { transform:translateX(6px); }
.benefit-card h3 { margin-bottom: 10px; }.benefit-card p { max-width: 300px; margin-bottom: 0; font-size: .92rem; }
.benefit-arrow { position: absolute; right: 23px; bottom: 22px; color: var(--tone); font-size: .92rem; }

.tone-blue { --tone:var(--blue); --tone-dark:var(--blue-dark); --tone-soft:var(--blue-soft); }
.tone-purple { --tone:var(--purple); --tone-dark:var(--purple-dark); --tone-soft:var(--purple-soft); }
.tone-yellow { --tone:var(--yellow); --tone-dark:var(--yellow-dark); --tone-soft:var(--yellow-soft); }
.tone-green { --tone:var(--green); --tone-dark:var(--green-dark); --tone-soft:var(--green-soft); }
.tone-coral { --tone:var(--coral); --tone-dark:var(--coral-dark); --tone-soft:var(--coral-soft); }
.tone-cyan { --tone:var(--cyan); --tone-dark:var(--cyan-dark); --tone-soft:var(--cyan-soft); }
.tone-orange { --tone:var(--orange); --tone-dark:#dd6d24; --tone-soft:var(--orange-soft); }
.trust-item .trust-icon { color: var(--tone-dark); background: var(--tone-soft); }

.games-section { position: relative; background: linear-gradient(180deg,#f4f8ff 0%,#f9f5ff 100%); }
.games-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 8% 18%,rgba(255,201,40,.17),transparent 16%),radial-gradient(circle at 92% 76%,rgba(40,198,215,.16),transparent 20%); }
.games-section .section-shell { position: relative; }
.games-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.game-card { position: relative; overflow: hidden; border: 1px solid #e3e8f7; border-radius: 24px; background: white; box-shadow: 0 12px 36px rgba(43,65,132,.08); transition: transform .22s ease,box-shadow .22s ease; }
.game-card:hover { transform: translateY(-7px); border-color:color-mix(in srgb,var(--tone) 48%,#e3e8f7); box-shadow: 0 25px 58px color-mix(in srgb,var(--tone) 16%,rgba(43,65,132,.14)); }
.game-image { aspect-ratio: 16/9; display: grid; place-items: center; overflow: hidden; background: #eef2fb; }
.game-image img { width: 100%; height: 100%; object-fit: contain; transition:transform .45s cubic-bezier(.2,.8,.2,1); }
.game-card:hover .game-image img { transform:scale(1.035); }
.game-content { position: relative; display: grid; grid-template-columns: 48px 1fr; gap: 14px; min-height: 150px; padding: 22px; border-top: 4px solid var(--tone); }
.game-content::after { content: ""; position: absolute; width: 95px; height: 95px; right: -46px; bottom: -48px; border-radius: 50%; background: var(--tone-soft); }
.game-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; color: var(--tone-dark); background: var(--tone-soft); font-size: 1.16rem; }
.game-icon,.game-card h3 { transition:transform .25s ease,color .25s ease; }
.game-card:hover .game-icon { transform:scale(1.09) rotate(-5deg); }
.game-card:hover h3 { color:var(--tone-dark); }
.game-card h3 { margin: 4px 0 8px; }.game-card p { margin: 0; font-size: .85rem; line-height: 1.55; }

.demo-section { position:relative;overflow:hidden;background:radial-gradient(circle at 13% 10%,rgba(255,201,40,.2),transparent 22%),radial-gradient(circle at 90% 92%,rgba(40,198,215,.18),transparent 24%),linear-gradient(135deg,#f6f8ff,#f4f1ff); }
.demo-section::before { content:"";position:absolute;width:310px;height:310px;right:-160px;top:-160px;border:42px solid rgba(124,77,255,.07);border-radius:50%; }
.demo-layout { position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .85fr;gap:70px;align-items:center; }
.demo-stage { position:relative;aspect-ratio:16/13;overflow:hidden;border:8px solid white;border-radius:30px;background:#14234d;box-shadow:0 30px 80px rgba(39,55,125,.22);transition:transform .35s ease,box-shadow .35s ease; }
.demo-stage:hover { transform:translateY(-5px);box-shadow:0 38px 88px rgba(54,57,150,.28); }
.demo-frame { width:100%;height:100%;object-fit:cover;background:#eef2fb;animation:frameReveal .55s cubic-bezier(.2,.8,.2,1); }
.demo-shade { position:absolute;inset:0;background:linear-gradient(180deg,transparent 32%,rgba(14,20,48,.17) 55%,rgba(14,20,48,.88) 100%);pointer-events:none; }
.demo-caption { position:absolute;left:28px;bottom:27px;z-index:2;display:grid;gap:3px;color:white; }
.demo-caption strong { font-size:1.05rem; }.demo-caption small { color:rgba(255,255,255,.72);font-size:.73rem; }
.demo-control { position:absolute;left:50%;top:50%;z-index:3;width:68px;height:68px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;color:var(--purple-dark);background:white;box-shadow:0 15px 38px rgba(21,27,76,.3);font-size:1.3rem;cursor:pointer;transform:translate(-50%,-50%);transition:transform .25s ease,box-shadow .25s ease,color .25s ease; }
.demo-control::before { content:"";position:absolute;inset:-10px;border:2px solid rgba(255,255,255,.55);border-radius:50%;animation:playPulse 2.2s ease-out infinite; }
.demo-control:hover { color:var(--blue);transform:translate(-50%,-50%) scale(1.1);box-shadow:0 18px 45px rgba(60,72,190,.42); }
.demo-control.is-playing::before { animation:none;opacity:0; }
.demo-progress { position:absolute;right:22px;bottom:29px;z-index:3;display:flex;gap:6px; }
.demo-progress span { width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.38);transition:width .25s ease,background .25s ease; }
.demo-progress span.is-active { width:24px;border-radius:99px;background:var(--yellow); }
.demo-copy h2 { max-width:580px; }.demo-copy>p { max-width:560px;font-size:1rem; }
.demo-points { display:grid;gap:12px;margin:27px 0 30px; }
.demo-points span { display:flex;align-items:center;gap:11px;color:#505069;font-size:.88rem;font-weight:800; }
.demo-points .fi { width:38px;height:38px;flex:0 0 auto;border-radius:12px;color:var(--purple-dark);background:var(--purple-soft); }
.demo-points span:nth-child(2) .fi { color:var(--blue-dark);background:var(--blue-soft); }.demo-points span:nth-child(3) .fi { color:var(--green-dark);background:var(--green-soft); }
.demo-actions { display:flex;align-items:center;flex-wrap:wrap;gap:20px; }
.text-link { display:inline-flex;align-items:center;gap:8px;color:var(--purple-dark);font-size:.86rem;font-weight:900; }
.text-link .fi { transition:transform .2s ease; }.text-link:hover .fi { transform:translateX(5px); }
.demo-note { display:flex;align-items:center;gap:8px;margin-top:20px;color:#85859a;font-size:.72rem; }.demo-note .fi { color:var(--coral); }

.product-section { background: white; }
.product-heading { margin-bottom: 36px; }
.screen-gallery { display: grid; grid-template-columns: 1.25fr 1fr 1fr; grid-template-rows: repeat(2,auto); gap: 14px; padding: 14px; border-radius: 30px; background: linear-gradient(135deg,#1a2b6b,#51278f); box-shadow: 0 28px 80px rgba(31,49,118,.2); }
.screen-gallery figure { position: relative; margin: 0; overflow: hidden; border: 3px solid rgba(255,255,255,.15); border-radius: 18px; background: #fff; }
.screen-gallery .screen-main { grid-row: 1 / 3; }
.screen-gallery img { width: 100%; height: 100%; min-height: 190px; object-fit: contain; background: white; }
.screen-gallery .screen-main img { min-height: 430px; }
.screen-gallery figcaption { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 10px; color: white; background: rgba(27,27,49,.78); backdrop-filter: blur(7px); font-size: .7rem; font-weight: 800; }
.interactive-gallery { display:grid;grid-template-columns:1.52fr .68fr;gap:15px;padding:25px;border-radius:30px;background:linear-gradient(135deg,#172b70,#542890);box-shadow:0 28px 80px rgba(31,49,118,.2); }
.active-screen { position:relative;min-width:0;margin:0;overflow:hidden;border:3px solid rgba(255,255,255,.22);border-radius:20px;background:white; }
.active-screen img { width:100%;height:100%;min-height:453px;object-fit:contain;background:white;animation:frameReveal .45s ease; }
.active-screen figcaption { position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px;color:white;background:rgba(27,27,49,.82);backdrop-filter:blur(8px);font-size:.75rem;font-weight:850; }
.screen-thumbnails { display:grid;grid-template-columns:repeat(2,1fr);gap:15px;align-content:center; }
.screen-thumbnails button { position:relative;min-width:0;padding:0;overflow:hidden;border:3px solid transparent;border-radius:16px;background:white;box-shadow:0 8px 24px rgba(10,18,57,.17);cursor:pointer;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.screen-thumbnails button:last-child { grid-column:1/3; }
.screen-thumbnails button:hover { transform:translateY(-4px);border-color:rgba(255,201,40,.8);box-shadow:0 14px 30px rgba(10,18,57,.25); }
.screen-thumbnails button.is-active { border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,201,40,.22),0 14px 32px rgba(10,18,57,.28); }
.screen-thumbnails img { width:100%;aspect-ratio:16/9;object-fit:contain;background:white;transition:transform .3s ease; }
.screen-thumbnails button:hover img { transform:scale(1.035); }
.screen-thumbnails span { position:absolute;left:6px;right:6px;bottom:6px;display:flex;align-items:center;justify-content:center;gap:5px;padding:5px;border-radius:8px;color:white;background:rgba(27,27,49,.76);font-size:.58rem;font-weight:800;backdrop-filter:blur(5px); }
.feature-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 22px; }
.feature-row article { display: flex; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 19px; background: white; transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
.feature-row article:hover { transform:translateY(-5px);border-color:#d6ddf3;box-shadow:0 16px 34px rgba(50,67,127,.11); }
.feature-row article > span { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; color: var(--blue-dark); background: var(--blue-soft); }
.feature-row article:nth-child(2) > span { color:var(--green-dark); background:var(--green-soft); }.feature-row article:nth-child(3) > span { color:var(--yellow-dark); background:var(--yellow-soft); }.feature-row article:nth-child(4) > span { color:var(--coral-dark); background:var(--coral-soft); }
.feature-row b { font-size: .85rem; }.feature-row p { margin: 4px 0 0; font-size: .76rem; line-height: 1.5; }

.school-section { position: relative; overflow: hidden; color: white; background: radial-gradient(circle at 15% 10%,rgba(255,201,40,.23),transparent 22%),radial-gradient(circle at 88% 85%,rgba(40,198,215,.27),transparent 28%),linear-gradient(135deg,#1459dc 0%,#6440db 58%,#8d3dc5 100%); }
.school-section::after { content: ""; position: absolute; width: 360px; height: 360px; right: -180px; top: -180px; border: 45px solid rgba(255,255,255,.08); border-radius: 50%; }
.school-layout { position: relative; z-index: 2; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 80px; }
.school-copy { position: relative; }
.school-copy h2,.school-copy p { color:white; }.school-copy p { max-width: 510px; color:rgba(255,255,255,.78); }
.school-copy > img { position: absolute; left: 40px; bottom: -106px; width: 310px; height: auto; filter: drop-shadow(0 22px 26px rgba(20,20,70,.23)); }
.light-eyebrow { color: #fff3ae; }.light-eyebrow .fi { color: white; }
.use-cloud { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; }
.use-cloud article { min-height: 112px; display: flex; align-items: center; gap: 15px; padding: 19px; border: 1px solid rgba(255,255,255,.24); border-radius: 21px; background: rgba(255,255,255,.13); box-shadow: inset 0 1px 0 rgba(255,255,255,.18); backdrop-filter: blur(9px); }
.use-cloud article { transition:transform .22s ease,background .22s ease,border-color .22s ease; }
.use-cloud article:hover { transform:translateY(-5px);border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.2); }
.use-cloud article>span { transition:transform .25s cubic-bezier(.2,.8,.2,1); }.use-cloud article:hover>span { transform:scale(1.08) rotate(-5deg); }

.use-cloud article > span { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 15px; color: #5c36b6; background: white; font-size: 1.18rem; }
.use-cloud article:nth-child(2) > span,.use-cloud article:nth-child(6) > span { color:#815e00;background:#fff1a9; }.use-cloud article:nth-child(3) > span,.use-cloud article:nth-child(7) > span { color:#087f4a;background:#c9f6dc; }.use-cloud article:nth-child(4) > span { color:#c83c50;background:#ffd7dc; }.use-cloud article:nth-child(5) > span { color:#0c7990;background:#ccf6fa; }
.use-cloud b { font-size: .9rem; }

.offline-section { display: grid; grid-template-columns: 1fr .78fr; gap: 85px; align-items: center; }
.offline-copy > p { max-width: 620px; font-size: 1.03rem; }
.offline-points { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 27px; }
.offline-points span { display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .78rem; font-weight: 800; }
.offline-points span:nth-child(2){color:var(--yellow-dark);background:var(--yellow-soft)}.offline-points span:nth-child(3){color:var(--green-dark);background:var(--green-soft)}.offline-points span:nth-child(4){color:var(--purple-dark);background:var(--purple-soft)}
.offline-panel { min-height: 345px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 38px; overflow: hidden; border-radius: 31px; text-align: center; background: radial-gradient(circle at 15% 20%,rgba(255,201,40,.32),transparent 25%),radial-gradient(circle at 85% 80%,rgba(40,198,215,.3),transparent 28%),linear-gradient(145deg,#f0f6ff,#f3ecff); box-shadow: var(--shadow); }
.offline-panel { transition:transform .3s ease,box-shadow .3s ease; }.offline-panel:hover { transform:translateY(-6px) rotate(.25deg);box-shadow:0 32px 82px rgba(52,70,137,.2); }
.offline-main-icon { width: 100px; height: 100px; display: grid; place-items: center; border-radius: 30px; color: white; background: linear-gradient(145deg,var(--blue),var(--purple)); box-shadow: 0 18px 38px rgba(72,70,210,.26); font-size: 2.5rem; }
.offline-panel strong { margin-top: 23px; font-size: 1.22rem; }.offline-panel p { max-width: 330px; margin: 8px auto; font-size: .9rem; }.offline-panel small { display:flex;align-items:center;gap:7px;color:#747489;font-size:.75rem}.offline-panel small .fi{color:var(--green)}

.implementation-section { background: linear-gradient(180deg,#fbfcff,#f5f7ff); }
.steps-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.steps-grid article { position: relative; min-height: 280px; padding: 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 25px; background: white; box-shadow: 0 12px 36px rgba(51,68,125,.06); transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
.steps-grid article:hover { transform:translateY(-7px);border-color:color-mix(in srgb,var(--tone) 35%,var(--line));box-shadow:0 23px 50px color-mix(in srgb,var(--tone) 12%,rgba(51,68,125,.1)); }
.steps-grid article::before { content:"";position:absolute;width:150px;height:150px;right:-70px;top:-70px;border-radius:50%;background:var(--tone-soft); }
.step-icon { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 37px; border-radius: 19px; color: white; background: linear-gradient(145deg,var(--tone),var(--tone-dark)); font-size: 1.4rem; box-shadow:0 14px 28px color-mix(in srgb,var(--tone) 28%,transparent); }
.step-icon { transition:transform .25s ease; }.steps-grid article:hover .step-icon { transform:scale(1.08) rotate(-5deg); }
.steps-grid small { color: var(--tone-dark); font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }.steps-grid h3 { margin: 7px 0 10px; }.steps-grid p { margin:0;font-size:.9rem; }

.faq-list { max-width: 920px; margin: 0 auto; border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line);transition:background .25s ease,border-color .25s ease,padding .25s ease; }
.faq-list details[open] { padding-inline:18px;border-color:#d9d1ff;border-radius:16px;background:linear-gradient(135deg,#fbfcff,#f7f3ff); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 23px 2px; cursor: pointer; list-style: none; font-weight: 800; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-question { display:flex;align-items:center;gap:12px}.faq-question .fi{width:36px;height:36px;border-radius:12px;color:var(--blue-dark);background:var(--blue-soft)}
.faq-toggle { width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;color:var(--purple-dark);background:var(--purple-soft);transition:transform .2s ease}.faq-list details[open] .faq-toggle{transform:rotate(45deg)}
.faq-answer { display:grid!important;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .3s ease,opacity .25s ease; }
.faq-list details[open] .faq-answer { grid-template-rows:1fr;opacity:1; }
.faq-list details p { max-width:760px;min-height:0;overflow:hidden;margin:-4px 0 23px 50px;font-size:.93rem; }

.conversion-section { position:relative;overflow:hidden;padding-block:96px;color:white;background:radial-gradient(circle at 7% 12%,rgba(255,201,40,.24),transparent 20%),radial-gradient(circle at 95% 88%,rgba(40,198,215,.26),transparent 25%),linear-gradient(125deg,#173f9b,#5b37ca 58%,#7f3cb4); }
.conversion-section::after { content:"";position:absolute;width:320px;height:320px;right:-140px;top:-170px;border:42px solid rgba(255,255,255,.08);border-radius:50%; }
.conversion-layout { position:relative;z-index:2;display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center; }
.conversion-copy { position:relative; }
.conversion-copy h2,.conversion-copy p { color:white }.conversion-copy p{color:rgba(255,255,255,.78);font-size:1.03rem}.conversion-copy>img{position:absolute;left:40px;bottom:-102px;width:300px;filter:drop-shadow(0 22px 28px rgba(12,16,64,.28))}
.contact-mini { display:grid;gap:10px;margin-top:33px;color:rgba(255,255,255,.88);font-size:.86rem}.contact-mini span{display:flex;align-items:center;gap:8px}.contact-mini .fi{width:34px;height:34px;border-radius:11px;color:#3c33a6;background:white}.contact-mini b{margin-right:3px;color:white}
.lead-form { padding:31px;border:1px solid rgba(255,255,255,.22);border-radius:28px;color:var(--ink);background:white;box-shadow:0 32px 85px rgba(17,24,78,.3); }
.form-heading { display:flex;align-items:center;gap:13px;margin-bottom:24px}.form-heading>span{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;border-radius:15px;color:white;background:linear-gradient(145deg,var(--blue),var(--purple));font-size:1.16rem}.form-heading b,.form-heading small{display:block}.form-heading b{font-size:1.23rem}.form-heading small{color:var(--text);font-size:.78rem}
.form-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.form-grid label{display:grid;gap:7px;color:#4f4f66;font-size:.82rem;font-weight:800}.form-grid input,.form-grid select{width:100%;height:49px;padding:0 13px;border:1px solid #dfe4f2;border-radius:13px;outline:none;color:var(--ink);background:#fbfcff;font-size:.86rem}.form-grid input:focus,.form-grid select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(38,118,255,.12)}
.button-form { width:100%;margin-top:20px;color:white;background:linear-gradient(135deg,#21ae63,#168c51);box-shadow:0 15px 30px rgba(26,154,87,.22)}.lead-form>small{display:block;margin-top:11px;color:#858599;text-align:center;font-size:.7rem}
.lead-form { transition:transform .3s ease,box-shadow .3s ease; }.lead-form:hover { transform:translateY(-4px);box-shadow:0 38px 92px rgba(17,24,78,.36); }

footer { position:relative;overflow:hidden;padding:76px 0 0;color:white;background:radial-gradient(circle at 13% 5%,rgba(38,118,255,.24),transparent 26%),radial-gradient(circle at 92% 92%,rgba(124,77,255,.32),transparent 30%),linear-gradient(135deg,#121c3a 0%,#172657 52%,#352069 100%); }
.footer-shell { position:relative;z-index:2;width:min(1220px,calc(100% - 48px));margin-inline:auto; }
.footer-glow { position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none; }.footer-glow-one{width:280px;height:280px;left:-170px;top:-150px;border:40px solid rgba(255,201,40,.08)}.footer-glow-two{width:340px;height:340px;right:-210px;bottom:-170px;border:52px solid rgba(40,198,215,.08)}
.footer-top { display:grid;grid-template-columns:1.25fr .62fr .75fr .66fr;gap:52px;align-items:start; }
.footer-brand img { width:168px;margin-bottom:17px;filter:drop-shadow(0 12px 22px rgba(6,12,42,.24)); }
.footer-brand>p { max-width:390px;margin:0;color:#b8c2df;font-size:.88rem; }
.footer-contact { display:grid;gap:10px;margin-top:23px; }
.footer-contact a { display:flex;align-items:center;gap:10px;width:max-content;max-width:100%;color:#dce3f7;font-size:.78rem;font-weight:750;transition:color .2s ease,transform .2s ease; }.footer-contact a:hover{color:white;transform:translateX(4px)}.footer-contact .fi{width:31px;height:31px;border-radius:10px;color:#25307f;background:white}
.footer-column { display:grid;gap:11px; }.footer-column>b { margin-bottom:7px;color:white;font-size:.88rem; }.footer-column a { width:max-content;max-width:100%;color:#aeb9d7;font-size:.78rem;transition:color .2s ease,transform .2s ease; }.footer-column a:hover { color:#fff;transform:translateX(4px); }
.footer-mascot-wrap { position:relative;min-height:220px;align-self:end; }.footer-mascot-wrap img { z-index: 2; position:absolute;width:210px;right:-25px;bottom:5px;filter:drop-shadow(0 20px 23px rgba(4,8,32,.3));animation:mascotFloat 4.5s ease-in-out infinite; }.footer-mascot-wrap span { line-height:1.2; position:absolute;z-index:2;right:88px;top:-10px;width:155px;padding:11px 14px;border-radius:16px 16px 4px 16px;color:#30345e;background:white;box-shadow:0 15px 34px rgba(5,10,38,.18);font-size:.9rem;font-weight:850;text-align:center; }
.footer-trust { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:13px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(255,255,255,.07);backdrop-filter:blur(10px); }
.footer-trust span { display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 13px;border-radius:15px;color:#dce3f6;background:rgba(255,255,255,.045);font-size:.73rem; }.footer-trust .fi { width:37px;height:37px;flex:0 0 auto;border-radius:12px;color:#785300;background:#ffe78c;font-size:1rem; }.footer-trust span:nth-child(2) .fi{color:#085d8c;background:#bdeeff}.footer-trust span:nth-child(3) .fi{color:#5a2db7;background:#e0d2ff}.footer-trust span:nth-child(4) .fi{color:#087846;background:#c7f3d8}
.footer-bottom { display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;margin-top:24px;padding:25px 0 28px;border-top:1px solid rgba(255,255,255,.1);color:#aab5d2;font-size:.76rem; }.footer-bottom>span{font-weight:650}.footer-bottom-links{display:flex;align-items:center;justify-content:flex-end;gap:16px}.footer-bottom-links .back-to-top{display:inline-flex;align-items:center;gap:7px;color:#c0cae3;font-weight:800;transition:color .2s ease,transform .2s ease}.footer-bottom-links .back-to-top:hover{color:white;transform:translateY(-2px)}
.developedby{display:inline-flex}.developedby a{display:inline-flex;align-items:center;gap:5px;min-height:38px;padding:8px 15px;border-radius:999px;color:#f5f6ff;background:rgba(7,11,28,.38);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 25px rgba(5,8,28,.16);font-size:.72rem;font-weight:850;white-space:nowrap;transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}.developedby .fi{color:var(--green);font-size:.86rem}.developedby a:hover{transform:translateY(-2px);border-color:rgba(0, 9, 94, 0.78);background:rgba(9,13,34,.62);box-shadow:0 13px 30px rgba(6,9,31,.26),0 0 18px rgba(5, 0, 1, 0.1)}
.floating-whatsapp { position:fixed;right:20px;bottom:20px;z-index:40;display:flex;align-items:center;gap:8px;padding:12px 17px;border-radius:999px;color:white;background:#21aa61;box-shadow:0 15px 34px rgba(20,126,71,.3);font-size:.82rem;font-weight:900;transition:transform .22s ease,box-shadow .22s ease,opacity .22s ease,visibility .22s ease}.floating-whatsapp .fi{font-size:1.1rem}.floating-whatsapp:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 20px 42px rgba(20,126,71,.38)}.floating-whatsapp.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px) scale(.96)}

.reveal { opacity:0;transform:translateY(28px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity:1;transform:none; }
.reveal-stagger>* { opacity:0;transform:translateY(24px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.2,1); }
.reveal-stagger.is-visible>* { opacity:1;transform:none; }
.reveal-stagger.is-visible>*:nth-child(2){transition-delay:.07s}.reveal-stagger.is-visible>*:nth-child(3){transition-delay:.14s}.reveal-stagger.is-visible>*:nth-child(4){transition-delay:.21s}.reveal-stagger.is-visible>*:nth-child(5){transition-delay:.28s}.reveal-stagger.is-visible>*:nth-child(6){transition-delay:.35s}.reveal-stagger.is-visible>*:nth-child(n+7){transition-delay:.42s}
.hero-enter { animation:heroCopyIn .75s .08s both cubic-bezier(.2,.8,.2,1); }.hero-enter-visual { animation:heroVisualIn .85s .17s both cubic-bezier(.2,.8,.2,1); }
.hero-mascot { animation:mascotFloat 4.6s 1s ease-in-out infinite; }.badge-games{animation:badgeFloat 4s ease-in-out infinite}.badge-local{animation:badgeFloat 4.4s .8s ease-in-out infinite}.confetti-one{animation:confettiDrift 5s ease-in-out infinite}.confetti-two{animation:confettiDrift 5.6s .7s ease-in-out infinite reverse}

@keyframes heroCopyIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes heroVisualIn{from{opacity:0;transform:translateX(34px) scale(.98)}to{opacity:1;transform:none}}
@keyframes mascotFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1deg)}}
@keyframes badgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes confettiDrift{0%,100%{transform:translateY(0) rotate(24deg)}50%{transform:translateY(-12px) rotate(38deg)}}
@keyframes playPulse{0%{opacity:.7;transform:scale(.82)}70%,100%{opacity:0;transform:scale(1.42)}}
@keyframes frameReveal{from{opacity:.35;transform:scale(1.02)}to{opacity:1;transform:none}}

a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}


/* Planos e valores */
.pricing-section { position:relative;overflow:hidden;background:radial-gradient(circle at 11% 22%,rgba(40,198,215,.11),transparent 22%),radial-gradient(circle at 91% 78%,rgba(255,201,40,.13),transparent 24%),linear-gradient(180deg,#fff 0%,#f8f9ff 100%); }
.pricing-shell { position:relative;z-index:2; }
.pricing-shape { position:absolute;border-radius:50%;pointer-events:none; }
.pricing-shape-one { width:330px;height:330px;left:-190px;top:150px;background:rgba(40,198,215,.08); }
.pricing-shape-two { width:290px;height:290px;right:-145px;bottom:65px;background:rgba(255,201,40,.1); }
.pricing-heading { max-width:820px;margin-inline:auto;text-align:center; }
.pricing-heading h2 span { color:var(--purple); }
.pricing-heading>p { max-width:690px;margin:0 auto;color:#6b6b82;font-size:1rem; }
.pricing-toggle { width:min(600px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:0 auto 54px;padding:5px;border:1px solid #dde2f1;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 14px 34px rgba(51,68,125,.08); }
.pricing-toggle button { min-height:48px;display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 14px;border:0;border-radius:999px;color:#45455d;background:transparent;font-size:.84rem;font-weight:900;cursor:pointer;transition:color .22s ease,background .22s ease,box-shadow .22s ease,transform .22s ease; }
.pricing-toggle button small { color:var(--green-dark);font-size:.72rem;font-weight:950; }
.pricing-toggle button:hover { color:var(--purple-dark);background:var(--purple-soft); }
.pricing-toggle button.is-active { color:var(--purple-dark);background:white;box-shadow:inset 0 0 0 2px var(--purple),0 8px 22px rgba(91,60,207,.14);transform:translateY(-1px); }
.pricing-cards { width:min(900px,100%);display:grid;grid-template-columns:.92fr 1.08fr;gap:24px;align-items:stretch;margin-inline:auto; }
.pricing-card { position:relative;display:flex;flex-direction:column;min-height:610px;padding:34px;border:1px solid #e2e6f2;border-radius:30px;background:rgba(255,255,255,.94);box-shadow:0 22px 60px rgba(48,66,128,.1); }
.pricing-trial-card { background:linear-gradient(160deg,rgba(255,255,255,.98),rgba(241,247,255,.94)); }
.pricing-paid-card { border:2px solid var(--purple);background:linear-gradient(160deg,#fff 0%,#fbf9ff 100%);box-shadow:0 29px 70px rgba(81,55,186,.16);transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease; }
.pricing-paid-card.is-monthly { border-color:var(--blue);box-shadow:0 29px 70px rgba(38,118,255,.13); }
.pricing-paid-card.is-semester { border-color:var(--green);box-shadow:0 29px 70px rgba(54,201,111,.14); }
.pricing-paid-card.is-annual { border-color:var(--purple);box-shadow:0 29px 70px rgba(81,55,186,.16); }
.pricing-card-head { text-align:center; }
.pricing-kicker { width:max-content;max-width:100%;display:inline-flex;align-items:center;justify-content:center;align-self:center;padding:7px 14px;border-radius:999px;font-size:.7rem;font-weight:950;letter-spacing:.07em;text-transform:uppercase; }
.trial-kicker { color:var(--blue-dark);background:var(--blue-soft); }
.paid-kicker { color:var(--purple-dark);background:var(--purple-soft); }
.pricing-period { display:block;margin:14px 0 3px;color:var(--blue);font-family:"Arial Rounded MT Bold","Trebuchet MS",ui-rounded,system-ui,sans-serif;font-size:2.05rem;line-height:1.05;letter-spacing:-.035em;text-align:center; }
.pricing-paid-card .pricing-period { color:var(--purple); }
.pricing-paid-card.is-monthly .pricing-period,.pricing-paid-card.is-monthly .paid-price b { color:var(--blue); }
.pricing-paid-card.is-semester .pricing-period,.pricing-paid-card.is-semester .paid-price b { color:var(--green-dark); }
.pricing-paid-card.is-monthly .paid-kicker { color:var(--blue-dark);background:var(--blue-soft); }
.pricing-paid-card.is-semester .paid-kicker { color:var(--green-dark);background:var(--green-soft); }
.pricing-price { display:flex;align-items:baseline;justify-content:center;gap:9px;margin:19px 0 2px;padding-top:20px;border-top:1px solid #e1e5f0;line-height:1; }
.pricing-price span { color:var(--ink);font-size:1.45rem;font-weight:950; }
.pricing-price b { color:var(--blue);font-size:4.8rem;letter-spacing:-.055em; }
.paid-price { margin-top:16px; }
.paid-price b { color:var(--purple);font-size:4.55rem; }
.pricing-description { max-width:310px;margin:8px auto 24px;color:#66667c;font-size:.88rem;font-weight:650;line-height:1.55;text-align:center; }
.pricing-cycle { display:block;margin:0 auto;color:#515168;font-size:.8rem;font-weight:800;text-align:center; }
.pricing-equivalent { min-height:24px;margin:4px 0 12px;color:var(--blue-dark);font-size:.84rem;font-weight:900;text-align:center;transition:opacity .2s ease,transform .2s ease; }
.pricing-recommendation { position:absolute;left:50%;top:-22px;z-index:3;display:inline-flex;align-items:center;justify-content:center;gap:8px;max-width:calc(100% - 42px);min-height:43px;padding:9px 18px;border-radius:999px;color:#6b4c00;background:linear-gradient(135deg,#ffd651,#ffba19);box-shadow:0 12px 28px rgba(206,146,0,.25);font-size:.73rem;font-weight:950;letter-spacing:.025em;white-space:nowrap;transform:translateX(-50%);transition:background .25s ease,color .25s ease,box-shadow .25s ease; }
.pricing-recommendation .fi { font-size:.9rem; }
.pricing-paid-card.is-monthly .pricing-recommendation { color:#fff;background:linear-gradient(135deg,var(--blue),#4c95ff);box-shadow:0 12px 28px rgba(38,118,255,.22); }
.pricing-paid-card.is-semester .pricing-recommendation { color:#075c32;background:linear-gradient(135deg,#bdf1cf,#8ee8af);box-shadow:0 12px 28px rgba(54,201,111,.2); }
.pricing-savings { display:grid;gap:7px;min-height:76px;margin:0 0 14px;transition:opacity .22s ease,transform .22s ease; }
.pricing-savings>strong,.pricing-savings>span { min-height:34px;display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 12px;border-radius:11px;text-align:center; }
.pricing-savings>strong { color:var(--green-dark);background:var(--green-soft);font-size:.93rem;font-weight:950; }
.pricing-savings>span { color:var(--purple-dark);background:var(--purple-soft);font-size:.78rem;font-weight:900; }
.pricing-savings.is-hidden { opacity:0;visibility:hidden;transform:translateY(-5px); }
.pricing-paid-card.is-monthly .pricing-savings>strong { color:var(--blue-dark);background:var(--blue-soft); }
.pricing-paid-card.is-monthly .pricing-savings>span { color:#57576e;background:#f4f6fb;font-size:.74rem;font-weight:800;line-height:1.35; }
.pricing-paid-card.is-monthly .pricing-savings .fi { display:none; }
.pricing-paid-card.is-monthly .pricing-equivalent { min-height:0;margin:0 0 8px; }
.pricing-features { display:grid;gap:0;margin:0 0 26px;padding:0;list-style:none; }
.pricing-features li { min-height:48px;display:flex;align-items:center;gap:12px;border-bottom:1px dashed #dce1ef;color:#3e3e55;font-size:.8rem; }
.pricing-features li:last-child { border-bottom:0; }
.pricing-feature-icon { width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;color:var(--tone-dark);background:var(--tone-soft);font-size:.9rem; }
.pricing-button { width:100%;margin-top:auto;min-height:54px;color:white;letter-spacing:.015em;font-size:.78rem; }
.pricing-button-trial { background:linear-gradient(135deg,#1f70f5,#315dff);box-shadow:0 15px 30px rgba(38,118,255,.2); }
.pricing-button-paid { background:linear-gradient(135deg,var(--purple),#5e31e8);box-shadow:0 15px 30px rgba(92,56,224,.22); }
.pricing-paid-card.is-monthly .pricing-button-paid { background:linear-gradient(135deg,var(--blue),#3569ef);box-shadow:0 15px 30px rgba(38,118,255,.22); }
.pricing-paid-card.is-semester .pricing-button-paid { background:linear-gradient(135deg,#25b863,#15974e);box-shadow:0 15px 30px rgba(31,164,88,.22); }
.pricing-complete { width:min(1010px,100%);margin:26px auto 0;padding:18px 24px;border:1px solid #e1e5f0;border-radius:22px;background:rgba(255,255,255,.9);box-shadow:0 15px 40px rgba(47,64,122,.07);text-align:center; }
.pricing-complete>b { display:block;margin-bottom:13px;font-size:.86rem; }
.pricing-complete-items { display:grid;grid-template-columns:repeat(6,1fr);align-items:center; }
.pricing-complete-items span { min-height:37px;display:flex;align-items:center;justify-content:center;gap:8px;padding:5px 10px;border-right:1px solid #e3e6ef;color:#4d4d64;font-size:.7rem;font-weight:850;white-space:nowrap; }
.pricing-complete-items span:last-child { border-right:0; }
.pricing-complete-items .fi { width:29px;height:29px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;color:var(--purple-dark);background:var(--purple-soft);font-size:.75rem; }
.pricing-complete-items span:nth-child(2) .fi { color:var(--green-dark);background:var(--green-soft); }
.pricing-complete-items span:nth-child(3) .fi { color:#866100;background:var(--yellow-soft); }
.pricing-complete-items span:nth-child(4) .fi { color:var(--blue-dark);background:var(--blue-soft); }
.pricing-complete-items span:nth-child(5) .fi { color:var(--coral-dark);background:var(--coral-soft); }
.pricing-complete-items span:nth-child(6) .fi { color:var(--cyan-dark);background:var(--cyan-soft); }
.pricing-mascot { position:absolute;z-index:-1;width:175px;right:-18px;top:118px;filter:drop-shadow(0 18px 24px rgba(45,60,120,.15));transform:rotate(4deg); }
.pricing-paid-card.is-changing .pricing-period,.pricing-paid-card.is-changing .paid-price,.pricing-paid-card.is-changing .pricing-cycle,.pricing-paid-card.is-changing .pricing-equivalent,.pricing-paid-card.is-changing .pricing-savings { opacity:.35;transform:translateY(5px); }
.pricing-paid-card .pricing-period,.pricing-paid-card .paid-price,.pricing-paid-card .pricing-cycle,.pricing-paid-card .pricing-equivalent,.pricing-paid-card .pricing-savings { transition:opacity .18s ease,transform .18s ease; }

@media (max-width:1080px){
  .site-header{gap:14px}.site-header nav{position:absolute;left:24px;right:24px;top:calc(100% + 8px);display:none;gap:2px;padding:14px;border:1px solid #e2e6f3;border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 20px 48px rgba(40,54,112,.16);backdrop-filter:blur(18px)}.site-header nav.is-open{display:grid}.site-header nav a{padding:11px 13px;border-radius:11px}.site-header nav a::after{display:none}.site-header nav a:hover,.site-header nav a.is-active{background:var(--purple-soft)}.menu-toggle{display:grid}.hero{min-height:0}.hero-layout{grid-template-columns:1fr;gap:32px;padding-top:70px}.hero-copy{max-width:760px;text-align:center;margin-inline:auto}.hero-copy>p:not(.hero-note){margin-inline:auto}.hero-actions{justify-content:center}.hero-note{justify-content:center}.hero-product{width:min(860px,100%);margin-inline:auto;min-height:560px}.product-window{width:90%;right:2%}.hero-mascot{width:30%;right:0}.badge-games{left:0}.badge-local{left:5%}
  .trust-strip{grid-template-columns:repeat(2,1fr);width:min(790px,calc(100% - 48px))}.trust-item:nth-child(3){border-left:0}.trust-item:nth-child(n+3){border-top:1px solid var(--line)}
  .benefit-grid,.steps-grid{grid-template-columns:repeat(2,1fr)}.steps-grid article:last-child{grid-column:1/3}
  .games-grid{grid-template-columns:repeat(2,1fr)}.demo-layout{grid-template-columns:1fr;gap:44px}.demo-stage{width:min(820px,100%);margin-inline:auto}.demo-copy{max-width:760px}.interactive-gallery{grid-template-columns:1fr}.active-screen img{min-height:0;aspect-ratio:16/9}.screen-thumbnails{grid-template-columns:repeat(5,1fr)}.screen-thumbnails button:last-child{grid-column:auto}.screen-gallery{grid-template-columns:1fr 1fr}.screen-gallery .screen-main{grid-row:auto;grid-column:1/3}.screen-gallery .screen-main img{min-height:0}.feature-row{grid-template-columns:repeat(2,1fr)}
  .school-layout,.offline-section,.conversion-layout{grid-template-columns:1fr;gap:48px}.school-copy,.conversion-copy{min-height:auto;padding-bottom:0;max-width:720px}.school-copy>img,.conversion-copy>img{display:none}.use-cloud{max-width:800px}.offline-panel{max-width:680px;width:100%;margin-inline:auto}.conversion-copy{max-width:760px}.conversion-layout{max-width:820px}
  .footer-top{grid-template-columns:1.2fr .7fr .8fr;gap:38px}.footer-mascot-wrap{grid-column:1/4;min-height:170px}.footer-mascot-wrap img{width:185px;right:3%;bottom:-49px}.footer-mascot-wrap span{right:17%;top:22px}.footer-trust{grid-template-columns:repeat(2,1fr)}.footer-bottom{grid-template-columns:1fr auto}.footer-bottom>span{display:block}
  .hero-layout{gap:4px;padding-block:64px 94px}.hero-copy{max-width:720px;padding-left:0}.hero-title{margin-inline:auto}.hero-proof{justify-content:center}.hero-art{width:min(780px,100%);min-height:550px;margin-inline:auto}.hero-character{width:100%;height:590px;right:0;bottom:-34px}.hero-art .hero-mascot{width:116px;left:14%;top:35px}.hero-curve{height:118px;bottom:-72px}
}

@media (max-width:720px){
  .section-shell{width:min(100% - 30px,620px)}.section{padding-block:78px}.site-header{min-height:72px;padding-inline:15px}.brand{width:105px}.header-cta{display:none}.site-header nav{left:15px;right:15px}.menu-toggle{margin-left:auto}
  h1{font-size:clamp(2.35rem,12vw,3.1rem)}.hero-layout{padding-block:55px 76px}.hero-copy{text-align:left}.hero-copy>p:not(.hero-note){margin-inline:0}.hero-actions{justify-content:flex-start}.hero-note{justify-content:flex-start}.button{width:100%}.hero-product{min-height:355px;margin-top:10px}.product-window{width:95%;right:0;top:40px;border-width:5px;border-radius:19px;transform:none}.window-bar{height:29px}.window-bar small{display:none}.hero-mascot{width:31%;right:-2%;bottom:-2px}.hero-badge{min-width:0;padding:8px 10px;border-radius:13px}.hero-badge>span{width:34px;height:34px;border-radius:10px;font-size:.9rem}.hero-badge b{font-size:.75rem}.hero-badge small{display:none}.badge-games{left:0;top:5px}.badge-local{left:2%;bottom:0}.hero-confetti{display:none}
  .trust-strip{grid-template-columns:1fr;width:calc(100% - 30px);margin-top:-50px}.trust-item{min-height:74px;padding:11px 13px}.trust-item+.trust-item{border-left:0;border-top:1px solid var(--line)}
  .split-heading{grid-template-columns:1fr;gap:18px}.section-heading{margin-bottom:34px}.centered-heading{text-align:left}.benefit-grid,.games-grid,.steps-grid{grid-template-columns:1fr}.steps-grid article:last-child{grid-column:auto}.benefit-card{min-height:225px}.game-content{min-height:140px;padding:19px}
  .demo-layout{gap:36px}.demo-stage{border-width:5px;border-radius:21px}.demo-caption{left:17px;bottom:17px}.demo-caption strong{font-size:.85rem}.demo-caption small{font-size:.64rem}.demo-control{width:56px;height:56px}.demo-progress{right:15px;bottom:18px}.demo-actions{align-items:flex-start}.demo-actions .button{width:100%}.demo-note{align-items:flex-start}.interactive-gallery{padding:9px;border-radius:22px}.active-screen{border-radius:15px}.screen-thumbnails{grid-template-columns:repeat(2,1fr)}.screen-thumbnails button:last-child{grid-column:1/3}.screen-thumbnails span{font-size:.54rem}.screen-gallery{grid-template-columns:1fr;padding:9px;border-radius:22px}.screen-gallery .screen-main{grid-column:auto}.screen-gallery img{min-height:0}.feature-row{grid-template-columns:1fr}
  .school-copy{min-height:0}.use-cloud{grid-template-columns:1fr}.use-cloud article:last-child{grid-column:auto}.use-cloud article{min-height:90px}.school-layout{gap:34px}
  .offline-panel{min-height:300px;padding:30px 20px}.offline-points span{font-size:.73rem}
  .form-grid{grid-template-columns:1fr}.lead-form{padding:23px;border-radius:23px}.conversion-section{padding-block:76px}.conversion-copy{min-height:0}.contact-mini span{align-items:flex-start;flex-wrap:wrap}
  .faq-question{gap:9px}.faq-question .fi{display:none}.faq-list details[open]{padding-inline:12px}.faq-list details p{margin-left:0}.footer-shell{width:min(100% - 30px,620px)}.footer-top{grid-template-columns:1fr;gap:31px}.footer-mascot-wrap{grid-column:auto;min-height:185px}.footer-mascot-wrap img{right:2%;bottom:-25px;width:250px}.footer-mascot-wrap span{left:6;right:auto;top:7px}.footer-trust{grid-template-columns:1fr}.footer-bottom{grid-template-columns:1fr;gap:17px}.footer-bottom-links{justify-content:flex-start;align-items:flex-start;flex-direction:column}.footer-bottom>span{display:block;text-align:left}.developedby a{white-space:normal}.floating-whatsapp{right:14px;bottom:14px;padding:12px}.floating-whatsapp span{display:none}
  .hero-layout{padding-block:52px 76px;gap:5px}.hero-copy{text-align:left}.hero-title{margin-inline:0;font-size:clamp(2.55rem,12.6vw,3.45rem)}.hero-copy>p:not(.hero-note){max-width:390px}.hero-actions{gap:10px}.hero-proof{justify-content:flex-start;gap:11px 17px}.hero-art{min-height:410px;margin-top:4px}.hero-character{height:455px;right:41%;bottom:-34px;transform:translateX(50%)}.hero-art .hero-mascot{width:180px;left:0%;top:auto;right:auto;bottom:10px}.hero-curve{height:88px;bottom:-54px}.hero-rays{inset:0% -60% 0 -5%;opacity:.4}.hero-particles span:nth-child(2),.hero-particles span:nth-child(4),.hero-particles span:nth-child(6){display:none}
}


@media (max-width:1080px){
  .pricing-mascot{width:135px;right:0;top:145px;opacity:.9}.pricing-cards{width:min(840px,100%)}.pricing-complete-items{grid-template-columns:repeat(3,1fr);gap:7px}.pricing-complete-items span{border-right:0;border-radius:11px;background:#fafbff}
}

@media (max-width:720px){
  .pricing-section{padding-block:78px}.pricing-heading{text-align:left}.pricing-heading>p{margin-inline:0}.pricing-toggle{grid-template-columns:repeat(3,1fr);margin-bottom:42px;padding:5px;border-radius:20px}.pricing-toggle button{min-width:0;min-height:51px;flex-direction:column;gap:0;padding:6px 3px;border-radius:15px;font-size:.72rem}.pricing-toggle button small{font-size:.63rem}.pricing-cards{grid-template-columns:1fr;gap:36px}.pricing-card{min-height:0;padding:28px 22px;border-radius:25px}.pricing-paid-card{padding-top:39px}.pricing-recommendation{top:-20px;max-width:calc(100% - 28px);font-size:.66rem}.pricing-period{font-size:1.8rem}.pricing-price b{font-size:4.1rem}.paid-price b{font-size:3.9rem}.pricing-features li{font-size:.76rem}.pricing-complete{padding:17px 14px}.pricing-complete-items{grid-template-columns:repeat(2,1fr)}.pricing-complete-items span{justify-content:flex-start;padding-inline:9px}.pricing-mascot{display:none}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}.reveal,.reveal-stagger>*{opacity:1!important;transform:none!important}}


.skip-link{position:fixed;left:14px;top:10px;z-index:9999;padding:10px 14px;border-radius:10px;background:#fff;color:#24243b;font-weight:800;box-shadow:0 8px 25px rgba(0,0,0,.18);transform:translateY(-160%);transition:transform .2s ease}.skip-link:focus{transform:translateY(0)}
