.tutorial-home{padding-block:40px 56px}.home-intro{background:#2b4038;border:1px solid #23392f;justify-content:space-between;align-items:flex-end;gap:32px;padding:32px 36px 34px;display:flex;position:relative;box-shadow:inset 0 1px #ffffff12}.home-intro .eyebrow{letter-spacing:.12em;color:#c0cfb9;margin-bottom:12px;font-size:12px}.home-intro h1{font:600 46px/1.35 var(--serif);letter-spacing:.035em;color:#faf8ed}.home-description{color:#c8d5c0;border-left:1px solid #6a8261;padding:0 0 4px 24px;font-size:14px;line-height:1.9}.home-intro:after{content:"";background:linear-gradient(90deg,#d99b88 25%,#e5d7a6 25% 50%,#84a5ba 50% 75%,#92ae9b 75%);width:104px;height:3px;position:absolute;bottom:0;left:36px}.catalogue-heading{justify-content:space-between;align-items:center;gap:20px;padding:21px 0 16px;display:flex}.catalogue-heading h2{letter-spacing:.06em;align-items:center;gap:10px;font-size:13px;font-weight:500;display:flex}.catalogue-heading h2:before{content:"";background:#9b8761;width:4px;height:4px}.catalogue-heading>span{color:var(--muted);font-size:12px}.tutorial-covers{background:0 0;border:0;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:1px 0 0 1px;list-style:none;display:grid}.tutorial-covers>li{background:#fcfbf7;border:1px solid #cdd2c6;min-width:0;margin:-1px 0 0 -1px}.tutorial-covers>li[hidden]{display:none}.course-cover{flex-direction:column;height:100%;min-height:318px;padding:20px 24px 24px;display:flex;position:relative}.course-cover:focus-visible{outline-offset:-4px;z-index:1}.course-topline{justify-content:space-between;align-items:center;gap:8px;min-height:18px;display:flex}.course-type{letter-spacing:.07em;color:var(--muted);font:11px/1.5 ui-monospace,monospace}.course-recommendation{color:#426447;align-items:center;gap:6px;font-size:10px;display:flex}.course-recommendation:before{content:"";background:#78977a;width:5px;height:5px}.course-stage{background-color:#f1f2eb;background-image:radial-gradient(#abb5a332 .55px,#0000 .7px);background-size:12px 12px;border:1px solid #e2e5da;place-items:center;height:164px;margin:12px -6px 17px;transition:border-color .18s ease-out;display:grid;position:relative;box-shadow:inset 0 1px #ffffffa0}.course-stage:before,.course-stage:after{content:"";background:#95a58b;width:10px;height:1px;position:absolute;bottom:-1px}.course-stage:before{left:0}.course-stage:after{right:0}.course-picture{min-width:0}.course-picture>svg{max-width:100%;height:auto;display:block}.course-stage>.course-picture{justify-content:center;align-items:center;width:146px;height:150px;display:flex}.course-stage>.course-picture>svg{width:146px;max-height:150px;margin:0}.course-caption{min-width:0;margin-top:auto}.course-title{justify-content:space-between;align-items:center;gap:10px;display:flex}.course-title h3{font:600 23px/1.5 var(--serif);letter-spacing:.025em;color:var(--ink);position:relative}.course-title h3:after{content:"";opacity:0;background:#71836b;height:1px;transition:opacity .18s ease-out;position:absolute;bottom:-3px;left:0;right:0}.course-title .interface-icon{color:#83907a;border:1px solid #0000;flex-shrink:0;width:24px;height:24px;padding:3px;transition:color .18s ease-out}.course-highlight{color:#596453;min-height:44px;margin-top:9px;font-size:12px;line-height:1.85}.course-meta{color:#63705e;border-top:1px solid #dfe4d6;justify-content:space-between;align-items:baseline;gap:8px;margin-top:12px;padding-top:10px;font-size:11px;line-height:1.8;display:flex}.course-meta>span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums}.course-method{color:#66765a;margin-top:8px;font-size:11px}.course-cover-full .course-title h3{font-size:19px;line-height:1.65}.catalogue-toolbar{color:var(--muted);align-items:center;gap:16px;padding:0 0 18px;font-size:12px;display:flex}.catalogue-toolbar[hidden]{display:none}.catalogue-toolbar select{font:inherit;min-width:160px;min-height:44px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:2px;padding:8px 28px 8px 12px}.course-cover:focus-visible .course-stage{border-color:#a3b19a;transition:none}.course-cover:focus-visible .course-title h3:after{opacity:1;transition:none}.course-cover:focus-visible .interface-icon{color:var(--ink);transition:none}@media (hover:hover) and (pointer:fine){.course-cover:hover .course-stage{border-color:#a3b19a;transition-delay:80ms}.course-cover:hover .course-title h3:after{opacity:1;transition-delay:80ms}.course-cover:hover .interface-icon{color:var(--ink);transition-delay:80ms}}@media (width<=1000px){.tutorial-covers{grid-template-columns:repeat(2,minmax(0,1fr))}.course-cover{min-height:308px;padding:18px 24px 22px}.course-stage{height:160px}.course-highlight{min-height:23px}.home-intro h1{font-size:41px}}@media (width<=600px){.tutorial-home{padding-block:25px 36px}.home-intro{padding:23px 22px 26px;display:block}.home-intro:after{left:22px}.home-intro .eyebrow{margin-bottom:10px;font-size:11px}.home-intro h1{letter-spacing:.025em;font-size:33px}.home-description{border:0;margin-top:14px;padding:0;font-size:13px}.home-description br{display:none}.catalogue-heading{padding-block:14px 12px}.catalogue-heading h2{font-size:13px}.catalogue-heading>span{font-size:10px}.course-cover{min-height:280px;padding:14px 15px 16px}.course-stage{height:136px;margin:9px -3px 14px}.course-stage>.course-picture,.course-stage>.course-picture>svg{width:120px;max-height:130px}.course-title h3{font-size:20px}.course-title .interface-icon{width:21px;height:21px;padding:2px}.course-highlight{min-height:41px;margin-top:7px;font-size:11px}.course-meta{gap:5px;margin-top:9px;padding-top:8px;font-size:10px}.course-type{font-size:10px}.course-recommendation{gap:4px;font-size:9px}.course-cover-full .course-title h3{font-size:17px}.course-method{font-size:10px}.catalogue-toolbar{gap:12px}}@media (width<=360px){.course-cover{padding-inline:11px}.course-stage{height:124px}.course-stage>.course-picture,.course-stage>.course-picture>svg{width:110px;max-height:120px}.course-title{gap:4px}.course-title h3{font-size:18px}.course-title .interface-icon{width:18px;height:18px}.course-meta,.course-recommendation{font-size:9px}}
