/* Annual plan: shared green brand, core course sections plus team and space support.
   Design variance 4 / motion 4 (brand video and software) / density 5.
   Cards and media use 16px corners; shared CTA treatment stays unchanged. */
.annual-detail{--plan-accent:var(--green-dark)}
body:has(.annual-detail)>.skip-link{color:var(--white)}
.annual-detail [id]{scroll-margin-top:96px}
.annual-detail .primary{background:var(--green-dark);color:#fcfefd}
.annual-detail .primary:hover{background:#095b36}
.annual-detail .outline{color:var(--plan-accent)}
.annual-detail :is(summary,button,a):focus-visible{outline:3px solid var(--plan-accent);outline-offset:4px}
.annual-detail .page-title{max-width:800px;margin-bottom:36px}
.annual-detail .page-title h2{font-size:clamp(32px,3.4vw,46px);line-height:1.2}
.annual-intro{position:relative;padding-top:64px;padding-bottom:64px;align-items:center;gap:0;min-height:482px;background:#091510;color:#fcfefd;overflow:hidden}
.annual-intro .sub-hero-copy{position:relative}
.annual-intro .sub-kicker{color:#98edbf}
.annual-intro h1{font-size:clamp(40px,4.5vw,62px);line-height:1.12;letter-spacing:-.04em}
.annual-intro .hero-actions{margin-top:28px}
.annual-intro .mentor-intro strong{display:block;font-size:23px;line-height:1.4;color:#a5f4c9;margin-bottom:10px}
.annual-intro .mentor-intro span{display:block;font-size:17px;line-height:1.7;max-width:530px;color:#e4eee8}
.annual-intro .outline{color:#fcfefd;border-color:#aed9c0;background:rgba(9,21,16,.24)}
.annual-intro :is(a,button):focus-visible{outline-color:#98edbf}
.annual-intro-media{position:absolute;inset:0;overflow:hidden;background:#091510}
.annual-brand-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.annual-video-mask{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,22,15,.86),rgba(5,22,15,.7) 46%,rgba(5,22,15,.38))}
.video-status{position:absolute;right:20px;bottom:20px;font-size:13px;color:#fcfefd;background:#091510;padding:12px 18px;border-radius:8px}
.video-status[hidden]{display:none}
.learning-equal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:stretch}
.learning-time,.learning-benefits{min-width:0;padding:32px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.learning-time{display:flex;flex-direction:column}
.learning-equal-grid h2{font-size:clamp(28px,2.4vw,34px);line-height:1.3;letter-spacing:-.03em;margin:0 0 30px}
.time-hours{padding:0;margin-bottom:36px;flex:1;display:flex;flex-direction:column;justify-content:center}
.time-hours>span{display:block;font-size:14px;font-weight:650;color:var(--muted)}
.time-hours strong{display:block;font-size:clamp(80px,7vw,96px);line-height:1.05;letter-spacing:-.03em;color:var(--plan-accent);margin:20px 0 18px}
.time-hours strong small{font-size:17px;letter-spacing:0;margin-left:8px}
.facts-approx{font-size:15px;vertical-align:middle;letter-spacing:0;margin-right:6px}
.time-hours p{font-size:14px;color:var(--muted);margin:0}
.time-cycle{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line)}
.time-cycle>div{padding:22px 20px 0 0}
.time-cycle>div+div{padding-left:24px;border-left:1px solid var(--line)}
.time-cycle strong{display:block;font-size:34px;line-height:1.2;color:var(--ink);margin:0 0 10px}
.time-cycle strong small{font-size:16px;margin-left:8px}
.time-cycle h3{font-size:17px;margin:0 0 6px}
.time-cycle p{color:var(--muted);font-size:13px;margin:0;line-height:1.7}
.software-block{margin:0 0 36px;min-width:0}
.software-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.software-heading h3{font-size:18px;font-weight:650;margin:0}
.software-marquee{overflow-x:auto;border-block:1px solid var(--line);padding:34px 0;scrollbar-width:thin}
.software-track{display:flex;width:max-content}
.software-set{display:flex;align-items:center;gap:48px;padding-right:48px}
.software-duplicate{display:none}
.software-tool{display:flex;align-items:center;gap:12px;flex:0 0 232px;justify-content:center;border-radius:10px;padding:8px;color:var(--ink)}
.software-tool img{width:84px;height:64px;object-fit:contain}
.software-tool img[alt="Blender"],.software-tool img[alt="TapNow"]{width:132px}
.software-tool span{font-size:15px;font-weight:600;white-space:nowrap}
.software-tool:hover{background:var(--green-soft)}
.software-marquee.is-animated{overflow:hidden}
.is-animated .software-duplicate{display:flex}
.is-animated .software-track{animation:software-scroll 52s linear infinite}
.is-animated:hover .software-track,.is-animated:focus-within .software-track{animation-play-state:paused}
.is-animated:focus-within{overflow-x:auto}
.is-animated:focus-within .software-track{transform:none!important;animation:none}
@keyframes software-scroll{to{transform:translateX(-50%)}}
.capability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.capability-card{min-width:0;background:var(--white);border:1px solid var(--line);border-radius:16px;transition:background .2s,border-color .2s,box-shadow .2s}
.capability-card:not([open]):not(.is-restored):hover,.capability-card:not([open]):not(.is-restored):has(>.capability-summary:focus-visible){border-color:var(--plan-accent);background:var(--green-soft);box-shadow:0 10px 28px rgba(12,116,69,.14)}
.capability-card.is-restored{background:var(--white);border-color:var(--line);box-shadow:none}
.capability-card[open]{background:var(--white);box-shadow:none}
.capability-card[open]{grid-column:1/-1;border-color:var(--plan-accent)}
.capability-summary{list-style:none;cursor:pointer;padding:28px;min-height:176px}
.capability-summary::-webkit-details-marker{display:none}
.capability-top,.capability-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px}
.capability-role{font-size:12px;font-weight:700;color:var(--plan-accent)}
.capability-count{font-size:12px;color:var(--muted)}
.capability-summary h3{font-size:25px;line-height:1.4;letter-spacing:-.02em;margin:20px 0 16px}
.capability-abilities{font-size:14px;color:var(--muted)}
.capability-action{display:flex;align-items:center;gap:12px;flex-shrink:0;font-size:13px;font-weight:650;color:var(--plan-accent)}
.capability-sign{font-size:24px;line-height:1;font-weight:400;color:var(--plan-accent);transition:transform .2s}
.capability-card[open]>.capability-summary .capability-sign{transform:rotate(45deg)}
.label-close,.capability-card[open]>.capability-summary .label-open{display:none}
.capability-card[open]>.capability-summary .label-close{display:inline}
.capability-detail{padding:0 28px 32px}
.module-description{padding-top:24px;border-top:1px solid var(--line);color:var(--muted);font-size:16px;margin:0 0 26px;max-width:850px}
.curriculum-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:48px;align-items:start}
.curriculum-content{min-width:0}
.module-outcome{padding:20px 22px;border-left:3px solid var(--plan-accent);background:var(--surface);border-radius:0 12px 12px 0}
.module-outcome strong{font-size:14px;color:var(--plan-accent)}
.module-outcome p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.course-directory{margin-top:28px}
.course-directory>h4{display:flex;justify-content:space-between;gap:18px;align-items:center;font-size:19px;margin:0 0 12px}
.course-directory>h4 span{font-size:12px;color:var(--muted);font-weight:400}
.course-item{border-bottom:1px solid var(--line)}
.course-item summary{display:flex;gap:12px;align-items:center;cursor:pointer;list-style:none;min-height:64px;padding:16px 0}
.course-item summary::-webkit-details-marker{display:none}
.course-item summary:after{content:"+";font-size:22px;color:var(--muted);flex-shrink:0}
.course-item[open] summary:after{content:"−"}
.course-code{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;flex-shrink:0}
.course-name{font-weight:650;font-size:16px;flex:1;min-width:0}
.course-level{font-size:11px;color:var(--muted);text-align:right}
.course-item ul{padding:0 20px 18px 44px;margin:0;color:var(--muted);font-size:14px;line-height:1.8}
.module-cases{display:grid;gap:24px}
.module-case{margin:0}
.case-placeholder,.case-media{aspect-ratio:16/10;border-radius:16px;overflow:hidden}
.case-placeholder{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;border:1px dashed #9eb4a8;background:var(--surface);color:var(--muted)}
.case-placeholder>span{font-size:12px}
.case-placeholder>strong{font-size:21px;font-weight:550}
.case-media img{width:100%;height:100%;object-fit:cover}
.module-case figcaption{padding-top:12px}
.module-case h4{font-size:15px;font-weight:650;line-height:1.5;margin:0}
.module-case figcaption p{margin:6px 0 0;color:var(--muted);font-size:13px}
.portfolio-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.portfolio-feature{padding:32px;background:var(--green-soft);border-radius:16px}
.portfolio-feature>span{font-size:14px;color:var(--plan-accent)}
.portfolio-feature>strong{display:block;font-size:32px;line-height:1.3;color:var(--plan-accent);margin:22px 0 14px}
.portfolio-feature p{font-size:16px;color:var(--muted);margin:0}
.portfolio-steps{display:flex;flex-wrap:wrap;gap:10px 16px;border-top:1px solid var(--line);padding-top:22px;margin-top:28px}
.portfolio-steps span{font-size:13px;color:var(--plan-accent);font-weight:650}
.deliverable-list{list-style:none;margin:0;padding:0}
.deliverable-list li{margin:0 0 24px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.deliverable-list li:last-child{margin-bottom:0}
.deliverable-list strong,.deliverable-list span{display:block}
.deliverable-list strong{font-size:20px;margin-bottom:8px}
.deliverable-list span{font-size:15px;color:var(--muted)}
.learning-benefits{margin:0}
.benefit-grid{display:grid;grid-template-columns:1fr;gap:0}
.benefit-grid article{padding:0;background:transparent}
.benefit-grid article+article{padding-top:24px;margin-top:26px;border-top:1px solid var(--line)}
.benefit-grid h3{font-size:18px;line-height:1.5;margin:0 0 12px}
.benefit-grid h3 strong{display:block;color:var(--plan-accent);font-size:28px;margin-bottom:8px}
.benefit-grid p{font-size:14px;color:var(--muted);margin:0;max-width:500px;line-height:1.8}
.mentor-link{margin-top:24px}
.enrollment-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:center}
.enrollment-price{padding:36px;background:var(--white);border:1px solid var(--line);border-radius:16px}
.regular-price{display:flex;align-items:baseline;gap:16px;color:var(--muted);font-size:15px;margin:0}
.regular-price span{font-size:21px;font-weight:600;font-variant-numeric:tabular-nums}
.first-price-label{font-size:14px;font-weight:700;color:var(--plan-accent);margin:28px 0 0}
.enrollment-price .price{font-size:clamp(48px,5vw,68px);font-weight:750;line-height:1;letter-spacing:-.04em;color:var(--plan-accent);margin:10px 0 22px}
.price small{font-size:26px;vertical-align:top;margin-right:6px;line-height:1.4}
.installment{font-size:16px;font-weight:650;color:var(--plan-accent);margin:0 0 24px}
.enrollment-coverage h3{font-size:25px;margin:0 0 18px}
.learning-volume{margin:0}
.learning-volume>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:18px;padding:17px 0;border-bottom:1px solid var(--line)}
.learning-volume dt{font-size:14px;color:var(--muted)}
.learning-volume dd{font-size:15px;font-weight:550;line-height:1.6;margin:0}
.payment-note{font-size:13px;color:var(--muted);margin:22px 0 0}
.annual-contact{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:70px;align-items:center}
.annual-contact h2{font-size:clamp(34px,4vw,48px);line-height:1.2;margin:0 0 20px}
.annual-contact p{color:var(--muted);max-width:600px}
.annual-boundary{font-size:13px;margin-top:24px}
.annual-contact figure{margin:0;text-align:center}
.annual-contact img{width:230px;height:auto;border-radius:16px;margin:auto}
.annual-contact figcaption{font-size:13px;color:var(--muted);margin-top:14px}
@media(prefers-color-scheme:dark){.annual-detail{--plan-accent:#72e4a8}.annual-detail .sub-kicker{color:var(--plan-accent)}.case-placeholder{border-color:#5b7767}.software-tool img{background:#f7faf8;border-radius:6px;padding:4px}}
@media(max-width:1024px){.capability-summary{padding:24px}.capability-summary h3{font-size:23px}.capability-bottom{gap:10px}.capability-abilities{font-size:13px}.curriculum-layout{gap:28px}.portfolio-layout,.enrollment-layout{gap:32px}.learning-equal-grid{gap:22px}.learning-time,.learning-benefits{padding:28px}}
@media(max-width:900px){.annual-intro{grid-template-columns:1fr;min-height:482px}.annual-intro .sub-hero-copy{max-width:620px}.curriculum-layout{grid-template-columns:1fr}.module-cases{grid-template-columns:1fr 1fr;gap:18px}.capability-summary h3{font-size:21px}.capability-bottom{align-items:flex-start;flex-direction:column;gap:14px}.capability-summary{min-height:198px}}
@media(max-width:768px){.portfolio-layout,.enrollment-layout,.learning-equal-grid{grid-template-columns:1fr;gap:24px}.learning-equal-grid h2{font-size:30px;margin-bottom:28px}.capability-grid{grid-template-columns:1fr}.capability-summary{min-height:0}.capability-summary h3{font-size:25px;margin:18px 0}.capability-bottom{flex-direction:row;align-items:center}.annual-contact{grid-template-columns:1fr;gap:30px}.annual-contact figure{justify-self:start}}
@media(max-width:480px){.annual-intro{padding-top:44px;padding-bottom:40px;min-height:650px}.annual-intro h1{font-size:38px}.annual-intro .mentor-intro strong{font-size:21px}.annual-intro .hero-actions{display:flex;gap:10px;flex-wrap:wrap}.annual-intro .button{padding:12px 16px;font-size:14px}.annual-video-mask{background:rgba(5,22,15,.74)}.learning-time,.learning-benefits{padding:26px 24px}.learning-equal-grid h2{font-size:28px}.time-cycle>div{padding:20px 12px 0 0}.time-cycle>div+div{padding-left:16px}.time-cycle h3{font-size:17px}.time-cycle p{font-size:13px}.capability-summary{padding:22px}.capability-summary h3{font-size:23px}.capability-top{gap:10px}.capability-count{font-size:11px}.capability-bottom{flex-direction:column;align-items:flex-start}.capability-detail{padding:0 22px 26px}.module-description{font-size:15px}.module-cases{grid-template-columns:1fr}.course-item summary{display:grid;grid-template-columns:26px minmax(0,1fr) 16px;gap:3px 9px}.course-code{grid-column:1;grid-row:1;align-self:start;padding-top:4px}.course-name{grid-column:2;grid-row:1;font-size:15px}.course-level{grid-column:2;grid-row:2;text-align:left}.course-item summary:after{grid-column:3;grid-row:1 / span 2;text-align:center}.course-item ul{padding-left:35px}.course-directory>h4{font-size:17px;gap:10px}.portfolio-feature,.enrollment-price{padding:28px}.learning-volume>div{grid-template-columns:78px minmax(0,1fr);gap:12px}.software-heading h3{font-size:17px}.software-set{gap:20px;padding-right:20px}.software-tool{flex-basis:210px}.software-tool img{width:74px;height:58px}.software-tool img[alt="Blender"],.software-tool img[alt="TapNow"]{width:110px}.software-marquee{padding:30px 0}}
@media(prefers-reduced-motion:reduce){.software-track{animation:none!important}.software-duplicate{display:none!important}.software-marquee.is-animated{overflow-x:auto}}
@media(max-width:768px){.time-hours{display:block;flex:initial;margin-bottom:28px}.time-hours strong{font-size:64px;line-height:1.1;margin:14px 0 12px}}

/* One automatic case frame per module, with manual arrows and no type labels. */
.module-cases{display:block;min-width:0;position:static}
.case-carousel{min-width:0}
.case-stage{position:relative;aspect-ratio:16/10;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;min-width:0}
.case-track{display:flex;width:100%;height:100%;transform:translateX(0)}
.has-motion .case-track{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.case-slide{position:relative;flex:0 0 100%;width:100%;height:100%;min-width:0;margin:0;display:grid;place-items:center}
.case-slide img,.case-slide video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.case-controls{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:12px}
.case-controls[hidden]{display:none}
.case-controls button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--plan-accent);font-size:22px;transition:background .2s,border-color .2s}
.case-controls button:hover{background:var(--green-soft);border-color:var(--plan-accent)}
.case-controls button:active{transform:scale(.97)}
.case-error[hidden]{display:none}
.case-error{position:absolute;bottom:0;left:0;right:0;margin:0;padding:12px 16px;font-size:13px;color:var(--ink);background:var(--white);border-top:1px solid var(--line)}
@media(prefers-reduced-motion:reduce){.case-track,.case-controls button{transition:none!important}}