/* The teaching offer is the central reason to visit this portfolio. */
.learning-showcase{--learning-surface:#0b2a55;position:relative;isolation:isolate;overflow:clip;padding:100px 0 125px;color:#fff;background:var(--learning-surface);border:0}
.learning-stage{position:relative;z-index:2}
.learning-intro{max-width:1000px;margin:0 auto;text-align:center}
.learning-intro .eyebrow{display:inline-block;padding:.6rem 1rem;border-radius:999px;background:#7ccbff18;color:#c0e6ff;letter-spacing:.065em;font-size:.875rem;font-weight:600;margin-bottom:1.4rem}
.learning-intro>.learning-tagline{max-width:820px;margin:0 auto;color:#e6f4ff;font-size:clamp(1.125rem,1.7vw,1.35rem);line-height:1.5;font-weight:500;letter-spacing:0;text-wrap:balance}
.learning-intro h2{font-size:clamp(2.6rem,4.8vw,4.6rem);line-height:1.12;letter-spacing:-.015em;margin:1.3rem 0 1.5rem;text-wrap:balance}
.learning-intro h2>.learn-highlight{color:#a9ddff}
.learning-intro>.learning-tagline{margin-bottom:1.2rem}
.learning-intro>.learning-intro-copy{max-width:640px;margin:0 auto 1.8rem;color:#d9eaff;font-size:1.0625rem;line-height:1.7}
.learning-intro>.button{font-size:1.0625rem;min-height:60px;padding:1rem 2.6rem;font-weight:650}
.learning-intro .learning-format{font-size:.875rem;line-height:1.5;letter-spacing:.015em;color:#b9d8f2;margin:1.2rem 0 0}
.learning-path-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,30px);align-items:start;margin-top:45px;perspective:1500px}
.learning-path-card{--card-angle:0deg;--card-offset:0px;position:relative;padding:26px;border-radius:24px;border:1px solid #c5e1f5;background:linear-gradient(150deg,#fff,#f1f8ff);color:#0b2a55;box-shadow:0 24px 60px #03132950;transform:translate3d(0,calc(var(--card-offset) + var(--learn-drift,0px)),0) rotate(var(--card-angle));transition:transform .65s cubic-bezier(.22,1,.36,1),box-shadow .4s;transform-style:preserve-3d}
.learn-web{grid-column:1;grid-row:1;--card-angle:-3deg;--card-offset:-20px}
.learn-automation{grid-column:3;grid-row:1;--card-angle:3deg;--card-offset:-20px}
.learn-digital{grid-column:2;grid-row:1;--card-offset:55px;--card-angle:0deg}
.learning-path-card:hover,.learning-path-card:focus-within{transform:translate3d(0,calc(var(--card-offset) - 15px),30px) rotate(0deg);box-shadow:0 30px 65px #03132980}
.lesson-index{display:block;font-size:.8125rem;font-weight:650;letter-spacing:.035em;color:#1557a6;margin:1.4rem 0 .8rem}
.learning-path-card h3{font-size:clamp(1.5rem,2.2vw,1.9rem);line-height:1.2;letter-spacing:-.008em}
.learning-path-card>p{font-size:1rem;line-height:1.65;color:#486793;margin:1rem 0 1.4rem}
.lesson-outcomes{list-style:none;padding:0;margin:0 0 1.5rem;font-size:.875rem;line-height:1.6;color:#284d72}
.lesson-outcomes li{position:relative;padding:.3rem 0 .3rem 1.3rem}
.lesson-outcomes li::before{content:'✓';position:absolute;left:0;top:.3rem;color:#1557a6;font-weight:650}
.learning-path-card .button{width:100%;font-size:.9375rem;min-height:56px;padding:.85rem .9rem;font-weight:600}
.learning-path-card>.lesson-business-note{font-size:.8125rem;line-height:1.55;color:#486793;margin:1.25rem 0 0;padding-top:1rem;border-top:1px solid #d6e7f5}
.lesson-detail{display:block;text-align:center;font-size:.875rem;color:#486793;line-height:1.5;margin:1rem 0 0;text-decoration:underline;text-underline-offset:4px}
.lesson-detail:hover{color:#1557a6}
.lesson-visual{margin:0 0 1.4rem;aspect-ratio:3/2;border-radius:15px;overflow:hidden;background:#f2f8ff;transform:translateZ(12px)}
.lesson-visual img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.learning-path-card:hover .lesson-visual img,.learning-path-card:focus-within .lesson-visual img{transform:scale(1.035)}
.lesson-mini{height:116px;border-radius:13px;background:#deefff;border:1px solid #bad6ef;position:relative;overflow:hidden;transform:translateZ(12px)}
.mini-bar{height:22px;border-bottom:1px solid #abcbe6;display:flex;align-items:center;gap:5px;padding:0 10px}.mini-bar i{width:4px;height:4px;border-radius:50%;background:#486793}
.mini-layout{padding:12px 16px}.mini-layout>span{display:block;font-size:.75rem;font-weight:600;letter-spacing:.06em;color:#486793}.mini-layout>b{font-size:clamp(.9375rem,1.3vw,1.2rem);font-weight:600;letter-spacing:0;white-space:nowrap}.mini-layout>div{display:flex;gap:7px;margin-top:7px}.mini-layout i{font-style:normal;font-size:.75rem;padding:2px 8px;background:#fff8;border-radius:4px;color:#1557a6}
.mini-workflow{display:flex;align-items:flex-start;justify-content:center;gap:6px;padding:25px 8px 40px}.mini-workflow>span{font-size:.75rem;font-weight:600;background:#fff;border:1px solid #a9cde9;border-radius:7px;padding:9px 6px}.mini-workflow>i{width:12px;height:2px;background:#1557a6;margin-top:16px;flex-shrink:0}.mini-workflow>b{position:absolute;left:0;right:0;bottom:17px;text-align:center;font-size:.75rem;letter-spacing:0;font-weight:500;color:#486793}
.mini-workflow>i::after{content:'';display:block;width:4px;height:4px;border-radius:50%;background:#38a8f5;animation:lesson-data 2.2s linear infinite}.mini-workflow>i:nth-of-type(2)::after{animation-delay:1.1s}
.mini-product{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px}.mini-product>span{font-size:.75rem;font-weight:600;line-height:1.3;color:#1557a6}.mini-product>i{height:8px;width:1px;background:#93b6d5}
@keyframes lesson-data{from{transform:translateX(0)}to{transform:translateX(12px)}}

.brand-band{border-block:0}
.learning-showcase::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 32%,#236db580,transparent 55%),radial-gradient(circle at 50% 64%,#7ccbff28,transparent 38%);mask-image:linear-gradient(transparent,#000 16%,#000 84%,transparent);transform:translateY(var(--stage-glow,0px))}

/* Only the central learning CTAs carry a continuously travelling border. */
@property --cta-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.learning-cta{position:relative;isolation:isolate;--cta-surface:#1557a6;--cta-angle:0deg;border:1px solid #75bbef70;background:var(--cta-surface);box-shadow:0 7px 24px #1557a624;animation:cta-border 5s linear infinite}
.learning-cta::before{content:'';position:absolute;inset:-3px;border-radius:inherit;padding:2px;background:conic-gradient(from var(--cta-angle),#7ccbff00 5%,#7ccbff 25%,#fff 32%,#7ccbff00 48%,#1557a600 63%,#38a8f5 80%,#7ccbff00 95%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:-1}
.learning-cta>span{position:relative;z-index:1}.learning-cta:hover{background:#1d67b5;box-shadow:0 12px 32px #1557a655}
.learning-cta.cta-observed{animation-play-state:paused}.learning-cta.cta-observed.is-cta-visible{animation-play-state:running}
.learning-cta:focus-visible{outline:3px solid #7ccbff;outline-offset:7px}
.learning-cta.cta-bright{--cta-surface:#e8f5ff;color:#0b2a55;border-color:#d5ecff;box-shadow:0 10px 35px #00163165}.learning-cta.cta-bright:hover{background:#fff;color:#0b2a55}
@keyframes cta-border{to{--cta-angle:360deg}}
.button:not(.learning-cta):hover{box-shadow:0 10px 26px #1557a645}

/* The writing advances with native scrolling, then releases at the end. */
.live-build-story{position:relative;background:#fff;min-height:unset}
.learning-motion-ready .live-build-story{height:235vh;height:235svh}
.live-build-pin{position:relative;padding:5rem 0}
.learning-motion-ready .live-build-pin{position:sticky;top:90px;min-height:calc(100vh - 105px);min-height:calc(100svh - 105px);display:flex;align-items:center;padding:2rem 0}
.live-build-layout{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(35px,6vw,90px);align-items:center;position:relative;z-index:1}
.live-build-copy h2{font-size:clamp(2.2rem,3.6vw,3.7rem);line-height:1.08;letter-spacing:-.02em;margin:1.2rem 0 1.4rem}.live-build-copy h2>span{color:#1557a6}
.scroll-writing{font-size:clamp(1.4rem,2.4vw,2.25rem);line-height:1.4;font-weight:500;letter-spacing:-.015em;color:#0b2a55;max-width:620px;min-height:4.2em;margin-bottom:1.7rem}
.scroll-letter{color:rgb(11 42 85 / var(--letter-ink,1));transition:color .08s linear}
.scroll-word{display:inline-block;white-space:nowrap}
.learning-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.live-scope-note{color:#486793;font-size:.875rem;line-height:1.6;max-width:470px;margin-top:1.3rem}
.live-project-map{position:relative;padding:25px 28px;border:1px solid #c2daef;border-radius:25px;background:radial-gradient(circle at 85% calc(15% + var(--build-progress,0) * 70%),#b4dfff80,transparent 60%),linear-gradient(145deg,#f5faff,#e8f4ff);box-shadow:0 20px 50px #0b2a5510;transform:perspective(1200px) rotateY(calc(-6deg + var(--build-progress,0) * 6deg))}
.map-label{font-size:.75rem;color:#486793;font-weight:650;letter-spacing:.07em;margin-bottom:15px}
.live-milestones{list-style:none;margin:0;padding:0;position:relative}.live-milestones::before{content:'';position:absolute;left:18px;top:24px;bottom:24px;width:1px;background:#9ec1df}
.live-milestones li{display:flex;align-items:flex-start;gap:15px;position:relative;padding:12px 10px 12px 0;opacity:.55;transition:opacity .25s,transform .3s,background .3s;border-radius:13px}
.live-milestones li>span{display:grid;place-items:center;position:relative;width:38px;height:38px;flex-shrink:0;border:1px solid #a6c9e5;border-radius:11px;background:#e4f1ff;font-size:.75rem;font-weight:650;color:#1557a6}
.live-milestones h3{font-size:1rem;font-weight:600;line-height:1.3;letter-spacing:0}.live-milestones p{font-size:.875rem;line-height:1.5;color:#486793;margin-top:4px}
.live-milestones .is-current{opacity:1;background:#fff9;transform:translateX(7px)}.live-milestones .is-complete{opacity:.9}.live-milestones .is-current>span{background:#1557a6;color:#fff;border-color:#1557a6;box-shadow:0 0 20px #7ccbff70}
.live-progress{height:3px;background:#bfd7ec;border-radius:6px;margin-top:20px;overflow:hidden}.live-progress>span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#1557a6,#7ccbff);transform:scaleX(var(--build-progress,0));transform-origin:left}
.live-map-caption{font-size:.875rem;color:#486793;margin-top:10px}
.live-build-pin::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#1557a607 1px,transparent 1px),linear-gradient(90deg,#1557a607 1px,transparent 1px);background-size:64px 64px;opacity:var(--story-grid-opacity,.6);transform:translateY(var(--story-background,0px));z-index:0}

.learning-comparison{padding-top:5rem;padding-bottom:6rem}
.comparison-heading{max-width:740px}.comparison-heading h2{font-size:clamp(2.4rem,4.5vw,4.1rem);line-height:1.1;margin:1rem 0 1.4rem;letter-spacing:-.025em}.comparison-heading>p:last-child{font-size:1.0625rem;line-height:1.7;color:#486793;max-width:580px}
.comparison-scroll{overflow-x:auto;margin-top:2.8rem;border:1px solid #c8deef;border-radius:23px;background:#fff;scrollbar-width:thin;scrollbar-color:#a1c8e7 transparent}
.learning-table{border-collapse:separate;border-spacing:0;width:100%;min-width:640px;text-align:left;font-size:1rem;line-height:1.65}
.learning-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.learning-table th,.learning-table td{padding:20px 24px;vertical-align:top;border-bottom:1px solid #deebf5;width:36%;font-weight:400}.learning-table th:first-child{width:28%;font-weight:600;color:#0b2a55}
.learning-table thead th{background:#f3f9ff;font-weight:600;color:#0b2a55;font-size:1.125rem}.learning-table th:last-child,.learning-table td:last-child{background:#eaf5ff;color:#0b2a55}.learning-table td{color:#486793}.learning-table tbody tr:last-child>*{border-bottom:0}
.learning-table tbody tr:hover>*{box-shadow:inset 0 0 0 9999px #7ccbff0b}
.comparison-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:2rem}.comparison-bottom p{font-size:.875rem;line-height:1.6;color:#486793;max-width:600px}.comparison-bottom .button{flex-shrink:0}
.learning-close{--learning-surface:#0b2a55;padding-top:5rem;background:var(--learning-surface);border:0;animation:none}.learning-close .contact-inner{position:relative;z-index:2}
.learning-close::before{inset:0;background:radial-gradient(ellipse at 70% 65%,#38a8f530,transparent 50%)}
.build-explainer>.button{margin-top:1.5rem}.tool-links strong{font-size:1rem}.tool-links span{font-size:.875rem}
@media(max-width:1000px){.learning-path-card{padding:19px}.learning-path-card h3{font-size:1.6rem}.learning-intro{max-width:650px}.learning-path-card>p{font-size:.9375rem}.learning-motion-ready .live-build-pin{top:85px}.live-build-layout{gap:30px}.live-project-map{padding:20px}.live-milestones li{gap:11px}.scroll-writing{font-size:1.75rem}}
@media(max-width:760px){
 .learning-showcase{padding:64px 0 80px}
 .learning-intro h2{font-size:clamp(2.65rem,9.5vw,4rem)}.learning-intro>.learning-intro-copy{font-size:1rem;max-width:400px}.learning-intro .learning-format{font-size:.875rem;max-width:310px;margin-inline:auto}.learning-intro>.learning-tagline{font-size:1.0625rem;max-width:460px}.learning-intro>.button{width:100%}
 .learning-path-cards{grid-template-columns:1fr;gap:25px;margin-top:40px;max-width:440px;margin-inline:auto;padding-inline:6px}
 .learn-web,.learn-automation,.learn-digital{grid-column:1;grid-row:auto;--card-offset:0px;--card-angle:0deg}.learning-path-card{padding:24px;transform:none}.learning-path-card:hover,.learning-path-card:focus-within{transform:translateY(-4px)}.learning-path-card h3{font-size:1.85rem}.learning-path-card>p{font-size:1rem}.learning-path-card .button{font-size:1rem}
 .learning-motion-ready .live-build-story{height:auto}.learning-motion-ready .live-build-pin,.live-build-pin{position:relative;top:auto;min-height:0;padding:4rem 0}.live-build-layout{grid-template-columns:1fr;gap:35px}.live-build-copy h2{font-size:2.55rem}.scroll-writing{font-size:1.55rem;min-height:0}.live-project-map{transform:none}.live-milestones li{opacity:1}.live-build-copy .button{width:100%}
 .learning-comparison{padding-block:4rem}.comparison-heading h2{font-size:2.6rem}.comparison-heading>p:last-child{font-size:1rem}.learning-table{font-size:.9375rem;min-width:610px}.learning-table th,.learning-table td{padding:16px 18px}.learning-table thead th{font-size:1rem}.comparison-scroll{margin-top:1.8rem;border-radius:17px}.comparison-bottom{display:block}.comparison-bottom .button{margin-top:1.3rem;width:100%}
 .learning-close{padding-top:4rem}.learning-cta{min-height:54px}.tool-links{grid-template-columns:1fr 1fr}
}
@media(max-height:700px) and (min-width:761px){.learning-motion-ready .live-build-pin{position:relative;top:auto;min-height:0;padding:4rem 0}.learning-motion-ready .live-build-story{height:auto}.live-milestones li{opacity:1}}
@media(prefers-reduced-motion:reduce){
 .learning-cta,.mini-workflow>i::after{animation:none}.lesson-visual,.learning-path-card:hover .lesson-visual img,.learning-path-card:focus-within .lesson-visual img{transform:none;transition:none}.learning-motion-ready .live-build-story{height:auto}.learning-motion-ready .live-build-pin{position:relative;top:auto;min-height:0;padding:4rem 0}.learning-path-card,.learning-path-card:hover,.learning-path-card:focus-within,.live-project-map{transform:none}.live-milestones li{opacity:1;transform:none}.scroll-letter{color:#0b2a55}.live-build-pin::before{transform:none}
}