@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Nunito:wght@700;800;900&display=swap');
:root{--b:#2563eb;--b2:#1d4ed8;--ink:#0f172a;--muted:#64748b;--line:#e2e8f0;--soft:#f5f9ff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:14px/1.65 Inter,Arial;color:var(--ink)}a{text-decoration:none;color:inherit}.wrap{width:min(1160px,calc(100% - 32px));margin:auto}.top{height:34px;background:#081735;color:#bfdbfe;font-size:11px;padding:8px calc((100% - 1160px)/2)}.top b{float:right;color:#fff}.nav{height:78px;display:flex;align-items:center;gap:25px}.site-header,header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;min-width:235px}.brand i{font:900 17px Nunito;background:linear-gradient(135deg,#2563eb,#06b6d4);color:#fff;border-radius:13px;width:45px;height:45px;display:grid;place-items:center;font-style:normal}.brand strong,.brand em{font:900 19px Nunito}.brand em{color:var(--b);font-style:normal}.brand span{display:flex;flex-direction:column;line-height:1}.brand small{font-size:8px;letter-spacing:.12em;color:#94a3b8;margin-top:5px}.nav nav{display:flex;gap:22px;margin-left:auto}.nav nav a{font-size:12px;font-weight:800}.nav nav a:hover{color:var(--b)}.navbtn,.btn{background:var(--b);color:#fff;padding:11px 16px;border-radius:11px;font-weight:800;font-size:12px}.hamb{display:none;border:0;background:#eff6ff;color:var(--b);padding:9px;border-radius:9px;font-size:20px}.hero{background:linear-gradient(135deg,#071b4a,#123d8e 60%,#0369a1);color:#fff;min-height:590px;overflow:hidden}.hero-in{min-height:590px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}.copy label,label{font-size:10px;letter-spacing:.15em;font-weight:900;color:#2563eb}.copy label{color:#bae6fd}.copy h1{font:900 clamp(43px,5vw,67px)/1.03 Nunito;margin:15px 0}.copy h1 span{color:#67e8f9}.copy p{font-size:16px;color:#dbeafe;max-width:620px}.actions{display:flex;gap:10px;margin:25px 0}.btn{display:inline-block}.primary{background:#fff;color:#1745b5}.ghost{background:#ffffff16;border:1px solid #ffffff44}.trust{font-size:11px;color:#bfdbfe;font-weight:700}.visual{height:440px;position:relative;display:grid;place-items:center}.window{width:min(430px,92%);padding:9px;background:#ffffff22;border-radius:22px;box-shadow:0 25px 70px #0006;transform:rotate(1.5deg);animation:float 5s infinite}.bar{height:32px;color:#dbeafe;font-size:10px;padding:7px}.bar b{margin-left:35%}.paper{background:#fff;color:var(--ink);border-radius:15px;padding:24px;min-height:330px}.paper small{color:var(--b);font-weight:900}.paper h3{font:900 25px Nunito}.paper p{background:#f8fafc;padding:14px;border-radius:10px;font-size:13px}.lines{height:55px;background:repeating-linear-gradient(#fff 0 17px,#e2e8f0 18px)}.paper button{width:100%;border:0;background:var(--b);color:#fff;padding:10px;border-radius:9px;font-weight:800}.float{position:absolute;background:#fff;color:#0f172a;padding:9px 13px;border-radius:11px;font-size:10px;font-weight:900;box-shadow:0 12px 30px #0004}.f1{left:0;top:70px}.f2{right:0;bottom:70px}.quick{border-bottom:1px solid var(--line)}.qgrid{display:grid;grid-template-columns:repeat(4,1fr)}.qgrid div{padding:20px;border-right:1px solid var(--line)}.qgrid div:last-child{border:0}.qgrid b{display:block;color:var(--b);font:900 16px Nunito}.qgrid small{color:var(--muted)}.section{padding:85px 0}.heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px}.heading h2,.center h2{font:900 clamp(29px,4vw,45px)/1.1 Nunito;margin:7px 0}.heading p{max-width:530px;color:var(--muted)}.tools{display:flex;justify-content:space-between;gap:12px;margin-bottom:20px}.tools input{width:430px;max-width:100%;border:1px solid var(--line);border-radius:11px;padding:12px;outline:0}.board{border:0;background:#f1f5f9;padding:10px 14px;border-radius:9px;font-weight:800;color:var(--muted)}.board.active{background:#dbeafe;color:var(--b)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{border:1px solid var(--line);border-radius:19px;overflow:hidden;transition:.25s;background:#fff}.card:hover{transform:translateY(-6px);box-shadow:0 18px 45px #0f172a12}.ctop{display:flex;gap:12px;padding:18px}.badge{width:46px;height:46px;background:#eff6ff;color:var(--b);border-radius:13px;display:grid;place-items:center;font:900 14px Nunito}.ctop h3{font:900 19px Nunito;margin:0}.tags span{font-size:8px;background:#f1f5f9;padding:3px 6px;border-radius:5px;margin-right:4px}.subjects{padding:0 18px 18px;display:flex;flex-wrap:wrap;gap:6px}.subjects a{font-size:9px;font-weight:800;background:#f8fafc;border:1px solid var(--line);padding:7px 8px;border-radius:7px}.actions2{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}.actions2 a{padding:10px;text-align:center;color:var(--b);font-size:9px;font-weight:900}.soft{background:var(--soft)}.center{text-align:center}.center>p{color:var(--muted)}.pills{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:25px}.pills button{border:1px solid var(--line);background:#fff;padding:12px 16px;border-radius:99px;font-weight:800}.dark{padding:90px 0;background:linear-gradient(135deg,#091c48,#123d8e);color:#fff}.light label{color:#67e8f9}.light p{color:#bfdbfe}.feature{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:35px}.feature article{padding:27px;border:1px solid #ffffff22;border-radius:20px;background:#ffffff0e}.feature article>b{float:right;color:#93c5fd}.feature i{display:grid;place-items:center;width:45px;height:45px;background:#dbeafe;color:#1d4ed8;border-radius:12px;font-style:normal;font-weight:900}.feature h3{font:900 22px Nunito}.feature p{color:#cbd5e1;font-size:12px}.feature a{color:#67e8f9;font-size:10px;font-weight:900}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.benefits article{border:1px solid var(--line);padding:23px;border-radius:17px;font-size:25px}.benefits h3{font:900 18px Nunito;margin:7px 0}.benefits p{font-size:11px;color:var(--muted);margin:0}.cta{padding:60px 0;background:linear-gradient(100deg,#2563eb,#0ea5e9);color:#fff}.ctain{display:flex;align-items:center;justify-content:space-between}.ctain h2{font:900 32px Nunito;margin:7px 0}.ctain p{margin:0;color:#dbeafe}.white{background:#fff;color:#1d4ed8}.faq{max-width:850px}.faq details{text-align:left;border-bottom:1px solid var(--line);padding:4px}.faq summary{cursor:pointer;padding:16px;font-weight:800}.faq p{padding:0 16px 14px;color:var(--muted);font-size:12px}footer{background:#08142f;color:#cbd5e1;padding:55px 0 0}.foot{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}.foot h4{color:#fff;font:800 14px Nunito}.foot a{display:block;font-size:10px;color:#94a3b8;margin:7px 0}.bottom{text-align:center;border-top:1px solid #ffffff12;margin-top:30px;padding:17px;font-size:10px;color:#64748b}#up{position:fixed;right:18px;bottom:18px;opacity:0;pointer-events:none;border:0;border-radius:10px;background:var(--b);color:#fff;width:42px;height:42px;font-size:18px}#up.show{opacity:1;pointer-events:auto}.reveal{opacity:0;transform:translateY(22px);transition:.7s}.reveal.on{opacity:1;transform:none}@keyframes float{50%{transform:translateY(-12px) rotate(1.5deg)}}@media(max-width:900px){.nav nav{gap:12px}.hero-in{grid-template-columns:1fr}.visual{height:350px}.grid,.feature,.benefits{grid-template-columns:1fr 1fr}}@media(max-width:700px){.top{padding:8px 12px;text-align:center}.top b{display:none}.nav{height:67px}.hamb{display:block;margin-left:auto}.nav nav{display:none;position:absolute;left:16px;right:16px;top:73px;background:#fff;flex-direction:column;padding:12px;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 45px #0f172a22}.nav nav.open{display:flex}.navbtn{display:none}.brand strong,.brand em{font-size:16px}.hero-in{padding:65px 0}.copy h1{font-size:44px}.copy p{font-size:14px}.qgrid{grid-template-columns:1fr 1fr}.qgrid div{padding:13px}.section{padding:62px 0}.heading{display:block}.tools{display:block}.tools input{width:100%;margin-bottom:9px}.grid,.feature,.benefits,.foot{grid-template-columns:1fr}.ctain{display:block}.ctain .btn{margin-top:20px}.float{font-size:8px}.f1{left:-4px}.f2{right:-4px}}
.seo-intro{padding:28px 0;background:#fff;border-bottom:1px solid #e2e8f0}.seo-intro h2{font:900 24px Nunito;margin:0 0 5px;color:#0f172a}.seo-intro p{margin:0;max-width:980px;color:#64748b;font-size:13px}.seo-intro strong{color:#334155}

/* Search UI reliability */
.tools .searchbox{
  width:430px;
  max-width:100%;
  position:relative;
  display:flex;
  align-items:center;
}
.searchbox>span{
  position:absolute;
  left:13px;
  color:#64748b;
  font-size:19px;
  line-height:1;
  pointer-events:none;
}
.searchbox input{
  width:100% !important;
  padding:13px 40px 13px 38px !important;
  border:1px solid var(--line);
  border-radius:12px;
  outline:0;
  background:#fff;
  color:var(--ink);
  font:600 13px Inter,Arial;
  transition:border-color .2s,box-shadow .2s;
}
.searchbox input:focus{
  border-color:#60a5fa;
  box-shadow:0 0 0 4px #2563eb14;
}
.searchbox input::-webkit-search-cancel-button{display:none}
.searchbox #clearSearch{
  position:absolute;
  right:8px;
  width:28px;
  height:28px;
  border:0;
  border-radius:8px;
  background:#eff6ff;
  color:#2563eb;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}
.searchbox #clearSearch[hidden]{display:none}
.board-filters{
  display:flex;
  gap:7px;
  align-items:center;
}
.search-status{
  min-height:20px;
  margin:-7px 0 14px;
  color:#64748b;
  font-size:11px;
  font-weight:700;
}
.noscript-box{
  max-width:1160px;
  margin:15px auto;
  padding:12px 16px;
  border-radius:10px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  font-size:12px;
}
.subjects a{
  transition:transform .15s ease,background .15s ease,border-color .15s ease;
}
.subjects a:hover{
  transform:translateY(-1px);
  background:#eff6ff;
  border-color:#bfdbfe;
}
@media(max-width:700px){
  .tools .searchbox{width:100%;margin-bottom:9px}
  .board-filters{justify-content:flex-start}
  .search-status{margin-top:0}
}

/* =========================================================
   DEVELOPER-FRIENDLY HTML LINKS
   All class/subject URLs are editable in index.html.
   ========================================================= */

.pills a{
  border:1px solid var(--line);
  background:#fff;
  padding:12px 16px;
  border-radius:99px;
  font-weight:800;
  display:inline-block;
  transition:.2s;
}
.pills a:hover{
  color:var(--b);
  border-color:#bfdbfe;
  background:#eff6ff;
  transform:translateY(-2px);
}
.card[hidden]{display:none !important}

/* WorksheetKaro actual SVG logo */
.brand img{
  width:45px;
  height:45px;
  display:block;
  flex:0 0 45px;
  object-fit:contain;
}
.brand{color:inherit}
.seo-about{
  background:#f8fbff;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.seo-copy{
  max-width:980px;
  color:#475569;
  font-size:14px;
}
.seo-copy p{margin:0 0 16px}
.seo-copy p:last-child{margin-bottom:0}
.seo-copy strong{color:#0f172a}
@media(max-width:700px){
  .seo-copy{font-size:13px}
}