diff --git a/AGENTS.md b/AGENTS.md index dc44e16..f933e4e 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -2,7 +2,7 @@ ## Project purpose -This repository contains the public website for the Napper application ecosystem. It includes the main `napper.au` landing site, the Hudra and Lildra product sites, and shared legal, privacy, support and ecosystem content. Pendra is planned but does not yet have a product page. +This repository contains the public website for the Napper application ecosystem. It includes the main `napper.au` landing site, the Hudra and Lildra product sites, and shared legal, privacy, support and ecosystem content. ## Source of truth @@ -18,10 +18,15 @@ When an important architectural, deployment, naming or development decision is m - Hudra is primarily a presentation and slide-viewing system that turns complete QLearn lesson pages into a classroom presentation experience. Do not describe Hudra as a general-purpose editor. - Lildra is a distraction-free reading extension that hides the surrounding Canvas/QLearn interface while preserving the lesson DOM, content and styling. It is not a presentation system. -- Pendra is planned as a simpler path for bringing completed presentation slides into QLearn. Keep product wording within these boundaries and do not reuse Lildra's clutter-removal positioning as Hudra's primary message. +## Future-product publication + +- Do not mention future products on the public website unless their inclusion is part of an explicit teaser or launch decision. +- An approved teaser must define its wording, destination, campaign purpose and publication period. +- Preserve unapproved concepts under `docs/future-products.md`, not in public HTML, CSS or browser JavaScript. + ## Current architecture The site is a dependency-free static site using HTML, CSS and small browser JavaScript files. Do not introduce a framework, package manager, build system or templating engine without an explicit architectural decision. @@ -44,7 +49,7 @@ The site is a dependency-free static site using HTML, CSS and small browser Java └── terms/index.html ``` -Hudra provides the established foundational product-page and legal-page styling. Lildra reuses that stable foundation through its own theme stylesheets and keeps Lildra-specific colours and visuals isolated there. Reassess this CSS layering before adding Pendra rather than creating another product-to-product dependency. +Hudra provides the established foundational product-page and legal-page styling. Lildra reuses that stable foundation through its own theme stylesheets and keeps Lildra-specific colours and visuals isolated there. Reassess this CSS layering before adding another product rather than creating another product-to-product dependency. ## Deployment assumptions diff --git a/README.md b/README.md index 38d0738..76fef6b 100644 --- a/README.md +++ b/README.md @@ -6,7 +6,6 @@ Static source for the Napper application ecosystem website, deployed at . It turns complete QLearn lesson pages into a presentation or slide-style classroom teaching experience. - **Lildra** is available at . It gives supported Canvas and QLearn lesson pages a distraction-free reading view while preserving their original content and styling. -- **Pendra** is planned. A `/pendra` page has not yet been added. ## Site structure diff --git a/TODO.md b/TODO.md index 49b8178..1ef17ae 100644 --- a/TODO.md +++ b/TODO.md @@ -8,7 +8,7 @@ ## Next - Submit Lildra to the Chrome Web Store and add its listing link when approved -- Add Pendra +- Review future product concepts privately before approving any public teaser or launch work - Shared CSS - Shared navigation diff --git a/css/napper.css b/css/napper.css index 972f437..69f29f5 100644 --- a/css/napper.css +++ b/css/napper.css @@ -1,13 +1,12 @@ -:root{--blue-950:#071b4f;--blue-900:#0a286f;--blue-800:#0b399e;--blue-700:#0b45d8;--blue-600:#2462ee;--blue-100:#dce8ff;--blue-50:#f2f6ff;--lildra-950:#281052;--lildra-800:#5425a8;--lildra-700:#6d35d8;--lildra-600:#8250e8;--lildra-100:#eadfff;--lildra-50:#f8f3ff;--pendra-950:#500d2d;--pendra-800:#9d1b5a;--pendra-700:#c22572;--pendra-600:#db3f88;--pendra-100:#ffddeb;--pendra-50:#fff2f7;--ink:#10182b;--muted:#61708e;--line:#dce3ef;--soft:#f6f8fc;--white:#fff;--container:1180px;--radius-lg:24px;--radius-xl:34px;--shadow:0 24px 70px rgba(8,35,108,.13)} -*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}.container{width:min(calc(100% - 42px),var(--container));margin-inline:auto}.skip-link{position:absolute;left:-9999px;top:10px;z-index:999;padding:10px 14px;background:#fff}.skip-link:focus{left:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(220,227,239,.85);background:rgba(255,255,255,.88);backdrop-filter:blur(16px)}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:inline-flex;align-items:center;gap:12px;color:var(--blue-950);font-size:1.18rem;font-weight:900;text-decoration:none;letter-spacing:-.03em}.brand-mark{width:42px;height:42px;display:grid;place-items:center;color:#fff;border-radius:13px;background:linear-gradient(145deg,var(--blue-600),var(--blue-950));box-shadow:0 10px 24px rgba(11,69,216,.22)}.site-nav{display:flex;align-items:center;gap:28px}.site-nav a{color:#3b4966;font-size:.93rem;font-weight:750;text-decoration:none}.site-nav a:hover{color:var(--blue-700)}.nav-button{padding:10px 17px;color:#fff!important;border-radius:11px;background:var(--blue-700)}.menu-button{display:none;width:44px;height:44px;padding:10px;border:0;background:transparent}.menu-button span:not(.sr-only){display:block;height:2px;margin:5px 0;background:var(--blue-950)}.hero{position:relative;overflow:hidden;padding:105px 0 96px;background:linear-gradient(180deg,#fff 0%,#f7f9ff 100%)}.hero-grid{display:grid;grid-template-columns:1.03fr .97fr;gap:75px;align-items:center}.eyebrow{display:flex;align-items:center;gap:9px;color:var(--blue-700);font-size:.76rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}.eyebrow>span{width:26px;height:2px;background:currentColor}.hero h1,.section-heading h2,.approach-grid h2,.cta-card h2{margin:18px 0 0;color:var(--blue-950);font-size:clamp(3.5rem,6.7vw,6.4rem);line-height:.98;letter-spacing:-.065em}.hero h1 em{color:var(--blue-700);font-style:normal}.hero-lead{max-width:680px;margin:27px 0 0;color:var(--muted);font-size:1.16rem}.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border:1px solid transparent;border-radius:13px;font-weight:850;text-decoration:none}.button-primary{color:#fff;background:var(--blue-700);box-shadow:0 14px 30px rgba(11,69,216,.2)}.button-primary:hover{background:var(--blue-800)}.button-secondary{color:var(--blue-900);border-color:#ccd7ef;background:#fff}.microcopy{margin-top:19px;color:#8490a9;font-size:.82rem}.hero-visual{position:relative;min-height:500px}.product-stack{position:relative;height:500px}.stack-card{position:absolute;width:min(100%,480px);display:grid;grid-template-columns:auto 1fr;gap:19px;align-items:center;padding:25px;border:1px solid #d9e1f0;border-radius:25px;background:rgba(255,255,255,.94);box-shadow:var(--shadow);backdrop-filter:blur(12px)}.stack-card h2{margin:3px 0 0;color:var(--blue-950);font-size:1.55rem;letter-spacing:-.04em}.stack-card p{margin:4px 0 0;color:var(--muted);font-size:.9rem}.stack-card img{border-radius:18px}.stack-hudra{right:15px;top:15px;z-index:3;transform:rotate(1.8deg)}.stack-lildra{left:0;top:178px;z-index:2;transform:rotate(-2deg)}.stack-pendra{right:20px;top:342px;z-index:1;opacity:.82;transform:rotate(1deg)}.product-glyph{width:66px;height:66px;display:grid;place-items:center;color:#fff;border-radius:18px;background:linear-gradient(145deg,#7558e8,#34206e);font-size:1.15rem;font-weight:950}.product-glyph.muted{background:linear-gradient(145deg,#4d8aa8,#24445d)}.product-glyph.large{width:84px;height:84px;border-radius:22px;font-size:1.4rem}.status{display:inline-flex;padding:4px 9px;color:#66738d;border:1px solid #d9e0eb;border-radius:999px;background:#f7f8fb;font-size:.68rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.status-live{color:#086c45;border-color:#b8e3d1;background:#eaf9f2}.status-next{color:#5738a4;border-color:#d8cef7;background:#f2efff}.hero-glow{position:absolute;border-radius:50%;filter:blur(30px);opacity:.22}.hero-glow-one{width:370px;height:370px;right:-100px;top:20px;background:#2d68ff}.hero-glow-two{width:280px;height:280px;left:38%;bottom:-160px;background:#8e75ff}.trust-strip{border-block:1px solid var(--line);background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-grid>div{display:grid;gap:2px;padding:25px 26px;border-right:1px solid var(--line)}.trust-grid>div:last-child{border-right:0}.trust-grid strong{color:var(--blue-950);font-size:.94rem}.trust-grid span{color:var(--muted);font-size:.79rem}.section{padding:108px 0}.section-soft{background:var(--soft)}.section-heading{max-width:760px;margin-bottom:50px}.section-heading h2,.approach-grid h2,.cta-card h2{font-size:clamp(2.5rem,4.9vw,4.5rem)}.section-heading p,.approach-lead{margin:22px 0 0;color:var(--muted);font-size:1.08rem}.product-grid{display:grid;grid-template-columns:1.12fr .94fr .94fr;gap:20px}.product-card{min-height:520px;padding:30px;border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;box-shadow:0 14px 36px rgba(19,37,81,.06)}.product-card-featured{background:linear-gradient(155deg,#fff,#eff4ff)}.product-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.product-card h3{margin:34px 0 0;color:var(--blue-950);font-size:2.1rem;letter-spacing:-.05em}.product-card p{color:var(--muted)}.product-tagline{margin:3px 0 22px!important;color:var(--blue-800)!important;font-size:1.05rem;font-weight:850}.availability{margin-top:38px;padding-top:20px;border-top:1px solid var(--line);font-size:.85rem;font-weight:750}.card-actions{display:flex;align-items:center;gap:20px;margin-top:35px}.text-link{color:var(--blue-700);font-weight:850;text-decoration:none}.approach-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:start}.principles{display:grid;gap:16px}.principles article{display:grid;grid-template-columns:54px 1fr;gap:19px;padding:25px;border:1px solid var(--line);border-radius:18px;background:#fff}.principles article>span{width:44px;height:44px;display:grid;place-items:center;color:var(--blue-700);border-radius:13px;background:var(--blue-50);font-size:.78rem;font-weight:950}.principles h3{margin:0;color:var(--blue-950);font-size:1.2rem}.principles p{margin:4px 0 0;color:var(--muted)}.cta-section{padding:42px 0 110px;background:var(--soft)}.cta-card{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:52px 56px;color:#fff;border-radius:var(--radius-xl);background:radial-gradient(circle at 80% 20%,#396dff 0,transparent 34%),linear-gradient(135deg,var(--blue-700),var(--blue-950));box-shadow:0 28px 60px rgba(8,35,108,.22)}.cta-card h2{color:#fff}.cta-card p{margin:16px 0 0;color:rgba(255,255,255,.78)}.eyebrow.light{color:#bcd0ff}.button-light{color:var(--blue-900);background:#fff}.site-footer{padding:68px 0 25px;color:#c8d1e8;background:#07132f}.footer-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px}.footer-brand .brand{color:#fff}.footer-brand p{max-width:420px;color:#98a6c5}.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}.footer-links div{display:grid;align-content:start;gap:11px}.footer-links strong{margin-bottom:8px;color:#fff}.footer-links a{color:#aeb9d1;text-decoration:none}.footer-links span{color:#7482a3}.footer-bottom{display:flex;justify-content:space-between;gap:30px;margin-top:55px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);color:#7f8eaf;font-size:.78rem} -@media(max-width:980px){.hero-grid,.approach-grid{grid-template-columns:1fr}.hero-copy{max-width:800px}.hero-visual{max-width:760px}.product-grid{grid-template-columns:1fr 1fr}.product-card-featured{grid-column:span 2}.trust-grid{grid-template-columns:repeat(2,1fr)}.trust-grid>div:nth-child(2){border-right:0}.trust-grid>div:nth-child(-n+2){border-bottom:1px solid var(--line)}} -@media(max-width:760px){.container{width:min(calc(100% - 28px),var(--container))}.site-nav{position:absolute;left:14px;right:14px;top:68px;display:none;padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 20px 45px rgba(8,35,108,.14)}.site-nav.open{display:grid}.menu-button{display:block}.hero{padding:64px 0}.hero h1{font-size:clamp(3rem,15vw,4.8rem)}.hero-visual,.product-stack{min-height:620px;height:620px}.stack-card{width:94%;transform:none}.stack-hudra{right:0}.stack-lildra{left:0;top:210px}.stack-pendra{right:0;top:405px}.trust-grid,.product-grid{grid-template-columns:1fr}.trust-grid>div{border-right:0;border-bottom:1px solid var(--line)}.product-card-featured{grid-column:auto}.product-card{min-height:auto}.section{padding:78px 0}.cta-card{align-items:flex-start;flex-direction:column;padding:38px 28px}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column}.card-actions{align-items:flex-start;flex-direction:column}} +:root{--blue-950:#071b4f;--blue-900:#0a286f;--blue-800:#0b399e;--blue-700:#0b45d8;--blue-600:#2462ee;--blue-100:#dce8ff;--blue-50:#f2f6ff;--lildra-950:#281052;--lildra-800:#5425a8;--lildra-700:#6d35d8;--lildra-600:#8250e8;--lildra-100:#eadfff;--lildra-50:#f8f3ff;--ink:#10182b;--muted:#61708e;--line:#dce3ef;--soft:#f6f8fc;--white:#fff;--container:1180px;--radius-lg:24px;--radius-xl:34px;--shadow:0 24px 70px rgba(8,35,108,.13)} +*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}.container{width:min(calc(100% - 42px),var(--container));margin-inline:auto}.skip-link{position:absolute;left:-9999px;top:10px;z-index:999;padding:10px 14px;background:#fff}.skip-link:focus{left:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(220,227,239,.85);background:rgba(255,255,255,.88);backdrop-filter:blur(16px)}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:inline-flex;align-items:center;gap:12px;color:var(--blue-950);font-size:1.18rem;font-weight:900;text-decoration:none;letter-spacing:-.03em}.brand-mark{width:42px;height:42px;display:grid;place-items:center;color:#fff;border-radius:13px;background:linear-gradient(145deg,var(--blue-600),var(--blue-950));box-shadow:0 10px 24px rgba(11,69,216,.22)}.site-nav{display:flex;align-items:center;gap:28px}.site-nav a{color:#3b4966;font-size:.93rem;font-weight:750;text-decoration:none}.site-nav a:hover{color:var(--blue-700)}.nav-button{padding:10px 17px;color:#fff!important;border-radius:11px;background:var(--blue-700)}.menu-button{display:none;width:44px;height:44px;padding:10px;border:0;background:transparent}.menu-button span:not(.sr-only){display:block;height:2px;margin:5px 0;background:var(--blue-950)}.hero{position:relative;overflow:hidden;padding:105px 0 96px;background:linear-gradient(180deg,#fff 0%,#f7f9ff 100%)}.hero-grid{display:grid;grid-template-columns:1.03fr .97fr;gap:75px;align-items:center}.eyebrow{display:flex;align-items:center;gap:9px;color:var(--blue-700);font-size:.76rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}.eyebrow>span{width:26px;height:2px;background:currentColor}.hero h1,.section-heading h2,.approach-grid h2,.cta-card h2{margin:18px 0 0;color:var(--blue-950);font-size:clamp(3.5rem,6.7vw,6.4rem);line-height:.98;letter-spacing:-.065em}.hero h1 em{color:var(--blue-700);font-style:normal}.hero-lead{max-width:680px;margin:27px 0 0;color:var(--muted);font-size:1.16rem}.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border:1px solid transparent;border-radius:13px;font-weight:850;text-decoration:none}.button-primary{color:#fff;background:var(--blue-700);box-shadow:0 14px 30px rgba(11,69,216,.2)}.button-primary:hover{background:var(--blue-800)}.button-secondary{color:var(--blue-900);border-color:#ccd7ef;background:#fff}.microcopy{margin-top:19px;color:#8490a9;font-size:.82rem}.hero-visual{position:relative;min-height:500px}.product-stack{position:relative;height:500px}.stack-card{position:absolute;width:min(100%,480px);display:grid;grid-template-columns:auto 1fr;gap:19px;align-items:center;padding:25px;border:1px solid #d9e1f0;border-radius:25px;background:rgba(255,255,255,.94);box-shadow:var(--shadow);backdrop-filter:blur(12px)}.stack-card h2{margin:3px 0 0;color:var(--blue-950);font-size:1.55rem;letter-spacing:-.04em}.stack-card p{margin:4px 0 0;color:var(--muted);font-size:.9rem}.stack-card img{border-radius:18px}.stack-hudra{right:15px;top:70px;z-index:3;transform:rotate(1.8deg)}.stack-lildra{left:0;top:260px;z-index:2;transform:rotate(-2deg)}.product-glyph{width:66px;height:66px;display:grid;place-items:center;color:#fff;border-radius:18px;background:linear-gradient(145deg,#7558e8,#34206e);font-size:1.15rem;font-weight:950}.product-glyph.muted{background:linear-gradient(145deg,#4d8aa8,#24445d)}.product-glyph.large{width:84px;height:84px;border-radius:22px;font-size:1.4rem}.status{display:inline-flex;padding:4px 9px;color:#66738d;border:1px solid #d9e0eb;border-radius:999px;background:#f7f8fb;font-size:.68rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.status-live{color:#086c45;border-color:#b8e3d1;background:#eaf9f2}.status-next{color:#5738a4;border-color:#d8cef7;background:#f2efff}.hero-glow{position:absolute;border-radius:50%;filter:blur(30px);opacity:.22}.hero-glow-one{width:370px;height:370px;right:-100px;top:20px;background:#2d68ff}.hero-glow-two{width:280px;height:280px;left:38%;bottom:-160px;background:#8e75ff}.trust-strip{border-block:1px solid var(--line);background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-grid>div{display:grid;gap:2px;padding:25px 26px;border-right:1px solid var(--line)}.trust-grid>div:last-child{border-right:0}.trust-grid strong{color:var(--blue-950);font-size:.94rem}.trust-grid span{color:var(--muted);font-size:.79rem}.section{padding:108px 0}.section-soft{background:var(--soft)}.section-heading{max-width:760px;margin-bottom:50px}.section-heading h2,.approach-grid h2,.cta-card h2{font-size:clamp(2.5rem,4.9vw,4.5rem)}.section-heading p,.approach-lead{margin:22px 0 0;color:var(--muted);font-size:1.08rem}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.product-card{min-height:520px;padding:30px;border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;box-shadow:0 14px 36px rgba(19,37,81,.06)}.product-card-featured{background:linear-gradient(155deg,#fff,#eff4ff)}.product-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.product-card h3{margin:34px 0 0;color:var(--blue-950);font-size:2.1rem;letter-spacing:-.05em}.product-card p{color:var(--muted)}.product-tagline{margin:3px 0 22px!important;color:var(--blue-800)!important;font-size:1.05rem;font-weight:850}.availability{margin-top:38px;padding-top:20px;border-top:1px solid var(--line);font-size:.85rem;font-weight:750}.card-actions{display:flex;align-items:center;gap:20px;margin-top:35px}.text-link{color:var(--blue-700);font-weight:850;text-decoration:none}.approach-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:start}.principles{display:grid;gap:16px}.principles article{display:grid;grid-template-columns:54px 1fr;gap:19px;padding:25px;border:1px solid var(--line);border-radius:18px;background:#fff}.principles article>span{width:44px;height:44px;display:grid;place-items:center;color:var(--blue-700);border-radius:13px;background:var(--blue-50);font-size:.78rem;font-weight:950}.principles h3{margin:0;color:var(--blue-950);font-size:1.2rem}.principles p{margin:4px 0 0;color:var(--muted)}.cta-section{padding:42px 0 110px;background:var(--soft)}.cta-card{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:52px 56px;color:#fff;border-radius:var(--radius-xl);background:radial-gradient(circle at 80% 20%,#396dff 0,transparent 34%),linear-gradient(135deg,var(--blue-700),var(--blue-950));box-shadow:0 28px 60px rgba(8,35,108,.22)}.cta-card h2{color:#fff}.cta-card p{margin:16px 0 0;color:rgba(255,255,255,.78)}.eyebrow.light{color:#bcd0ff}.button-light{color:var(--blue-900);background:#fff}.site-footer{padding:68px 0 25px;color:#c8d1e8;background:#07132f}.footer-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px}.footer-brand .brand{color:#fff}.footer-brand p{max-width:420px;color:#98a6c5}.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}.footer-links div{display:grid;align-content:start;gap:11px}.footer-links strong{margin-bottom:8px;color:#fff}.footer-links a{color:#aeb9d1;text-decoration:none}.footer-links span{color:#7482a3}.footer-bottom{display:flex;justify-content:space-between;gap:30px;margin-top:55px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);color:#7f8eaf;font-size:.78rem} +@media(max-width:980px){.hero-grid,.approach-grid{grid-template-columns:1fr}.hero-copy{max-width:800px}.hero-visual{max-width:760px}.product-grid{grid-template-columns:1fr 1fr}.trust-grid{grid-template-columns:repeat(2,1fr)}.trust-grid>div:nth-child(2){border-right:0}.trust-grid>div:nth-child(-n+2){border-bottom:1px solid var(--line)}} +@media(max-width:760px){.container{width:min(calc(100% - 28px),var(--container))}.site-nav{position:absolute;left:14px;right:14px;top:68px;display:none;padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 20px 45px rgba(8,35,108,.14)}.site-nav.open{display:grid}.menu-button{display:block}.hero{padding:64px 0}.hero h1{font-size:clamp(3rem,15vw,4.8rem)}.hero-visual,.product-stack{min-height:450px;height:450px}.stack-card{width:94%;transform:none}.stack-hudra{right:0;top:20px}.stack-lildra{left:0;top:230px}.trust-grid,.product-grid{grid-template-columns:1fr}.trust-grid>div{border-right:0;border-bottom:1px solid var(--line)}.product-card-featured{grid-column:auto}.product-card{min-height:auto}.section{padding:78px 0}.cta-card{align-items:flex-start;flex-direction:column;padding:38px 28px}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column}.card-actions{align-items:flex-start;flex-direction:column}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}} .microcopy{color:#65728c}.section[id],.cta-section[id]{scroll-margin-top:96px}.site-nav a:focus-visible,.menu-button:focus-visible,.button:focus-visible,.text-link:focus-visible,.product-card a:focus-visible,.footer-brand a:focus-visible,.footer-links a:focus-visible{outline:3px solid #6f96ff;outline-offset:4px} @media(max-width:760px){.site-nav{z-index:60}} .product-glyph-lildra{background:linear-gradient(145deg,var(--lildra-600),var(--lildra-950))} -.product-glyph-pendra{background:linear-gradient(145deg,var(--pendra-600),var(--pendra-950))} .brand-logo{width:42px;height:42px;display:block;border-radius:12px;box-shadow:0 10px 24px rgba(11,69,216,.22)} .card-actions .button{white-space:nowrap} .products-menu{position:relative} @@ -27,10 +26,6 @@ .products-popup>a:focus-visible,.stack-card[href]:focus-visible,.product-name-link:focus-visible,.product-identity-link:focus-visible,.inline-product-link:focus-visible{outline:3px solid #6f96ff;outline-offset:4px} @media(max-width:760px){.products-popup{position:static;width:100%;margin-top:8px;display:none;visibility:visible;opacity:1;box-shadow:none;transform:none}.products-menu:focus-within .products-popup{display:grid}} .product-card.product-lildra{border-color:var(--lildra-100);background:linear-gradient(155deg,#fff,var(--lildra-50))} -.product-card.product-pendra{border-color:var(--pendra-100);background:linear-gradient(155deg,#fff,var(--pendra-50))} .product-lildra .product-tagline{color:var(--lildra-800)!important} -.product-pendra .product-tagline{color:var(--pendra-800)!important} .product-lildra .status{color:var(--lildra-800);border-color:var(--lildra-100);background:var(--lildra-50)} -.product-pendra .status{color:var(--pendra-800);border-color:var(--pendra-100);background:var(--pendra-50)} -.stack-pendra{opacity:1} -.hero-glow-two{background:linear-gradient(135deg,var(--lildra-600),var(--pendra-600))} +.hero-glow-two{background:var(--lildra-600)} diff --git a/docs/architecture.md b/docs/architecture.md index 743c7d8..98f9073 100644 --- a/docs/architecture.md +++ b/docs/architecture.md @@ -1,3 +1,3 @@ ## Product page styling -Hudra remains the current foundation for product and legal-page layout. Lildra loads that stable foundation through its own theme stylesheets, then overrides product colour tokens and adds only Lildra-specific visuals. This is an intentional transitional convention for the two current products. Before Pendra is added, extract genuinely shared product foundations into neutral shared styles rather than introducing another product-to-product dependency. +Hudra remains the current foundation for product and legal-page layout. Lildra loads that stable foundation through its own theme stylesheets, then overrides product colour tokens and adds only Lildra-specific visuals. This is an intentional transitional convention for the two current products. Before another product is added, extract genuinely shared product foundations into neutral shared styles rather than introducing another product-to-product dependency. diff --git a/docs/decisions/0004-shared-css-strategy.md b/docs/decisions/0004-shared-css-strategy.md index 98a02dc..d54fba6 100644 --- a/docs/decisions/0004-shared-css-strategy.md +++ b/docs/decisions/0004-shared-css-strategy.md @@ -2,7 +2,7 @@ Status Accepted Context -Hudra, Lildra and Pendra share navigation and branding. +Hudra and Lildra share navigation and branding, and future products are expected to follow the same ecosystem conventions. Decision Shared CSS lives in /css/ecosystem.css. @@ -11,4 +11,4 @@ Product-specific CSS stays beside each product. Consequences - less duplication - consistent branding -- easier Codex sessions \ No newline at end of file +- easier Codex sessions diff --git a/docs/future-products.md b/docs/future-products.md new file mode 100644 index 0000000..fe03aee --- /dev/null +++ b/docs/future-products.md @@ -0,0 +1,16 @@ +# Future product material + +This document preserves product concepts that are not approved for publication on the public website. Material here must remain off public site pages unless an explicit teaser or launch decision is made. + +## Pendra + +Pendra is planned as a simpler path for bringing completed presentation slides into QLearn. + +Previously drafted public copy: + +- Short description: "Bring completed slide decks into QLearn more easily." +- Tagline: "A simpler path from slides to QLearn." +- Product description: "Pendra is planned as a tool for bringing completed presentation slides into QLearn pages without rebuilding them one image at a time." +- Availability: "Planned after Lildra." + +Previously drafted visual treatment used a six-sided `Pe` glyph, a magenta palette and a planned-product status label. The implementation remains recoverable from Git history if a future marketing decision approves a teaser. diff --git a/index.html b/index.html index 211b742..158644f 100644 --- a/index.html +++ b/index.html @@ -67,10 +67,6 @@ Lildra logo
Available

Lildra

Keep the lesson page and hide the surrounding QLearn clutter.

-
- -
Planned

Pendra

Bring completed slide decks into QLearn more easily.

-
@@ -90,7 +86,7 @@
Products

A growing family of focused lesson tools.

-

Hudra and Lildra are available now, with Pendra planned next.

+

Hudra and Lildra are available now.

@@ -119,16 +115,6 @@ -
-
- - Planned -
-

Pendra

-

A simpler path from slides to QLearn.

-

Pendra is planned as a tool for bringing completed presentation slides into QLearn pages without rebuilding them one image at a time.

-

Planned after Lildra.

-
@@ -165,7 +151,7 @@

Focused browser tools for better digital lessons.