/* Secondary pages (printables, teachers, guides) — same tokens as the home page. */
@font-face{font-family:Fredoka;src:url(/fonts/Fredoka-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Fredoka;src:url(/fonts/Fredoka-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Fredoka;src:url(/fonts/Fredoka-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Rubik;src:url(/fonts/Rubik-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Rubik;src:url(/fonts/Rubik-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Rubik;src:url(/fonts/Rubik-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Rubik;src:url(/fonts/Rubik-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--ink:#0F1B33;--muted:#5A6653;--star:#FBBF24;--hi:#FFD166;--sun:#FFC93C;--accent:#2FA36B;--accent2:#F4C542;--green-plate:#EEF6EA;--green-text:#2E7D46;
  --pink:#F472B6;--orange:#FB923C;--yellow:#FACC15;--green:#4ADE80;--blue:#60A5FA;--glass:rgba(15,27,51,.45);--glass-b:rgba(255,255,255,.30);--plate:rgba(255,255,255,.94);
  --dusk:linear-gradient(180deg,#1B1F5C 0%,#4B3F8F 60%,#6B4F9C 100%);--ground:#2A1C16;--paper:#F6F3EC;--paper2:#EEEAE0;
  --display:'Fredoka',ui-rounded,system-ui,sans-serif;--body:'Rubik',system-ui,sans-serif;--shadow-plate:0 8px 20px rgba(0,0,0,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.55 var(--body);-webkit-font-smoothing:antialiased}
.wrap{max-width:1100px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.01em;line-height:1.05;margin:0;text-wrap:balance}
p{margin:0}a{color:var(--green-text)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--accent);color:#fff;text-decoration:none;font:700 20px var(--display);padding:14px 28px;border-radius:999px;box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 16px 34px rgba(47,163,107,.35);transition:transform .12s}
.btn:active{transform:translateY(2px)}
.btn.white{background:#fff;color:var(--ink);box-shadow:0 12px 30px rgba(0,0,0,.18);font-size:18px}
.btn.glass{background:var(--glass);border:1px solid var(--glass-b);color:#fff;box-shadow:none;font-size:17px;padding:11px 20px}
.btn.small{font-size:16px;padding:10px 18px}
.btn svg{width:18px;height:20px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
/* nav on a solid dusk band */
.top{background:var(--dusk);color:#fff;padding:0 0 64px}
.nav{display:flex;align-items:center;gap:26px;height:76px;padding:0 48px}
.nav .logo{display:flex;align-items:center;gap:10px;font:700 24px var(--display);text-decoration:none;color:#fff}
.nav .logo img{width:38px;height:38px;border-radius:10px}
.nav .links{margin-left:auto;display:flex;gap:22px;font:600 15px var(--body);align-items:center;white-space:nowrap}
.nav .links a{color:#fff;text-decoration:none;opacity:.9}
.nav .cta{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink)!important;opacity:1!important;padding:10px 16px;border-radius:999px;font:700 15px var(--display)}
@media(max-width:900px){.nav{padding:0 20px;gap:12px}.nav .links a:not(.cta){display:none}}
.top .head{max-width:1100px;margin:34px auto 0;padding:0 28px;display:flex;gap:26px;align-items:center}
.top .head img.bumper{width:88px;height:88px;flex:none}
.top h1{font-size:clamp(38px,5.4vw,60px)}.top h1 em{font-style:normal;color:var(--hi)}
.top .lede{font:500 20px/1.45 var(--body);opacity:.95;margin-top:10px;max-width:60ch}
.eyebrow{display:inline-block;font:600 14px var(--display);letter-spacing:2px;text-transform:uppercase;color:var(--green-text);background:var(--green-plate);padding:6px 14px;border-radius:999px;margin-bottom:14px}
section{padding:64px 0}
h2{font-size:clamp(30px,4vw,44px)}
.sub{color:var(--muted);font-size:19px;max-width:62ch;margin:12px 0 0;font-weight:500}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:34px}
.grid.three{grid-template-columns:repeat(3,1fr)}
@media(max-width:820px){.grid,.grid.three{grid-template-columns:1fr}}
.plate{background:var(--plate);border-radius:28px;padding:22px;box-shadow:var(--shadow-plate)}
.plate h3{font-size:24px;margin-bottom:6px}
.plate p{color:var(--muted);font-size:17px;font-weight:500}
.plate .thumb{display:block;width:100%;border-radius:18px;aspect-ratio:11/8.5;object-fit:cover;background:#dfe6d6;margin-bottom:14px}
.plate .thumb.portrait{aspect-ratio:8.5/11;max-height:340px;object-fit:cover;object-position:top}
.plate .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.chip{display:inline-flex;align-items:center;justify-content:center;font:700 18px var(--display);color:rgba(15,27,51,.85);border-radius:8px;height:32px;padding:0 10px}
.faq details{background:var(--plate);border-radius:20px;padding:16px 20px;box-shadow:var(--shadow-plate);margin-top:12px}
.faq summary{cursor:pointer;font:700 20px var(--display)}
.faq p{margin-top:8px;color:var(--muted);font-weight:500}
.prose{max-width:760px}.prose h2{margin-top:44px}.prose h3{font-size:24px;margin-top:28px}.prose p,.prose li{color:#2B3446;font-size:18px;margin-top:12px;font-weight:400}
.prose ul{padding-left:22px}
.demo{margin:36px 0 0;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px rgba(15,27,51,.25);background:#1B1F5C}
.demo iframe{display:block;width:100%;aspect-ratio:1440/1000;border:0}
.callout{background:var(--green-plate);border-radius:22px;padding:18px 22px;color:var(--green-text);font-weight:600;margin-top:24px}
footer{background:var(--ground);color:#fff;text-align:center;padding:64px 0}
footer .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:22px}
footer .fine{margin-top:26px;font:500 14px var(--body);color:rgba(255,255,255,.7)}footer .fine a{color:#fff}
form.req{display:grid;gap:12px;max-width:520px;margin-top:18px}
form.req input,form.req select{font:500 17px var(--body);padding:12px 14px;border-radius:12px;border:2px solid #E1E6DA;background:#fff;color:var(--ink)}
form.req label{display:grid;gap:6px;font:600 14px var(--body);color:var(--muted)}
form.req input,form.req select{width:100%}
form.req .btn{justify-self:start}