.bento{background:var(--c-gray-bg);justify-content:center;align-items:center;min-height:100dvh;padding:24px 16px;display:flex;position:relative}.bento:before{content:"";pointer-events:none;background-image:radial-gradient(circle,#00000008 1px,#0000 1px);background-size:24px 24px;position:absolute;inset:0}.bento-grid{grid-template-columns:1fr 1fr;grid-auto-rows:minmax(180px,auto);gap:14px;width:100%;max-width:1140px;display:grid;position:relative}@media (width>=640px){.bento-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(220px,auto);gap:16px}}@media (width>=1024px){.bento-grid{grid-template-rows:auto auto auto auto;grid-template-columns:repeat(6,1fr);grid-template-areas:"hero hero hero hero stack stack""hero hero hero hero li gh""w0 w0 w1 w1 w2 w2""w3 w3 w4 w4 cont cont";gap:18px}.b-hero{grid-area:hero}.b-stack{grid-area:stack}.b-li{grid-area:li}.b-gh{grid-area:gh}.b-w0{grid-area:w0}.b-w1{grid-area:w1}.b-w2{grid-area:w2}.b-w3{grid-area:w3}.b-w4{grid-area:w4}.b-contact{grid-area:cont}}.cell{animation:cell-in .6s var(--ease-out) both;border-radius:24px;flex-direction:column;padding:24px;display:flex;position:relative;overflow:hidden}@media (width>=640px){.cell{border-radius:28px}}@keyframes cell-in{0%{opacity:0;transform:translateY(20px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.cell:first-child{animation-delay:0s}.cell:nth-child(2){animation-delay:50ms}.cell:nth-child(3){animation-delay:80ms}.cell:nth-child(4){animation-delay:.11s}.cell:nth-child(5){animation-delay:.14s}.cell:nth-child(6){animation-delay:.17s}.cell:nth-child(7){animation-delay:.2s}.cell:nth-child(8){animation-delay:.23s}.cell:nth-child(9){animation-delay:.26s}.cell:nth-child(10){animation-delay:.29s}.cell-white{background:#fff;border:1px solid #0000000a;box-shadow:0 1px 3px #00000005,0 8px 28px #0000000f}.cell-orange{background:linear-gradient(145deg,#ff8a1f,#ff7900,#e86e00);box-shadow:0 2px 8px #ff79001f,0 12px 36px #ff790038}.cell-pink{background:linear-gradient(145deg,#ff5296,#ff3885,#e83078);box-shadow:0 2px 8px #ff38851f,0 12px 36px #ff388538}.cell-green{background:linear-gradient(145deg,#1abf1a,#00a800,#009800);box-shadow:0 2px 8px #00a8001f,0 12px 36px #00a80038}.cell-blue{background:linear-gradient(145deg,#1a8cc7,#0072b1,#0065a0);box-shadow:0 2px 8px #0072b11f,0 12px 36px #0072b13d}.cell-dark{background:linear-gradient(145deg,#2d343a,#24292e,#1b2025);box-shadow:0 2px 8px #0000001a,0 12px 36px #0000003d}.cell-hover{transition:transform .45s var(--ease-spring), box-shadow .4s var(--ease-smooth)}.cell-hover:hover{transform:scale(1.018)translateY(-5px)}.cell-white.cell-hover:hover{border-color:#0000000f;box-shadow:0 2px 8px #0000000a,0 24px 56px #0000001a}.cell-orange.cell-hover:hover{box-shadow:0 4px 14px #ff79002e,0 28px 64px #ff790052}.cell-pink.cell-hover:hover{box-shadow:0 4px 14px #ff38852e,0 28px 64px #ff388552}.cell-green.cell-hover:hover{box-shadow:0 4px 14px #00a8002e,0 28px 64px #00a80052}.cell-blue.cell-hover:hover{box-shadow:0 4px 14px #0072b12e,0 28px 64px #0072b159}.cell-dark.cell-hover:hover{box-shadow:0 4px 14px #0003,0 28px 64px #00000059}.b-hero{padding:32px}@media (width>=1024px){.b-hero{padding:40px}}.hero-content{flex-direction:column;justify-content:center;align-items:flex-start;gap:20px;height:100%;display:flex}@media (width>=640px){.hero-content{flex-direction:row;align-items:center;gap:32px}}.hero-avatar{flex-shrink:0;width:90px;height:90px}@media (width>=1024px){.hero-avatar{width:120px;height:120px}}.hero-text{flex:1}.hero-greeting{font-family:var(--f-bold);color:var(--c-gray);letter-spacing:.05em;text-transform:uppercase;margin:0 0 8px;font-size:.88rem;font-weight:600}.hero-name{font-family:var(--f-display);letter-spacing:-.03em;color:var(--c-black);margin:0 0 14px;font-size:2.6rem;line-height:1.02}@media (width>=1024px){.hero-name{font-size:3.4rem}}.hero-desc{font-family:var(--f-bold);color:var(--c-gray-2);letter-spacing:-.01em;margin:0;font-size:1.08rem;font-weight:400;line-height:1.6}.hero-arrow{background:var(--c-green);color:#fff;width:40px;height:40px;transition:transform .35s var(--ease-spring), box-shadow .3s ease;border-radius:50%;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex;position:absolute;bottom:24px;right:24px;box-shadow:0 3px 12px #00a80047}@media (width>=1024px){.hero-arrow{bottom:32px;right:32px}}.cell-hover:hover .hero-arrow{transform:scale(1.12)rotate(-8deg);box-shadow:0 6px 20px #00a80059}.work-cell{background:var(--accent);min-height:240px;box-shadow:0 2px 8px color-mix(in srgb, var(--accent) 14%, transparent), 0 12px 36px color-mix(in srgb, var(--accent) 24%, transparent);padding:0;text-decoration:none}.work-cell.cell-hover:hover{box-shadow:0 4px 14px color-mix(in srgb, var(--accent) 20%, transparent), 0 28px 64px color-mix(in srgb, var(--accent) 38%, transparent)}.work-bg{object-fit:cover;width:100%;height:100%;transition:transform .6s var(--ease-out), filter .4s ease;position:absolute;inset:0}.work-cell:hover .work-bg{transform:scale(1.06)}.b-w3 .work-bg{object-position:top center}.work-gradient{background:linear-gradient(to bottom, transparent 20%, color-mix(in srgb, var(--accent) 30%, transparent) 55%, color-mix(in srgb, var(--accent) 80%, transparent) 80%, var(--accent) 100%);pointer-events:none;transition:opacity .4s;position:absolute;inset:0}.work-bottom{z-index:1;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding:22px 24px;display:flex;position:relative}.work-title{font-family:var(--f-display);letter-spacing:-.02em;color:#fff;text-shadow:0 1px 8px #0003;margin:0;font-size:1.3rem;line-height:1.15}@media (width>=1024px){.work-title{font-size:1.5rem}}.work-arrow{-webkit-backdrop-filter:blur(10px);color:#fff;width:34px;height:34px;transition:background .25s ease, transform .35s var(--ease-spring);background:#fff3;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;font-weight:600;display:flex}.cell-hover:hover .work-arrow{background:#ffffff61;transform:scale(1.1)rotate(-8deg)}.b-stack{text-align:center;cursor:default;user-select:none;padding:22px}.stack-title{font-family:var(--f-display);color:#fff;letter-spacing:-.02em;margin:0 0 16px;font-size:1.4rem}.stack-chips{flex-wrap:wrap;justify-content:center;gap:7px;display:flex}.stack-chip{font-family:var(--f-bold);color:var(--c-black);letter-spacing:-.01em;transition:transform .25s var(--ease-spring), box-shadow .2s ease;background:#ffffffed;border-radius:980px;padding:7px 15px;font-size:.82rem;font-weight:600;box-shadow:0 1px 4px #0000000a}.stack-chip:hover{transform:translateY(-2px);box-shadow:0 3px 10px #00000014}.social-cell{justify-content:center;align-items:center;gap:10px;text-decoration:none}.social-icon{opacity:.92;transition:transform .4s var(--ease-spring), opacity .2s ease}.cell-hover:hover .social-icon{opacity:1;transform:scale(1.06)}.social-handle{font-family:var(--f-bold);color:#ffffffb3;letter-spacing:.02em;font-size:.88rem;font-weight:600;transition:color .2s}.cell-hover:hover .social-handle{color:#fffc}.b-contact{text-align:center;justify-content:center;align-items:center}.contact-title{font-family:var(--f-display);color:#fff;letter-spacing:-.02em;margin:0 0 8px;font-size:1.6rem}.contact-sub{font-family:var(--f-bold);color:#ffffffe0;margin:0 0 22px;font-size:1rem;font-weight:500;line-height:1.5}@media (width<=639px){.b-hero,.b-stack,.b-w0,.b-w1,.b-w4,.b-contact{grid-column:span 2}}@media (width>=640px) and (width<=1023px){.b-hero{grid-column:span 3}.b-stack{grid-column:span 2}.b-w2{grid-column:span 3}.b-w3{grid-column:span 2}.b-contact{grid-column:span 3}}