:root{color-scheme:light;--bg:#f6f5ee;--surface:#fffefa;--ink:#143548;--muted:#4d616c;--accent:#155d55;--hover:#0c4943;--mint:#e4eee7;--line:#d4ddd6;--radius:12px;--ease:cubic-bezier(.2,.65,.25,1);--font:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.6 var(--font);-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure,dl,dd{margin:0}h1,h2,h3{line-height:1.2;font-weight:600}h1{font-size:clamp(38px,4vw,54px);letter-spacing:-.035em}h2{font-size:32px;letter-spacing:-.025em}h3{font-size:20px;letter-spacing:-.01em}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid #ad602a;outline-offset:5px}[tabindex="-1"]:focus{outline:none}svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}::selection{background:#c6ded0}.wrap{width:min(1120px,calc(100% - 80px));margin-inline:auto}.section-space{padding-block:72px}.mobile-only,.menu-toggle{display:none}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:54px;padding:14px 24px;border-radius:10px;background:var(--accent);color:#fff;font-weight:600;font-size:16px;transition:background .2s,transform .2s,box-shadow .2s}@media(hover:hover) and (pointer:fine){.button:hover{background:var(--hover);transform:translateY(-2px);box-shadow:0 6px 16px #155d551b}}.button:active{transform:translateY(0);box-shadow:none}.button span,.text-link span{display:inline-block;transition:transform .25s var(--ease)}@media(hover:hover) and (pointer:fine){.button:hover span{transform:translateX(4px)}}.text-link{display:inline-flex;align-items:center;gap:14px;min-height:48px;color:var(--accent);font-size:16px;font-weight:600}@media(hover:hover) and (pointer:fine){.text-link:hover{text-decoration:underline;text-underline-offset:5px}}@media(hover:hover) and (pointer:fine){.text-link:hover span{transform:translateY(3px)}}.skip-link{position:fixed;top:-100px;left:16px;padding:12px 20px;background:var(--ink);color:#fff;z-index:20}.skip-link:focus{top:12px}
.button.mobile-only{display:none}
.site-header{background:var(--surface);border-bottom:1px solid var(--line)}.header-inner{height:90px;display:flex;justify-content:space-between;align-items:center;gap:24px}.brand-lockup{display:flex;align-items:center;gap:18px;min-height:48px;flex-shrink:0}.brand-lockup>span{font-size:24px;color:#aab8b9;font-weight:400}nav{display:flex;gap:28px;align-items:center;font-size:15px}nav>a{min-height:48px;display:flex;align-items:center}@media(hover:hover) and (pointer:fine){nav>a:not(.button):hover{color:var(--accent);text-decoration:underline;text-underline-offset:6px}}.button-small{min-height:46px;padding:10px 19px;font-size:15px;gap:16px}.collaboration{padding-top:24px;color:var(--muted);font-size:14px}.collaboration>span{padding-inline:6px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding-block:32px 48px}.hero-copy{min-width:0}.date-label{font-size:15px;font-weight:600;color:var(--accent);margin-bottom:20px}.date-label>span{padding-inline:5px}.hero-description{color:var(--muted);margin-top:24px;font-size:18px;line-height:1.7;max-width:485px}.hero .text-link{margin-top:20px}.hero-image{height:415px;border-radius:18px;overflow:hidden;background:#dfe6d9}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:40% center;animation:photo-in 1.2s var(--ease) both}.enrollment{display:grid;grid-template-columns:1fr 330px;gap:48px;align-items:center;background:var(--mint);padding:32px 40px;border-radius:var(--radius);scroll-margin-top:24px}.enrollment h2{font-size:28px;margin-bottom:12px}.enrollment-copy>p{max-width:530px;color:var(--muted)}.code-reminder{display:flex;gap:12px;align-items:flex-start;margin-top:26px}.code-reminder svg{margin-top:4px;color:var(--accent)}.code-reminder p{font-size:16px;line-height:1.6}.code-reminder strong{font-weight:600}.enrollment-download{display:flex;flex-direction:column;align-items:center}.qr{width:184px;height:184px;border-radius:8px;background:white;image-rendering:pixelated}.store-links{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap;justify-content:center}.store-links a{display:block;min-height:48px;border-radius:7px;filter:brightness(1);transition:filter .25s ease}@media(hover:hover) and (pointer:fine){.store-links a:hover{filter:brightness(1.25)}}.store-links a:active{filter:brightness(.9)}.store-links img{width:148px;height:50px}.snapshot-section{padding-top:50px}.snapshot-section h2{font-size:22px;margin-bottom:24px}.snapshot{display:grid;grid-template-columns:1.1fr .9fr .65fr 1.35fr;border-block:1px solid var(--line);padding-block:24px}.snapshot>div{padding-inline:24px;border-left:1px solid var(--line)}.snapshot>div:first-child{padding-left:0;border:0}.snapshot>div:last-child{padding-right:0}.snapshot dt{font-size:15px;color:var(--muted);margin-bottom:5px}.snapshot dd{font-size:17px;font-weight:600;line-height:1.5}.activities-section h2{margin-bottom:36px}.activities{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}.activity-icon{width:52px;height:52px;border-radius:50%;background:var(--mint);display:grid;place-items:center;color:var(--accent);margin-bottom:20px}.activity-icon svg{width:28px;height:28px}.activity h3{font-size:18px;letter-spacing:.035em;margin-bottom:10px}.activity p{max-width:300px;color:var(--muted)}.activity:nth-child(2){transition-delay:90ms}.activity:nth-child(3){transition-delay:180ms}.inclusive{display:flex;gap:16px;align-items:flex-start;margin-top:40px;border-top:1px solid var(--line);padding-top:26px}.inclusive svg{color:var(--accent);margin-top:2px}.inclusive h3{font-size:18px;margin-bottom:7px}.inclusive p{font-size:17px;color:var(--muted)}.join-section{background:var(--surface);border-block:1px solid var(--line)}.join-grid{display:grid;grid-template-columns:1fr 340px;gap:100px;align-items:center}.join-steps{list-style:none;margin:28px 0 0;padding:0}.join-steps li{display:flex;gap:16px;align-items:center;min-height:64px;padding:12px 0}.join-steps li>span{width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:var(--mint);font-size:16px;color:var(--accent);font-weight:600}.join-steps p{font-size:18px}.pre-enroll{margin-top:28px;padding-top:26px;border-top:1px solid var(--line)}.pre-enroll h3{font-size:18px;margin-bottom:10px}.pre-enroll p{font-size:17px;color:var(--muted);margin-top:8px}.join-download{text-align:center;padding:34px 14px;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius)}.join-download .qr{width:204px;height:204px;margin:0 auto 18px}.join-download p{font-size:17px;color:var(--muted)}.join-download .store-links{gap:10px}.join-download .store-links img{width:140px;height:auto}.about-section{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.about-copy p{margin-top:22px;color:var(--muted);max-width:480px}.product-visual{height:330px;display:flex;align-items:center;justify-content:center;background:var(--mint);border-radius:18px;overflow:hidden;padding:20px}.product-visual img{width:280px;max-height:100%;object-fit:contain}.support-section{background:var(--mint)}.support-section h2{margin-bottom:30px}.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.support-grid h3{font-size:18px;line-height:1.5;max-width:470px}.support-grid p{color:var(--muted);margin-top:12px;font-size:17px}.support-grid .text-link{margin-top:10px;text-decoration:underline;text-underline-offset:5px;font-size:18px}.site-footer{display:flex;align-items:center;justify-content:space-between;padding-block:24px;font-size:14px;color:var(--muted)}.site-footer .text-link{font-size:14px}
.enter{animation:content-in .7s var(--ease) both}.hero-copy>*:nth-child(2){animation-delay:.1s}.hero-copy>*:nth-child(3){animation-delay:.2s}.hero-copy>*:nth-child(4){animation-delay:.3s}.hero-image.enter{animation-delay:.15s}.reveal{transition:opacity .65s var(--ease),transform .65s var(--ease)}.will-reveal{opacity:0;transform:translateY(26px)}@keyframes content-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes photo-in{from{transform:scale(1.04)}to{transform:scale(1)}}
@media(max-width:1000px){.wrap{width:calc(100% - 56px)}nav{gap:18px;font-size:14px}.brand-lockup{gap:12px}.brand-lockup img:first-child{width:125px}.brand-lockup img:last-child{width:95px}.hero{gap:32px}.hero-image{height:400px}.enrollment{padding:30px;gap:30px;grid-template-columns:1fr 310px}.snapshot>div{padding-inline:16px}.snapshot dd{font-size:16px}.join-grid{gap:48px;grid-template-columns:1fr 320px}.activities{gap:32px}.about-section{gap:48px}.support-grid{gap:48px}}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}.section-space{padding-block:48px}.desktop-only{display:none!important}.mobile-only{display:block}h1{font-size:38px;line-height:1.12}h2{font-size:28px}.header-inner{height:78px;position:relative}.brand-lockup{gap:12px}.brand-lockup img:first-child{width:118px}.brand-lockup img:last-child{width:90px}.brand-lockup>span{font-size:19px}.menu-toggle{display:flex;gap:9px;align-items:center;min-height:44px;background:none;border:0;padding:0 0 0 8px;font-size:14px;color:var(--ink)}.menu-toggle>span{font-size:23px;transition:transform .25s}.menu-toggle[aria-expanded=true]>span{transform:rotate(45deg)}nav{display:none;position:absolute;z-index:5;top:78px;left:-20px;right:-20px;background:var(--surface);padding:12px 20px 20px;flex-direction:column;gap:2px;align-items:stretch;border-bottom:1px solid var(--line);box-shadow:0 15px 20px #14354810}nav.is-open{display:flex}nav>a{padding:10px 8px;font-size:16px}nav>.button{margin-top:8px}.collaboration{font-size:12px;line-height:1.7;padding-top:18px;max-width:440px}.collaboration span{padding-inline:3px}.hero{grid-template-columns:minmax(0,1fr);gap:26px;padding-block:24px 30px}.date-label{font-size:13px;margin-bottom:16px}.date-label>span{padding-inline:3px}.hero-description{font-size:17px;line-height:1.6;margin-top:20px}.hero .text-link{margin-top:12px}.hero-image{height:270px;border-radius:12px}.hero-image img{object-position:40% center}.enrollment{grid-template-columns:minmax(0,1fr);padding:26px 24px;gap:0}.enrollment h2{font-size:25px}.enrollment-copy>p{font-size:17px}.code-reminder{margin-top:22px;gap:10px}.code-reminder p{font-size:15px}.code-reminder svg{width:23px}.enrollment-download{align-items:stretch}.store-links{gap:10px;margin-top:22px}.store-links img{width:140px;height:auto}.store-links a{min-height:47px}.snapshot-section{padding-top:36px}.snapshot-section h2{font-size:22px;margin-bottom:18px}.snapshot{grid-template-columns:1fr 1fr;gap:24px 20px;padding-block:22px}.snapshot>div{border:0;padding:0}.snapshot dt{font-size:14px}.snapshot dd{font-size:16px}.activities-section h2{margin-bottom:26px}.activities{grid-template-columns:1fr;gap:24px}.activity{display:grid;grid-template-columns:48px 1fr;column-gap:17px;align-items:start}.activity-icon{grid-row:1/3;width:46px;height:46px;margin:0}.activity-icon svg{width:25px;height:25px}.activity h3{font-size:17px;margin:1px 0 7px}.activity p{font-size:17px;max-width:none}.inclusive{margin-top:28px;padding-top:24px;gap:13px}.inclusive h3{font-size:17px;line-height:1.4}.inclusive p{font-size:16px}.join-grid{grid-template-columns:minmax(0,1fr);gap:30px}.join-steps{margin-top:22px}.join-steps li{gap:14px;padding:13px 0;min-height:60px}.join-steps p{font-size:17px}.pre-enroll{margin-top:22px;padding-top:24px}.pre-enroll h3{font-size:18px}.pre-enroll p{font-size:16px}.join-download{padding:0;border:0;background:none}.join-download .store-links{margin-top:18px}.about-section{grid-template-columns:minmax(0,1fr);gap:28px}.about-copy p{font-size:17px;margin-top:16px}.product-visual{height:280px;border-radius:12px}.product-visual img{width:245px}.support-section h2{margin-bottom:25px}.support-grid{grid-template-columns:1fr;gap:25px}.support-grid article+article{border-top:1px solid #b9cec0;padding-top:24px}.support-grid h3{font-size:17px}.support-grid p,.support-grid .text-link{font-size:16px}.site-footer{padding-block:18px;font-size:13px}.site-footer .text-link{font-size:13px}}
@media(max-width:370px){.wrap{width:calc(100% - 32px)}.brand-lockup{gap:8px}.brand-lockup img:first-child{width:102px}.brand-lockup img:last-child{width:80px}.header-inner{gap:12px}h1{font-size:34px}.date-label{font-size:12px}.enrollment{padding:24px 20px}.store-links img{width:118px}.store-links a{display:flex;align-items:center;min-height:44px}.snapshot{gap:20px 16px}.snapshot dd{font-size:15px}.menu-toggle{font-size:13px}.enrollment h2{font-size:23px}}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;--bg:#12242d;--surface:#172c35;--ink:#f3f5ef;--muted:#c0cfd1;--accent:#a1d4c3;--hover:#bae6d7;--mint:#233e43;--line:#3a5357}.button{background:#acd6c4;color:#143a32}@media(hover:hover) and (pointer:fine){.button:hover{background:#c5e6d7}}.brand-lockup{background:#fffefa;padding:7px 10px;border-radius:6px}.text-link{color:#b4e0cf}.qr{background:#fff}.activity-icon{background:#304d50}.support-grid article+article{border-color:var(--line)}@media(max-width:720px){.brand-lockup{padding:6px;gap:8px}.brand-lockup img:first-child{width:108px}.brand-lockup img:last-child{width:82px}}@media(max-width:370px){.brand-lockup img:first-child{width:92px}.brand-lockup img:last-child{width:71px}}}

/* Scoped activity cards: the rest of the page keeps its existing layout. */
.activities-section .activities {
  gap: 20px;
}
.activities-section .activity {
  position: relative;
  min-width: 0;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  transition: opacity .55s var(--ease), transform .3s var(--ease), border-color .25s;
}
/* Hover affects only the illustration, not the card or its contents. */
.activities-section .activity:nth-child(2) { transition-delay: 80ms; }
.activities-section .activity:nth-child(3) { transition-delay: 160ms; }
.book-covers, .book-leaf {
  transform-box: view-box;
  transform-origin: 16px 16px;
}
.book-covers { transform: scaleX(.85); transition: transform .3s var(--ease); }
.book-lines { opacity: 0; transition: opacity .25s; stroke-width: 1.1; }
.book-leaf { opacity: 0; fill: var(--mint); }
.move-symbol { transform-box: view-box; transform-origin: 5px 24px; }
.trophy-symbol { transform-origin: 50% 80%; }
@media (hover: hover) and (pointer: fine) {
  .activity:hover .book-covers { transform: scaleX(1); }
  .activity:hover .book-lines { opacity: .65; }
  .activity:hover .book-leaf { animation: book-page-turn .9s ease-in-out both; }
  .activity:hover .move-symbol { animation: move-grow .85s cubic-bezier(.22, 1, .36, 1) both; }
  .activity:hover .trophy-symbol { animation: trophy-celebrate .8s ease-in-out both; }
}
@keyframes book-page-turn {
  0%, 12% { opacity: 0; transform: scaleX(1); }
  25% { opacity: 1; transform: scaleX(1); }
  65% { opacity: 1; transform: scaleX(-.85); }
  100% { opacity: 0; transform: scaleX(-1); }
}
@keyframes move-grow {
  from { transform: scale(.35); opacity: .4; }
  to { transform: scale(1); opacity: 1; }
}
@keyframes trophy-celebrate {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-10deg); }
  50% { transform: rotate(8deg); }
  75% { transform: rotate(-3deg); }
}
@media (max-width: 1000px) and (min-width: 721px) {
  .activities-section .activity { padding: 22px; }
}
@media (max-width: 720px) {
  .activities-section .activities { gap: 14px; }
  .activities-section .activity { padding: 22px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .activity:hover .book-covers { transform: scaleX(.85); }
  .activity:hover .book-lines { opacity: 0; }
}

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

/* Calendar marker; retain the existing pre-enrollment typography and surface. */
.pre-enroll {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.enrollment-calendar {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  text-align: center;
  background: var(--surface);
  color: var(--ink);
}
.enrollment-calendar span {
  display: block;
  padding: 5px 0;
  background: var(--mint);
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .12em;
}
.enrollment-calendar strong {
  display: block;
  padding: 7px 0 9px;
  font-size: 32px;
  line-height: 1;
  font-weight: 600;
}
@media (max-width: 720px) {
  .pre-enroll { grid-template-columns: 54px minmax(0, 1fr); gap: 14px; }
  .enrollment-calendar strong { font-size: 28px; }
  .enrollment-calendar span { font-size: 11px; }
}

/* Hero navigation: a clear secondary action with a directional cue. */
.hero .hero-join-link {
  gap: 24px;
  min-height: 58px;
  margin-top: 24px;
  padding: 8px 9px 8px 20px;
  border: 1px solid var(--accent);
  border-radius: 12px;
  transition: background .25s var(--ease), border-color .25s var(--ease);
}
.hero-join-link .hero-join-arrow {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--mint);
  transition: background .25s var(--ease), color .25s var(--ease);
}
.hero-join-arrow svg {
  width: 20px;
  height: 20px;
  transition: transform .25s var(--ease);
}
@media (hover: hover) and (pointer: fine) {
.hero .hero-join-link:hover {
  background: var(--mint);
  text-decoration: none;
}
.hero-join-link:hover .hero-join-arrow {
  transform: none;
  background: var(--accent);
  color: var(--surface);
}
.hero-join-link:hover .hero-join-arrow svg { transform: translateY(2px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-join-link:hover .hero-join-arrow svg { transform: none; }
}

/* Two authentic app screens unfold; the surrounding section stays unchanged. */
.product-visual {
  position: relative;
  isolation: isolate;
  height: 360px;
  padding: 0;
}
.product-rings { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.product-rings span {
  position: absolute;
  width: 310px;
  aspect-ratio: 1;
  border: 1px solid var(--accent);
  border-radius: 50%;
  opacity: .12;
  transition: transform .8s var(--ease);
}
.product-rings span:nth-child(1) { left: -155px; top: -110px; }
.product-rings span:nth-child(2) { width: 390px; right: -170px; bottom: -235px; }
.product-rings span:nth-child(3) { width: 285px; right: -118px; bottom: -182px; background: var(--accent); opacity: .035; }
.product-phones { position: absolute; inset: 0; pointer-events: none; }
.product-visual .product-phone {
  position: absolute;
  top: 48%;
  left: 50%;
  width: clamp(112px, 30%, 146px);
  height: auto;
  max-height: none;
  object-fit: contain;
  transition: transform .65s cubic-bezier(.22,.7,.18,1);
}
.product-visual .phone-learn {
  z-index: 2;
  transform: translate(-79%, -50%) rotate(-10deg) scale(.94);
}
.product-visual .phone-challenges {
  z-index: 1;
  transform: translate(-18%, -50%) rotate(10deg) scale(.9);
  transition-delay: 45ms;
}
@media (min-width: 721px) and (hover: hover) and (pointer: fine) {
  .product-visual:hover .phone-learn { transform: translate(calc(-100% - 10px), -51%) rotate(0deg) scale(1.03); }
  .product-visual:hover .phone-challenges { transform: translate(10px, -51%) rotate(0deg) scale(1.03); }
  .product-visual:hover .product-rings span:nth-child(1) { transform: translate(18px, 12px); }
  .product-visual:hover .product-rings span:nth-child(2) { transform: translate(-22px, -14px); }
  .product-visual:hover .product-rings span:nth-child(3) { transform: translate(-12px, -8px); }
}
@media (max-width: 720px) {
  .product-visual { height: 330px; }
  .product-visual .product-phone { width: clamp(110px, 34%, 138px); top: 46%; }
}
@media (prefers-reduced-motion: reduce) {
  .product-visual .product-phone, .product-rings span { transition: none; }
}

/* Plain horizontal arrow in the hero action. */
.hero-join-link .hero-join-arrow {
  width: 28px;
  height: 28px;
  border-radius: 0;
  background: transparent;
  color: inherit;
}
.hero .hero-join-link { padding-right: 18px; }
@media (hover: hover) and (pointer: fine) {
  .hero-join-link:hover .hero-join-arrow { background: transparent; color: inherit; }
  .hero-join-link:hover .hero-join-arrow svg { transform: translateX(3px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-join-link:hover .hero-join-arrow svg { transform: none; }
}

/* Mobile preview stays unfolded after its first entrance; also works without JS. */
@media (max-width: 720px) {
  .product-visual .product-phone { transition-duration: .8s; }
  .product-visual .phone-learn { transform: translate(calc(-100% - 6px), -50%) rotate(0deg) scale(1); }
  .product-visual .phone-challenges { transform: translate(6px, -50%) rotate(0deg) scale(1); }
  .product-visual .product-rings span:nth-child(1) { transform: translate(18px, 12px); }
  .product-visual .product-rings span:nth-child(2) { transform: translate(-22px, -14px); }
  .product-visual .product-rings span:nth-child(3) { transform: translate(-12px, -8px); }
}
@media (max-width: 720px) and (prefers-reduced-motion: no-preference) {
  .product-visual.preview-pending .phone-learn { transform: translate(-79%, -50%) rotate(-10deg) scale(.94); }
  .product-visual.preview-pending .phone-challenges { transform: translate(-18%, -50%) rotate(10deg) scale(.9); }
  .product-visual.preview-pending .product-rings span { transform: none; }
}
