.scope{margin-top:80px;padding-top:72px;border-top:1px solid #dce4da}.scope-heading{max-width:740px}.scope h2{font-size:clamp(33px,4.6vw,48px);line-height:1.14;letter-spacing:-.04em;font-weight:600;margin:0 0 26px;text-wrap:balance}.scope h2 em{color:#246b45;font-weight:500}.scope-heading>p{font-size:18px;line-height:1.65;color:#536158;max-width:610px;margin:0}.scope-options{margin-top:55px}.scope-option{display:grid;grid-template-columns:1fr 1.2fr;gap:55px;padding:34px 0;border-top:1px solid #dce4da}.scope-option h3{font-size:29px;font-weight:550;line-height:1.2;letter-spacing:-.03em;margin:0;text-wrap:balance}.scope-option h3 em{display:block;font-weight:500;color:#246b45}.scope-option p{margin:0;font-size:16px;color:#536158;line-height:1.7}.scope-option .scope-value{color:#246b45;margin-top:15px;font-size:15px}.scope-agreement{font-size:14px;color:#536158;line-height:1.7;max-width:620px;margin:26px 0}.scope-link{display:inline-flex;align-items:center;gap:15px;color:#246b45;font-size:16px;font-weight:550;text-decoration-thickness:1px;text-underline-offset:6px;min-height:48px}.scope-link svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0}
@media(max-width:600px){.scope{margin-top:55px;padding-top:44px}.scope h2{font-size:34px}.scope-heading>p{font-size:17px}.scope-options{margin-top:36px}.scope-option{grid-template-columns:1fr;gap:18px;padding:29px 0}.scope-option h3{font-size:28px}.scope-option h3 em{display:inline}.scope-option p{font-size:16px}.scope-agreement{margin-top:20px}.scope-link{font-size:15px}}

.time-demo{margin-top:48px}.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-bottom:22px}.calendar-title{font-size:17px;font-weight:550;line-height:1.4}.calendar-title>span{display:block;font-size:12px;color:#536158;font-weight:400;margin-top:4px}.calendar-switch{display:flex;background:#e9eee5;padding:4px;border-radius:30px;gap:3px}.calendar-switch button{font:inherit;font-size:13px;padding:11px 18px;border:0;background:transparent;border-radius:25px;color:#536158;cursor:pointer;min-height:44px;transition:transform 120ms ease-out}.calendar-switch button[aria-pressed=true]{background:#246b45;color:#fff}.calendar-switch button:active{transform:scale(.97)}.calendar-window{border:1px solid #d6dfd1;background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 20px 45px -35px #25433345}.calendar-days{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#f3f6ef;border-bottom:1px solid #dce4da}.calendar-days span{padding:18px 15px;font-size:13px;color:#536158;border-right:1px solid #dce4da}.calendar-days span:last-child{border:0}.calendar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,104px);gap:0;position:relative;padding:9px;background:repeating-linear-gradient(90deg,transparent 0 calc(33.333% - 1px),#edf0e9 calc(33.333% - 1px) 33.333%)}.calendar-slot{margin:6px;padding:13px 14px;min-width:0;border-radius:7px}.calendar-slot>span{display:block;font-size:11px;margin-bottom:6px}.calendar-slot>strong{font-size:14px;line-height:1.35;font-weight:500;display:block}.lesson{background:#e9eee4;color:#304333}.lesson>span{color:#536158}.enrollment{background:#246b45;color:#fafbf8;position:relative;z-index:2}.enrollment>span{color:#d9e7d2}.calendar-space{grid-column:1/-1;grid-row:2/4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:11px;position:relative;opacity:0;transform:translateY(10px);pointer-events:none;color:#246b45}.calendar-space>strong{font-size:30px;font-weight:550;line-height:1.12;letter-spacing:-.035em}.calendar-space em{font-weight:450}.calendar-space>span:last-child{font-size:13px;color:#536158}.space-mark{display:grid;place-items:center;width:32px;height:32px;border:1px solid #c4d3bc;border-radius:50%;transform:rotate(-40deg)}.space-mark svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}.time-demo[data-mode=team] .enrollment{opacity:0;transform:translateY(-14px) scale(.96);pointer-events:none}.time-demo[data-mode=team] .calendar-space{opacity:1;transform:translateY(0)}.calendar-result{font-size:15px;color:#536158;line-height:1.6;margin:20px 0 0;min-height:48px;max-width:630px}.scope-alternative{margin-top:32px;border-top:1px solid #dce4da;border-bottom:1px solid #dce4da;padding:20px 0}.scope-alternative summary{font-size:16px;font-weight:500;cursor:pointer;color:#246b45;line-height:1.5;min-height:44px;align-content:center}.scope-alternative p{color:#536158;font-size:16px;line-height:1.65;max-width:650px;margin:15px 0 0}.scope-alternative summary:focus-visible{outline:2px solid #246b45;outline-offset:5px}
@media(prefers-reduced-motion:no-preference){.enrollment{transition:transform 500ms cubic-bezier(.16,1,.3,1),opacity 300ms ease-out;transition-delay:calc(var(--order)*35ms)}.calendar-space{transition:transform 500ms cubic-bezier(.16,1,.3,1),opacity 300ms ease-out}.time-demo[data-mode=team] .calendar-space{transition-delay:220ms}.motion-paused .time-demo *{transition:none}}
@media(max-width:600px){.time-demo{margin-top:33px}.calendar-toolbar{flex-direction:column;align-items:flex-start;gap:18px}.calendar-switch{align-self:center}.calendar-title{font-size:16px}.calendar-title>span{font-size:11px}.calendar-days span{padding:14px 7px;text-align:center;font-size:11px}.calendar-grid{grid-template-rows:repeat(3,97px);padding:4px}.calendar-slot{margin:4px;padding:10px 7px;border-radius:5px}.calendar-slot>span{font-size:9px;margin-bottom:5px}.calendar-slot>strong{font-size:11px;line-height:1.4}.calendar-space>strong{font-size:27px}.calendar-space>span:last-child{font-size:12px}.calendar-space{gap:10px}.calendar-result{font-size:14px;min-height:68px}.scope-alternative{margin-top:20px}.scope-alternative summary{font-size:15px}.scope-agreement{font-size:13px}}

.calendar-slot:nth-child(-n+3){grid-row:1}.calendar-slot:nth-child(n+4):nth-child(-n+6){grid-row:2}.calendar-slot:nth-child(n+7){grid-row:3}.calendar-slot:nth-child(3n+1){grid-column:1}.calendar-slot:nth-child(3n+2){grid-column:2}.calendar-slot:nth-child(3n){grid-column:3}

.calendar-scroll{margin-top:42px}.calendar-scroll .time-demo{margin-top:0}.calendar-toolbar{margin-bottom:18px}.calendar-title{font-size:15px}.calendar-scroll.scroll-enabled{height:175svh;min-height:900px}.scroll-enabled>.time-demo{position:sticky;top:max(30px,calc(50svh - 215px))}.time-demo.is-scrubbing .enrollment,.time-demo.is-scrubbing .calendar-space{transition:none}.calendar-space>span:last-child{max-width:240px}.scope-heading h2{margin-bottom:0}
@media(max-width:600px){.calendar-scroll{margin-top:32px}.calendar-toolbar{flex-direction:row;align-items:center;gap:10px}.calendar-title{font-size:12px;max-width:90px}.calendar-switch button{font-size:11px;padding:10px 12px}.calendar-switch{align-self:auto}.calendar-scroll.scroll-enabled{min-height:0;height:165svh}.scroll-enabled>.time-demo{top:max(30px,calc(50svh - 190px))}}
@media(prefers-reduced-motion:reduce){.calendar-scroll.scroll-enabled{height:auto;min-height:0}.scroll-enabled>.time-demo{position:relative;top:auto}}
@media(max-height:520px){.calendar-scroll.scroll-enabled{height:auto;min-height:0}.scroll-enabled>.time-demo{position:relative;top:auto}}

.time-demo.calendar-keyboard .enrollment,.time-demo.calendar-keyboard .calendar-space{transition:none}

/* Share the fixed scene viewport instead of changing the scroll runway with browser chrome. */
.calendar-scroll.scroll-enabled{height:calc(var(--scene-viewport-height,100svh) * 1.75)}
.scroll-enabled>.time-demo{top:max(30px,calc(var(--scene-viewport-height,100svh) / 2 - 215px))}
@media(max-width:600px){.calendar-scroll.scroll-enabled{height:calc(var(--scene-viewport-height,100svh) * 1.65)}.scroll-enabled>.time-demo{top:max(30px,calc(var(--scene-viewport-height,100svh) / 2 - 190px))}}
@media(max-height:520px){.calendar-scroll.scroll-enabled{height:auto;min-height:0}.scroll-enabled>.time-demo{position:relative;top:auto}}
@media(prefers-reduced-motion:reduce){.calendar-scroll.scroll-enabled{height:auto;min-height:0}.scroll-enabled>.time-demo{position:relative;top:auto}}

/* One native view timeline for the scene, not one JavaScript writer per animated tile. */
@keyframes calendar-native-out{from{opacity:1;transform:translate3d(0,0,0) scale(1)}to{opacity:0;transform:translate3d(0,-14px,0) scale(.98)}}
@keyframes calendar-native-space{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@supports(animation-timeline:view()){
 .calendar-scroll.native-calendar{view-timeline-name:--calendar-scene;view-timeline-axis:block;view-timeline-inset:var(--calendar-top) calc(100% - var(--calendar-top) - var(--calendar-scene))}
 .native-calendar:not(.manual-calendar) .enrollment{animation:calendar-native-out 1s linear both;animation-timeline:--calendar-scene;animation-range:contain var(--task-start) contain var(--task-end);transition:none}
 .native-calendar:not(.manual-calendar) .calendar-space{animation:calendar-native-space 1s linear both;animation-timeline:--calendar-scene;animation-range:contain 76% contain 91%;transition:none}
 .motion-paused .native-calendar .enrollment,.motion-paused .native-calendar .calendar-space{animation-play-state:paused}
}
