:root{--bg:#0d0d0d;--card:#161616;--tx:#f5f5f5;--mut:#a3a3a3;--o:#f58220;--r:#dc1f3c;--g:linear-gradient(135deg,#f58220,#dc1f3c);color-scheme:dark;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;margin:0}html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{background:var(--bg);color:var(--tx);font-family:Sora,system-ui,sans-serif;overflow-x:hidden}
header{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px 4vw;padding-top:calc(14px + env(safe-area-inset-top,0px));background:linear-gradient(#0d0d0dee,transparent)}
header img{height:38px}nav{display:flex;gap:26px;font-size:13px;color:var(--mut)}nav a{color:inherit;text-decoration:none}nav a:first-child{color:var(--tx)}
.av{width:36px;height:36px;border-radius:50%;background:var(--g);display:grid;place-items:center;font-weight:800;font-size:13px}
.hero{position:relative;min-height:88vh;display:flex;align-items:center;padding:110px 4vw 70px;overflow:hidden;
background:radial-gradient(60% 70% at 85% 30%,#f5822040,transparent 70%),radial-gradient(50% 60% at 100% 100%,#dc1f3c55,transparent 70%),linear-gradient(115deg,#0d0d0d 40%,#1a0c0a)}
.hero:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(105deg,transparent 0 90px,#ffffff06 90px 91px),linear-gradient(90deg,#0d0d0d 30%,transparent 80%)}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(transparent,var(--bg))}
.wm{position:absolute;right:4vw;top:50%;transform:translateY(-50%);width:min(40vw,520px);opacity:.14;filter:brightness(0) invert(1)}
.hc{position:relative;z-index:2;max-width:620px}
.kick{font-size:11px;letter-spacing:.4em;font-weight:600;color:var(--o)}.sub{font-size:12px;color:var(--mut);font-style:italic;margin:6px 0 20px}
h1{font-size:clamp(26px,3.6vw,44px);line-height:1.15;font-weight:600;letter-spacing:-.01em;margin-bottom:16px}h1 span{background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
.hc p{color:#a8a8a8;line-height:1.7;font-size:clamp(13px,1.1vw,15px);font-weight:400;margin-bottom:30px;max-width:420px}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--g);color:#fff;border:0;padding:14px 28px;border-radius:4px;font:600 12px Sora,sans-serif;letter-spacing:.16em;cursor:pointer;box-shadow:0 10px 40px #dc1f3c55;transition:.2s}.btn:hover{transform:translateY(-2px)}
main{position:relative;z-index:3;margin-top:-60px;padding-bottom:60px}
.sec{margin-bottom:46px}.sh{padding:0 4vw;margin-bottom:14px;display:flex;align-items:end;justify-content:space-between}
.sh small{display:block;color:var(--o);font-size:10px;letter-spacing:.3em;font-weight:600;margin-bottom:4px}.sh h2{font-size:clamp(15px,1.5vw,19px);font-weight:600;letter-spacing:.01em}
.ar{display:flex;gap:8px}.ar button{width:38px;height:38px;border-radius:50%;border:1px solid #333;background:#161616;color:#fff;cursor:pointer;font-size:16px}.ar button:hover{border-color:var(--o)}
.row{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 4vw 20px;scroll-padding:0 4vw;scrollbar-width:none}.row::-webkit-scrollbar{display:none}
.card{position:relative;flex:0 0 clamp(210px,19vw,280px);aspect-ratio:3/4;border-radius:12px;overflow:hidden;scroll-snap-align:start;cursor:pointer;transition:transform .3s,box-shadow .3s;isolation:isolate;background:var(--card)}
.card.w{flex-basis:clamp(260px,28vw,400px);aspect-ratio:16/10}
.card:hover{transform:scale(1.05);box-shadow:0 18px 50px #000c,0 0 0 1px #f5822080;z-index:5}
.bg{position:absolute;inset:0;z-index:-2}
.card:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(transparent 35%,#000000e6)}
.num{position:absolute;top:10px;left:16px;font-size:44px;font-weight:300;color:transparent;-webkit-text-stroke:1px #ffffff99;line-height:1}
.ic{position:absolute;top:16px;right:16px;width:34px;height:34px;stroke:#fff;fill:none;stroke-width:1.6;opacity:.9}
.mk{position:absolute;right:-14px;bottom:30px;width:120px;opacity:.12;filter:brightness(0) invert(1)}
.ct{position:absolute;left:0;right:0;bottom:0;padding:16px}.ct small{display:none}.card.w .ct small{display:block;font-size:9px;letter-spacing:.25em;color:#ffffffaa;margin-bottom:4px}.ct h3{font-size:13px;line-height:1.3;font-weight:600;letter-spacing:.01em;max-width:85%}
.ov{position:absolute;inset:auto 0 0 0;padding:16px;display:flex;gap:8px;opacity:0;transform:translateY(12px);transition:.3s;background:linear-gradient(transparent,#000)}
.card:hover .ov,.card:focus-within .ov{opacity:1;transform:none}.card:hover .ct{transform:translateY(-44px)}.ct{transition:.3s}
.ov a{flex:1;text-align:center;padding:9px;border-radius:4px;font-size:11px;font-weight:600;letter-spacing:.08em;text-decoration:none;background:#fff;color:#000}.ov a+a{background:#ffffff25;color:#fff;flex:0 0 40px}
.note{margin:0 4vw;padding:12px 16px;border:1px dashed #444;border-radius:8px;color:var(--mut);font-size:12px}
@media(max-width:768px){nav{display:none}.hero{min-height:78vh;padding-top:100px;align-items:flex-end}.wm{width:70vw;top:30%;right:-10vw}.btn{width:100%;justify-content:center}.ar{display:none}.card{flex-basis:62vw}.card.w{flex-basis:78vw}.num{font-size:38px}.ov{opacity:1;transform:none;background:none;padding:12px;position:static}.card .ov{display:none}.card:hover{transform:none}}
@media(hover:none){.card:hover{transform:none}}
