:root{--bg:#2d2927;--paper:#e4e3e0;--blue:#245be8;--ink:#2e2a28}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font-family:Arial,Helvetica,sans-serif;color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.wrap{width:min(960px,calc(100% - 32px));margin:44px auto 30px;position:relative}.sheet{background:var(--paper);border-radius:25px;padding:26px 34px 20px;overflow:hidden;position:relative}.star{position:absolute;z-index:2;top:-42px;width:75px;height:205px;background:var(--blue);clip-path:polygon(47% 0,57% 36%,100% 43%,58% 50%,53% 100%,43% 57%,0 51%,42% 43%)}.star.l{left:-36px}.star.r{right:-36px}.nav{height:46px;border-bottom:1px solid #514d49;display:flex;align-items:center;gap:22px;color:var(--blue);font-size:13px}.links{display:flex;gap:20px}.brand{margin:auto;display:flex;align-items:center;gap:8px;color:var(--ink);font-size:11px;font-weight:900;white-space:nowrap}.brandmark{font-size:27px;color:#9a7210;text-shadow:2px 1px #f1c33d}.brand small{display:block;font-size:8px}.contact{border:1px solid var(--ink);border-radius:20px;padding:7px 14px;white-space:nowrap}.contact b{font-size:17px;color:var(--blue)}.menu{display:none;border:0;background:transparent;color:var(--blue);font-size:22px}.hero{text-align:center;padding:38px 0 18px;position:relative}.hero h1{font-size:clamp(29px,5.4vw,54px);line-height:1.06;letter-spacing:-.045em;font-weight:950;margin:0 auto;max-width:800px}.checks{display:flex;justify-content:center;gap:min(35vw,310px);color:var(--blue);font-size:24px;letter-spacing:-7px;font-weight:900;margin-bottom:8px}.scribble{position:absolute;top:85px;color:var(--blue);font-size:74px;font-weight:300}.scribble.l{left:2%;transform:rotate(-30deg)}.scribble.r{right:2%;transform:rotate(25deg)}.meta{display:flex;justify-content:space-between;align-items:center;text-align:left;max-width:760px;margin:23px auto 6px;color:var(--blue);font-size:13px}.meta strong{font-weight:900}.join{display:flex;align-items:center;gap:8px}.pill{border:1px solid var(--ink);border-radius:20px;padding:7px 17px;background:transparent;color:var(--blue)}.arrow{display:inline-grid;place-items:center;width:31px;height:31px;border-radius:50%;background:var(--ink);color:white;font-size:19px;transition:.2s}.arrow:hover{background:var(--blue);transform:rotate(45deg)}.artrow{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:32px;align-items:center;max-width:760px;margin:0 auto 28px}.art{height:245px;background:#302c2a;border-radius:23px;overflow:hidden;display:grid;place-items:center}.art.mid{height:320px}.art svg{width:100%;height:100%}.down{margin:0 auto 24px;width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-top:31px solid var(--blue);display:block}.classes{border:1.5px solid #55514e;border-radius:28px;padding:29px 34px 25px}.classhead{display:flex;justify-content:space-between;gap:24px;margin-bottom:30px}.classhead h2{font-size:17px;color:var(--blue);margin:0;font-weight:900}.classhead p{font-size:13px;max-width:340px;margin:0;line-height:1.2}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.card{position:relative;background:#302c2a;color:#f7f4f1;border-radius:20px;padding:18px 15px 13px;min-height:245px;display:flex;flex-direction:column;transition:transform .2s}.card:hover{transform:translateY(-4px)}.card h3{font-size:14px;font-weight:500;line-height:1.15;margin:3px 38px 16px 0;min-height:32px}.card .arrow{position:absolute;right:12px;top:12px;width:42px;height:42px;background:var(--blue);font-size:24px}.card p{font-size:10px;line-height:1.3;margin:0;padding:14px 0 15px;border-top:1px solid #c9c4bf;min-height:65px}.thumb{height:90px;background:#e5e3df;border-radius:12px;margin-top:auto;overflow:hidden}.thumb svg{width:100%;height:100%}.quote{text-align:center;padding:35px 0 0;position:relative}.quote h2{font-size:clamp(23px,3vw,31px);line-height:1.25;letter-spacing:-.04em;margin:0 auto 15px;font-weight:950}.outline{border:2px solid var(--blue);border-radius:25px;padding:3px 14px;display:inline-block}.blue{color:var(--blue)}.quote p{font-size:11px;margin:0}.spark{position:absolute;color:var(--blue);font-size:42px;top:45px}.spark.l{left:6%}.spark.r{right:6%}.footer{display:flex;align-items:center;justify-content:space-between;padding:16px 4px 0;font-size:11px;color:var(--blue)}.logoend{font-family:serif;font-size:35px;font-weight:900;color:#252321;letter-spacing:-8px;margin-right:8px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);opacity:0;background:#24211f;color:white;padding:12px 18px;border-radius:25px;font-size:13px;z-index:20;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:0;border-radius:20px;padding:0;width:min(92vw,460px);box-shadow:0 20px 80px #0005;color:var(--ink)}dialog::backdrop{background:#171514cc;backdrop-filter:blur(4px)}.modalhead{display:flex;justify-content:space-between;align-items:center;padding:22px 24px 0}.modalhead h2{margin:0;font-size:22px}.close{border:0;border-radius:50%;width:32px;height:32px;background:#efeeeb;font-size:21px}.modalbody{padding:18px 24px 24px;font-size:14px;line-height:1.5}.modalbody p{color:#66615e}.modalbody label{display:block;font-size:12px;font-weight:700;margin:12px 0 6px}.modalbody input,.modalbody textarea{width:100%;border:1px solid #d5d2ce;border-radius:10px;padding:12px;font:inherit}.submit{margin-top:15px;border:0;background:var(--blue);color:#fff;border-radius:20px;padding:12px 18px;font-weight:700}
@media(max-width:700px){.wrap{width:calc(100% - 18px);margin:18px auto}.sheet{padding:16px 15px 17px;border-radius:19px}.nav{gap:10px;height:40px}.links{display:none;position:absolute;top:43px;left:0;right:0;background:var(--paper);border:1px solid #d3d0cc;border-radius:13px;padding:13px;z-index:10;flex-direction:column;box-shadow:0 8px 20px #0001}.links.open{display:flex}.menu{display:block}.brand{font-size:10px}.brandmark{font-size:23px}.contact{font-size:10px;padding:7px 9px}.star{width:40px;height:125px;top:-23px}.star.l{left:-19px}.star.r{right:-19px}.hero{padding:34px 0 14px}.hero h1{font-size:clamp(25px,7vw,42px)}.checks{gap:100px;font-size:19px}.scribble{font-size:42px;top:68px}.scribble.l{left:-2%}.scribble.r{right:-2%}.meta{font-size:11px;margin:18px 4px 12px}.pill{padding:6px 11px}.arrow{width:27px;height:27px}.artrow{gap:9px;margin-bottom:21px}.art{height:160px;border-radius:15px}.art.mid{height:215px}.down{margin-bottom:18px}.classes{padding:21px 16px;border-radius:22px}.classhead{gap:14px;margin-bottom:22px}.classhead h2{font-size:15px;white-space:nowrap}.classhead p{font-size:11px}.grid{gap:9px}.card{padding:13px 10px 10px;border-radius:15px;min-height:205px}.card h3{font-size:12px;margin:2px 0 13px;min-height:35px}.card .arrow{right:8px;top:8px;width:31px;height:31px;font-size:19px}.card p{font-size:9px;padding:11px 0;min-height:69px}.thumb{height:65px;border-radius:9px}.quote{padding-top:28px}.quote h2{font-size:clamp(19px,4.7vw,27px)}.quote p{font-size:10px}.spark{font-size:28px;top:40px}.footer{font-size:9px;padding-top:14px}.logoend{font-size:27px;letter-spacing:-6px}}
@media(max-width:430px){.hero h1{font-size:26px}.scribble{display:none}.meta{align-items:flex-end}.meta>div:first-child{max-width:130px}.artrow{gap:7px}.art{height:130px;border-radius:12px}.art.mid{height:180px}.classes{padding:19px 11px}.classhead{display:block}.classhead p{margin-top:9px}.grid{grid-template-columns:1fr;gap:10px}.card{min-height:0;display:grid;grid-template-columns:1fr 42%;column-gap:12px;padding:14px}.card h3{grid-column:1;grid-row:1;margin-right:34px;min-height:0}.card p{grid-column:1;grid-row:2;min-height:0;padding:10px 0}.thumb{grid-column:2;grid-row:1/span 2;height:100%;min-height:95px}.spark{display:none}.logoend{font-size:24px}}
.nav{min-height:56px;border-bottom-color:#c9c6c2;gap:24px}
.links a,.nav>a:not(.brand){font-weight:600;transition:color .18s ease}
.links a:hover,.nav>a:not(.brand):hover{color:#173fa8}
.brand{gap:9px}
.brandmark{display:grid;place-items:center;width:30px;height:30px;border-radius:10px 4px 10px 4px;background:#f0cc58;color:#5b4714;font-size:20px;text-shadow:none}
.brand small{margin-bottom:3px;color:#827a72;font-size:8px;letter-spacing:.12em;text-transform:uppercase}
.brand>span:last-child{font-size:11px;letter-spacing:.08em;line-height:1.05}
.contact{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--blue);border-radius:999px;padding:9px 15px;background:var(--blue);box-shadow:0 4px 12px #245be82b;color:#fff;font-size:12px;font-weight:700;transition:background .18s ease,box-shadow .18s ease,transform .18s ease}
.contact:hover{background:#1948c7;box-shadow:0 6px 16px #245be83d;transform:translateY(-1px)}
.contact b{color:inherit;font-size:15px;line-height:1}
.menu{width:34px;height:34px;place-items:center;border-radius:50%;background:#e9eefc;font-size:18px;line-height:1}
.contact:focus-visible,.menu:focus-visible,.nav>a:focus-visible,.links a:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media(max-width:700px){.nav{min-height:54px}.nav{gap:10px}.brand{margin:0 auto 0 0;gap:7px}.brandmark{width:27px;height:27px;font-size:18px}.brand>span:last-child{font-size:10px}.contact{gap:5px;padding:8px 10px;font-size:10px}}
@media(max-width:430px){.nav{gap:7px}.brandmark{width:25px;height:25px}.brand>span:last-child{font-size:9px}.brand small{font-size:7px}.contact{gap:4px;padding:7px 8px;font-size:9px}.contact b{font-size:13px}}
@media(max-width:350px){.nav{gap:5px}.brand{gap:5px}.brandmark{width:22px;height:22px;font-size:16px}.brand>span:last-child{font-size:8px;letter-spacing:.04em}.brand small{font-size:6px;letter-spacing:.08em}.nav>a:not(.brand){font-size:9px}.contact{gap:3px;padding:6px;font-size:8px}.contact b{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

:root{--bg:#242321;--paper:#f4f3f0;--blue:#245be8;--ink:#242321;--muted:#696661;--line:#d8d6d1}
body{font-family:Inter,"Segoe UI",Arial,sans-serif}
.wrap{width:min(1240px,calc(100% - 48px));margin:36px auto}
.sheet{padding:28px 56px 30px;border-radius:28px;background:var(--paper)}
.star{display:none}
.nav{height:66px;min-height:66px;gap:30px;font-size:13px}
.brand{gap:10px;font-size:12px;letter-spacing:.08em}
.brandmark{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-size:19px;text-shadow:none}
.brand-logo{display:block;width:118px;height:28px;object-fit:cover;object-position:center 50%;filter:brightness(0)}
.brand small{margin-bottom:2px;color:var(--muted);font-size:8px;letter-spacing:.12em;text-transform:uppercase}
.links{gap:24px}
.nav>a:not(.brand){font-size:13px}
.contact{display:flex;align-items:center;gap:10px;padding:11px 16px;border-color:var(--blue);background:var(--blue);color:#fff}
.contact b{color:inherit}
.hero{text-align:left;padding:76px 0 28px}
.hero:before{content:"DISEÑO GRÁFICO · IDENTIDAD · WEB";display:block;margin-bottom:22px;color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.16em}
.hero h1{max-width:980px;margin:0;font-size:clamp(48px,8vw,92px);line-height:.97;letter-spacing:-.075em;font-weight:750}
.hero h1 em{color:var(--blue);font-style:normal}
.checks,.scribble{display:none}
.meta{max-width:none;align-items:center;margin:30px 0 0;color:var(--ink)}
.meta>div:first-child{font-size:15px;line-height:1.5}
.meta strong{color:var(--muted);font-size:13px}
.join{gap:10px}
.pill{padding:11px 20px;border-color:var(--blue);background:var(--blue);color:white;font-weight:700}
.pill:hover{background:#1948c7}
.arrow{width:42px;height:42px;background:var(--blue);font-size:22px}
.artrow{max-width:none;grid-template-columns:.9fr 1.2fr .9fr;gap:20px;margin:8px 0 30px}
.art{height:290px;border-radius:20px;background:#dfdcd5}
.art.mid{height:360px;background:#e6e2dc}
.down{margin:4px auto 34px}
.classes{padding:48px 42px 35px;border:1px solid var(--line);border-radius:26px;background:#eeede9}
.classhead{align-items:flex-end;margin-bottom:28px}
.classhead h2{max-width:510px;color:var(--ink);font-size:clamp(29px,4vw,46px);line-height:1;letter-spacing:-.055em}
.classhead p{max-width:380px;color:var(--muted);font-size:14px;line-height:1.5}
.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{min-height:330px;padding:22px;border:1px solid #3b3936;border-radius:18px;background:#292826;transition:transform .2s,border-color .2s,box-shadow .2s}
.card:hover{transform:translateY(-5px);border-color:#57534e;box-shadow:0 16px 32px #2423211c}
.card-kicker{margin:0 50px 14px 0;color:#aaa6a0;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.card h3{min-height:0;margin:0 50px 10px 0;font-size:21px;font-weight:650;line-height:1.1;letter-spacing:-.035em}
.card .arrow{top:18px;right:18px;width:40px;height:40px}
.card p{min-height:54px;padding:0 0 17px;border:0;color:#d0cdc8;font-size:13px;line-height:1.45}
.card p.card-kicker{min-height:0;margin:0 50px 14px 0;padding:0;color:#aaa6a0;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.thumb{height:135px;margin-top:auto;border-radius:12px;background:#e8e6e1}
.thumb svg{display:block}
.quote{padding:65px 0 12px}
.quote h2{max-width:750px;font-size:clamp(30px,5vw,54px);line-height:1.08}
.quote p{color:var(--muted);font-size:13px}
.spark{top:74px}
.footer{padding:24px 4px 0;color:var(--muted);font-size:12px}
.logoend{color:var(--ink)}
.toast{z-index:30}
@media(max-width:900px){
 .wrap{width:min(100% - 32px,760px);margin:22px auto}
 .sheet{padding:22px 30px 26px}
 .hero{padding-top:58px}
 .artrow{gap:12px}
 .art{height:235px}
 .art.mid{height:295px}
 .classes{padding:34px 26px 28px}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .card{min-height:315px}
}
@media(max-width:700px){
 .wrap{width:calc(100% - 20px);margin:10px auto}
 .star{display:none}
 .sheet{padding:14px 16px 20px;border-radius:20px}
 .nav{height:54px;min-height:54px;gap:10px}
 .links{top:51px}
 .brand{margin:0 auto 0 0}
 .brand-logo{width:96px;height:25px}
 .nav>a:not(.brand){font-size:11px}
 .contact{padding:9px 10px;font-size:10px}
 .hero{padding:54px 0 25px}
 .hero:before{max-width:230px;font-size:9px;letter-spacing:.12em}
 .hero h1{font-size:clamp(42px,10vw,66px)}
 .meta{margin-top:22px}
 .meta>div:first-child{font-size:13px}
 .artrow{grid-template-columns:.85fr 1.15fr .85fr;gap:8px;margin-bottom:20px}
 .art{height:170px;border-radius:13px}
 .art.mid{height:215px}
 .down{margin-bottom:22px}
 .classes{padding:27px 20px 22px;border-radius:19px}
 .classhead{display:block;margin-bottom:22px}
 .classhead h2{font-size:32px}
 .classhead p{margin-top:10px;font-size:13px}
 .grid{gap:11px}
 .card{min-height:300px;padding:16px;border-radius:15px}
 .card h3{font-size:18px}
 .card-kicker{font-size:9px}
 .card .arrow{top:13px;right:13px;width:34px;height:34px;font-size:20px}
 .card p{font-size:12px}
 .thumb{height:110px}
 .quote{padding-top:44px}
 .quote h2{font-size:clamp(27px,7vw,40px)}
 .spark{top:49px}
}
@media(max-width:480px){
 .sheet{padding-right:13px;padding-left:13px}
 .nav{gap:7px}
 .brand{gap:6px}
 .brand-logo{width:84px;height:22px}
 .brand>span:last-child{font-size:9px}
 .brand small{font-size:7px}
 .nav>a:not(.brand){font-size:10px}
 .contact{gap:4px;padding:8px;font-size:9px}
 .hero{padding-top:46px}
 .hero h1{font-size:clamp(38px,11vw,52px)}
 .artrow{gap:6px}
 .art{height:130px;border-radius:10px}
 .art.mid{height:170px}
 .classes{padding:24px 14px 18px}
 .classhead h2{font-size:29px}
 .grid{grid-template-columns:1fr}
 .card{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 42%;column-gap:12px;padding:15px}
 .card-kicker,.card h3,.card p{grid-column:1}
 .card-kicker{grid-row:1;margin-bottom:8px}
 .card h3{grid-row:2;margin:0 32px 8px 0;font-size:19px}
 .card p{grid-row:3;min-height:0;margin:0;padding:0}
 .card .arrow{top:12px;right:12px;width:31px;height:31px;font-size:18px}
 .thumb{grid-column:2;grid-row:1/span 3;align-self:stretch;height:auto;min-height:104px}
 .footer{font-size:10px}
}
html,body{width:100%;min-width:320px;background:var(--paper)}
body{overflow-x:hidden}
.wrap{width:100%;max-width:none;margin:0;position:static}
.sheet{width:100%;min-height:100vh;padding:24px clamp(20px,6vw,100px) 28px;border-radius:0;overflow:hidden}
.star{display:none}
.nav,.hero,.classes,.footer{max-width:1600px;margin-right:auto;margin-left:auto}
.nav{width:100%}
.hero{padding-top:clamp(58px,8vw,108px)}
.hero h1{max-width:1200px}
.meta{max-width:1200px}
.artrow{display:block;position:relative;width:calc(100% + 2 * clamp(20px,6vw,100px));max-width:none;margin:22px calc(-1 * clamp(20px,6vw,100px)) 38px}
.banner-window{position:relative;width:100%;overflow:hidden;padding:24px 0 32px;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);cursor:grab;touch-action:pan-y;user-select:none}
.banner-window.is-dragging{cursor:grabbing}
.banner-toggle{position:absolute;z-index:2;top:3px;right:12px;border:1px solid var(--ink);border-radius:20px;padding:6px 12px;background:var(--paper);color:var(--ink);font-size:12px}
.banner-toggle:hover{background:var(--blue);border-color:var(--blue);color:white}
.banner-track{display:flex;width:max-content;will-change:transform}
.banner-track img{user-select:none;-webkit-user-drag:none}
.banner-group{display:flex;flex:none;align-items:flex-start;gap:clamp(12px,2vw,24px);padding-right:clamp(12px,2vw,24px)}
.banner-card{position:relative;flex:none;display:grid;place-items:center;width:var(--banner-width);height:var(--banner-height);overflow:hidden;border:0;border-radius:0;background:transparent;box-shadow:none}
.banner-card img{display:block;width:100%;height:100%;object-fit:contain}
.banner-card:nth-child(1){--banner-width:340px;--banner-height:240px}
.banner-card:nth-child(2){--banner-width:390px;--banner-height:280px}
.banner-card:nth-child(3){--banner-width:300px;--banner-height:230px}
.banner-card:nth-child(4){--banner-width:420px;--banner-height:300px}
.banner-card:nth-child(5){--banner-width:330px;--banner-height:250px}
.banner-card:nth-child(6){--banner-width:370px;--banner-height:270px}
.banner-card:nth-child(7){--banner-width:310px;--banner-height:230px}
.banner-card:nth-child(8){--banner-width:400px;--banner-height:290px}
.banner-card:nth-child(9){--banner-width:350px;--banner-height:260px}
.banner-card:nth-child(10){--banner-width:380px;--banner-height:280px}
.down{margin-bottom:34px}
.classes{width:100%;padding:clamp(28px,4vw,58px);border-radius:24px}
.classhead h2{white-space:normal;overflow-wrap:anywhere}
.spark{display:none}
.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{display:flex;min-width:0;min-height:0;padding:22px}
.card .card-kicker{margin-bottom:14px}
.card h3{min-height:2.2em}
.card p:not(.card-kicker){min-height:3.1em}
.thumb{display:grid;place-items:center;width:100%;height:auto;min-height:0;aspect-ratio:1;margin-top:14px;padding:0;border-radius:13px;background:#f0efec}
.thumb img{display:block;width:100%;height:100%;object-fit:cover}
.thumb .asset-placeholder{color:#77736d;font-size:11px;letter-spacing:.08em;text-align:center;text-transform:uppercase}
.thumb img[hidden],.banner-card img[hidden]{display:none}
.footer{width:100%;min-height:110px;padding:26px 0 0}
.logoend{display:grid;place-items:center;width:64px;height:22px;margin:0;padding:0;background:transparent;overflow:hidden}
.logoend img{display:block;width:60px;height:18px;object-fit:cover;object-position:center 50%;filter:brightness(0);opacity:.82}
.contact{border-color:#168a55;background:#168a55;color:#fff}
.contact b{color:inherit}
.pill{border-color:#168a55;background:#168a55;color:white}
.pill:hover{background:#117346}
@media(max-width:900px){
 .sheet{padding-right:clamp(20px,5vw,48px);padding-left:clamp(20px,5vw,48px)}
 .artrow{width:calc(100% + 2 * clamp(20px,5vw,48px));margin-right:calc(-1 * clamp(20px,5vw,48px));margin-left:calc(-1 * clamp(20px,5vw,48px))}
 .banner-card{width:calc(var(--banner-width) * .82);height:calc(var(--banner-height) * .82)}
 .classes{padding:30px 26px}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .sheet{padding:12px 16px 22px}
 .nav{gap:9px}
 .hero{padding-top:54px}
 .hero h1{font-size:clamp(40px,10vw,64px)}
 .meta{align-items:flex-start;gap:18px}
 .meta>div:first-child{max-width:60%}
 .join{flex:none}
 .artrow{width:calc(100% + 32px);margin:8px -16px 25px}
 .banner-window{padding:18px 0 25px}
 .banner-card{width:calc(var(--banner-width) * .68);height:calc(var(--banner-height) * .68);border-radius:16px}
 .classes{padding:26px 18px;border-radius:18px}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .card{display:flex;min-height:0;padding:16px}
 .card .card-kicker{margin-bottom:10px}
 .card h3{min-height:2.2em;font-size:18px}
 .card p:not(.card-kicker){min-height:4.3em;font-size:12px}
 .thumb{grid-column:auto;grid-row:auto;align-self:auto;height:auto;min-height:0;aspect-ratio:1;margin-top:10px;padding:0}
 .footer{gap:12px;flex-wrap:wrap}
 .logoend{width:56px;height:20px}
 .logoend img{width:52px;height:16px}
}
@media(max-width:480px){
 .sheet{padding-right:12px;padding-left:12px}
 .hero{padding-top:45px}
 .meta{flex-wrap:wrap}
 .meta>div:first-child{max-width:none}
 .join{width:100%}
 .artrow{width:calc(100% + 24px);margin-right:-12px;margin-left:-12px}
 .banner-card{width:calc(var(--banner-width) * .58);height:calc(var(--banner-height) * .58);border-radius:14px}
 .classes{padding:20px 12px}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .card{display:flex;padding:11px;border-radius:13px}
 .card .card-kicker{margin-bottom:8px;font-size:9px}
 .card h3{min-height:0;margin:0 28px 8px 0;font-size:15px}
 .card .arrow{top:9px;right:8px;width:28px;height:28px;font-size:17px}
 .card p:not(.card-kicker){min-height:0;margin:0;padding:0;font-size:10px}
 .thumb{align-self:auto;aspect-ratio:1;min-height:0;margin-top:10px;padding:0;border-radius:9px}
 .footer{font-size:10px}
 .classes .classhead h2{max-width:100%;font-size:clamp(26px,7vw,32px);line-height:1.08}
}