.tutorials-main{padding:28px max(34px,calc((100vw - 1320px)/2));background:#fff;background-image:radial-gradient(rgba(9,9,9,.14) .55px,transparent .65px);background-size:5px 5px}
.tutorials-heading{display:grid;gap:8px;max-width:660px;margin:0 0 26px}.tutorials-heading small{width:max-content;margin-bottom:10px;padding:5px 9px;background:var(--green);font-size:10px;font-weight:900;letter-spacing:.06em;clip-path:polygon(2% 0,100% 5%,97% 95%,5% 100%,0 50%)}.tutorials-heading h1{margin:0;font-family:Combat,sans-serif;font-size:clamp(40px,4.6vw,66px);line-height:.8;letter-spacing:-.055em}.tutorials-heading p{max-width:580px;margin:0;font-size:13px;line-height:1.35}
.tutorials-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;max-width:1320px;margin:auto}.tutorial-card{min-width:0}.tutorial-thumbnail{position:relative;display:grid;width:100%;aspect-ratio:9/13;place-items:center;overflow:hidden;padding:12px;border:0;border-radius:33px;background:#d4a0dc;cursor:pointer;box-shadow:inset 0 0 0 12px #1d1d1b}.tutorial-thumbnail::before{content:'';position:absolute;inset:12px;border-radius:21px;background:linear-gradient(145deg,#c792d5,#6360c8 52%,#a787cc)}.tutorial-thumbnail>img{position:absolute;z-index:1;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);border-radius:21px;object-fit:cover}.tutorial-thumbnail-2::before{background:linear-gradient(145deg,#19f787,#5c8dff)}.tutorial-thumbnail-3::before{background:linear-gradient(145deg,#fff900,#c792d5)}.tutorial-thumbnail-4::before{background:linear-gradient(145deg,#5c8dff,#19f787)}.tutorial-play{position:relative;z-index:2;width:70px;height:70px;padding:0;border:4px solid #090909;border-radius:50%;background:#19f787;color:transparent;font-size:0;transition:transform .18s ease,background .18s ease}.tutorial-play::before{content:'';position:absolute;top:50%;left:53%;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid #090909;transform:translate(-50%,-50%)}.tutorial-thumbnail:hover .tutorial-play{transform:scale(1.05);background:#fff}.tutorial-copy{display:grid;gap:10px;padding:18px 9px 8px}.tutorial-copy small{width:max-content;padding:5px 8px;background:#c792d5;color:#090909;font-size:10px;font-weight:900}.tutorial-copy h2{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:23px;line-height:1.06;font-weight:900}.tutorial-copy p{margin:0;font-size:13px;line-height:1.42}@media(max-width:900px){.tutorials-main{padding:22px}.tutorials-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}@media(max-width:580px){.tutorials-main{padding:20px}.tutorials-grid{grid-template-columns:1fr}.tutorial-thumbnail{max-width:360px}.tutorial-copy{padding-left:0}}