.course-labels{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-bottom:12px}.course-area{font-size:12px;color:var(--text-muted)}.preparation-label{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:4px;background:var(--surface-subtle);color:var(--text-muted);font-size:12px;line-height:1.5;padding:4px 9px;white-space:nowrap}
.learning-catalog .catalog-course.without-art{grid-template-columns:minmax(0,1fr);padding:22px 26px}.course-overview.without-art{grid-template-columns:minmax(0,1fr);max-width:1000px}.course-overview.without-art .course-intro{max-width:900px}
.lab-card{display:flex;flex-direction:column}.lab-card .lab-card-body{display:flex;flex-direction:column;flex:1}.lab-card .lab-card-body h3{font-size:25px;line-height:1.3;min-height:0;margin:7px 0 14px}.lab-card .lab-card-body>p{margin-bottom:20px}.lab-card .lab-tags{margin-top:auto}.lab-card .lab-card-link{margin-top:20px}.lab-card .course-labels{gap:8px 12px}.lab-card .free-label{font-size:12px;padding:4px 9px}

:root{--sky:#4EB3D4;--sky-hover:#6BBFDA;--sky-border:#3489A4}
.button.sky{background:var(--sky);border-color:var(--sky-border);color:#172A32}.button.sky:hover{background:var(--sky-hover)}
.preparation-label{background:#D36B60;border-color:#D36B60;color:#301814}
.free-label{background:#78DDCB;color:#153B33;border:1px solid #78DDCB}
.academy-art .art-layer{display:block;width:100%;height:100%}
.academy-art .art-layer-color{position:absolute;inset:0;pointer-events:none}
.academy-art .art-layer>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.academy-art .art-color{position:static;inset:auto}
.hero.hero-carousel{display:block;min-width:0;overflow:hidden;padding:42px 0 28px}
.hero-viewport{display:flex;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;outline-offset:-3px;border-radius:12px}
.hero-viewport::-webkit-scrollbar{display:none}
.hero-slide{margin:0;flex:0 0 100%;min-width:0;display:grid;grid-template-columns:1fr 1.06fr;align-items:center;gap:48px;scroll-snap-align:start;scroll-snap-stop:always;padding:16px 6px}
.hero .hero-title{font-size:clamp(46px,4.8vw,68px);font-weight:500;line-height:1.2;margin:22px 0 24px}
.hero-slide .academy-art{width:100%;aspect-ratio:1.35}
.hero-slide .academy-art img{width:100%;height:100%;aspect-ratio:auto;object-fit:contain}
.hero-carousel-controls{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px}
.hero-carousel-controls .icon-button{width:36px;height:36px;border-radius:50%;background:transparent}
.hero-carousel-controls .icon-button:hover{background:var(--surface-subtle)}
[data-hero-previous] .ui-icon{transform:rotate(180deg)}
.hero-dots{display:flex;align-items:center}.hero-dots button{width:30px;height:36px;display:grid;place-items:center;border:0;background:transparent;cursor:pointer;padding:0}
.hero-dots span{width:6px;height:6px;background:var(--border);border-radius:50%;transition:width .2s,background-color .2s}.hero-dots [aria-current=true] span{width:19px;border-radius:5px;background:var(--action)}
.hero-position{font-size:12px;font-variant-numeric:tabular-nums;color:var(--text-muted);min-width:35px;text-align:center}
/* Hero motion stays independent of pointer hover. */
.hero-carousel .academy-art .art-base{filter:none}.hero-carousel .academy-art .art-color{display:none}
.hero-carousel .hero-slide .academy-art{transform:none;transition:none}
.hero-carousel .hero-slide[aria-hidden=false] .academy-art{animation:hero-drift 7.2s ease-in-out both}
.hero-carousel[data-playing=false] .hero-slide .academy-art{animation-play-state:paused}
.hero-carousel [data-hero-toggle] .icon-play{display:none}.hero-carousel [data-hero-toggle][data-paused=true] .icon-play{display:block}.hero-carousel [data-hero-toggle][data-paused=true] .icon-pause{display:none}
.hero-carousel [data-hero-toggle]:disabled{opacity:.4;cursor:default}
@keyframes hero-drift{from{transform:translate(-5px,5px) scale(.965) rotate(-.35deg)}to{transform:translate(5px,-5px) scale(1.015) rotate(.25deg)}}
.pccx-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:60px;padding:72px 0}
.pccx-copy h2{font-size:clamp(32px,3.5vw,48px);line-height:1.2;margin:0 0 20px}.pccx-copy p{font-size:17px;line-height:1.7;color:var(--text-muted);max-width:620px}
.pccx-section .chip-project-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.pccx-section .button{white-space:nowrap}
.pccx-art{margin:0;min-width:0}.pccx-art .academy-art{width:100%}.pccx-art img{width:100%;height:auto;object-fit:contain}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .pccx-art:hover .academy-art,.pccx-section:focus-within .academy-art{transform:translateY(-3px) rotate(-.35deg)}
 .pccx-art:hover .art-color,.pccx-section:focus-within .art-color{clip-path:inset(0)}
}
@media(max-width:1000px){.hero-slide{gap:24px}.hero-actions{gap:18px;flex-wrap:wrap}.hero .hero-title{font-size:48px}.pccx-section{gap:32px}}
@media(max-width:760px){
 .hero.hero-carousel{padding:28px 0 16px}.hero-slide{grid-template-columns:1fr;gap:22px;padding:0 6px;align-content:start}.hero .hero-title{font-size:clamp(33px,7.5vw,48px);margin-top:10px}.hero-slide .intro{font-size:16px}.hero-slide .hero-art{width:100%;max-width:500px;justify-self:center}.hero-slide .academy-art{aspect-ratio:1.7}.hero-actions{margin-top:22px}.hero-actions .plain-link{font-size:13px}.hero-carousel-controls{margin-top:10px}
 .lab-card .lab-card-body h3{font-size:23px}.learning-catalog .catalog-course.without-art{padding:20px}
 .pccx-section{grid-template-columns:1fr;gap:32px;padding:48px 0}.pccx-copy p{font-size:16px}.pccx-art{max-width:520px;width:100%;justify-self:center}.course-overview.without-art .course-intro h1{font-size:clamp(30px,7vw,40px)}
}
@media(prefers-reduced-motion:reduce){.hero-dots span{transition:none}.hero-carousel .hero-slide[aria-hidden=false] .academy-art{animation:none}}

/* A paper tag sits above the artwork, never above course text or its hit target. */
.catalog-course,.lab-card{position:relative;isolation:isolate}
.preparation-overlay{--tag-width:132px;--tag-height:104px;--tag-scale:1.04;position:absolute;z-index:3;display:block;pointer-events:none;user-select:none;width:calc(var(--tag-width)*var(--tag-scale));height:calc(var(--tag-height)*var(--tag-scale));top:-10px;left:12px;filter:drop-shadow(0 3px 2px #33251a24)}
.preparation-overlay img{display:block;width:100%;height:100%;object-fit:contain}
.lab-card .preparation-overlay{left:auto;right:5px;top:-12px;--tag-width:146px;--tag-height:110px}
.preparation-overlay-2{--tag-scale:1.12}.preparation-overlay-3{--tag-width:154px;--tag-scale:1.10}.preparation-overlay-4{--tag-width:154px;--tag-height:114px;--tag-scale:1.12}.preparation-overlay-6{--tag-scale:1.08}
.lab-card .preparation-overlay-4{--tag-width:168px;--tag-height:124px;left:0;right:auto;top:-10px}
@media(max-width:760px){.catalog-course .preparation-overlay{--tag-width:100px;--tag-height:80px;left:8px;right:auto;top:-8px}}

@media(max-width:560px){.catalog-course .preparation-overlay{--tag-width:90px;--tag-height:72px;left:6px}}
@media(max-width:380px){.catalog-course .preparation-overlay{--tag-width:64px;--tag-height:60px;left:6px}}
