.bento-why{--glow-x:50%;--glow-y:50%;--glow-intensity:0;--glow-radius:200px;--glow-color:52,152,219}@property --bento-spin{syntax:"<angle>";inherits:false;initial-value:0deg}.card-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,minmax(150px,auto));grid-template-areas:"villain villain hero    hero" "coda    coda    hero    hero" "coda    coda    mission vision";gap:16px;width:100%;perspective:1600px}.magic-bento-card{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:180px;padding:22px 24px;border-radius:20px;background:radial-gradient(120% 90% at 88% -12%,rgba(52,152,219,.18) 0,transparent 55%),radial-gradient(110% 100% at -12% 112%,rgba(44,62,80,.1) 0,transparent 55%),linear-gradient(155deg,rgba(255,255,255,.96),rgba(242,248,255,.88) 45%,rgba(228,240,255,.82));border:1.5px solid rgba(255,255,255,.9);border-top:2px solid #ffffff;box-shadow:0 12px 32px rgba(80,120,200,.14),inset 0 1px 0 rgba(255,255,255,1);color:#2b2f3a;transition:box-shadow .35s ease;will-change:transform;overflow:hidden}.magic-bento-card:first-child{grid-area:villain}.magic-bento-card:nth-child(2){grid-area:hero}.magic-bento-card:nth-child(3){grid-area:coda}.magic-bento-card:nth-child(4){grid-area:mission}.magic-bento-card:nth-child(5){grid-area:vision}.magic-bento-card:hover{box-shadow:0 45px 90px rgba(44,62,80,.28),0 20px 45px rgba(52,152,219,.26),inset 0 1px 0 rgba(255,255,255,1)}.magic-bento-card:before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;background:conic-gradient(from var(--bento-spin),rgba(52,152,219,0) 0deg,rgba(52,152,219,.9) 80deg,rgba(255,255,255,.95) 120deg,rgba(44,62,80,.85) 200deg,rgba(52,152,219,.9) 280deg,rgba(52,152,219,0) 1turn);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:3}.magic-bento-card:hover:before{opacity:1;animation:bento-spin 3.2s linear infinite}@keyframes bento-spin{to{--bento-spin:360deg}}.magic-bento-card--featured{background:radial-gradient(120% 100% at 90% -10%,rgba(52,152,219,.55) 0,transparent 55%),radial-gradient(130% 110% at -10% 120%,rgba(93,182,245,.3) 0,transparent 60%),linear-gradient(155deg,#22303f,#2c3e50 45%,#2e5f86);border:1.5px solid rgba(120,190,255,.45);border-top:2px solid rgba(190,225,255,.75);box-shadow:0 18px 44px rgba(26,46,66,.35),inset 0 1px 0 rgba(190,225,255,.45)}.magic-bento-card--featured:hover{box-shadow:0 45px 90px rgba(26,46,66,.48),0 20px 45px rgba(52,152,219,.42),inset 0 1px 0 rgba(190,225,255,.55)}.magic-bento-card__header{display:flex;align-items:center;gap:8px;margin-bottom:14px}.magic-bento-card__label{font-size:clamp(20px,2.1vw,30px);font-weight:800;letter-spacing:-.01em;line-height:1.1;background-image:linear-gradient(90deg,#2c3e50,#3498db 22%,#bfe3ff 50%,#3498db 78%,#2c3e50);background-size:300% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;transition:background-position .9s ease}.magic-bento-card:hover .magic-bento-card__label{background-position:100% 0}.magic-bento-card--featured .magic-bento-card__label{background-image:linear-gradient(90deg,#ffffff,#cfe9ff 22%,#7cc4f0 50%,#cfe9ff 78%,#ffffff)}.magic-bento-card__content{display:flex;flex-direction:column;gap:6px}.magic-bento-card__title{margin:0;font-size:17px;font-weight:800;line-height:1.25;color:#1a1e2a}.magic-bento-card__description{margin:0;font-size:14.5px;line-height:1.55;color:#5a6275;white-space:pre-line}.magic-bento-card--featured .magic-bento-card__description{color:rgba(235,244,255,.94);font-weight:600;font-size:15.5px}.magic-bento-card--featured .magic-bento-card__title{color:#ffffff}.magic-bento-card--border-glow:after{content:"";position:absolute;inset:0;padding:1.5px;border-radius:inherit;background:radial-gradient(var(--glow-radius) circle at var(--glow-x) var(--glow-y),rgba(var(--glow-color),calc(var(--glow-intensity) * .7)) 0,rgba(var(--glow-color),calc(var(--glow-intensity) * .3)) 35%,transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;transition:opacity .3s ease;z-index:2}.particle-container{position:relative}@media (max-width:768px){.card-grid{grid-template-columns:1fr;grid-template-rows:none;grid-template-areas:none;gap:14px}.magic-bento-card:first-child,.magic-bento-card:nth-child(2),.magic-bento-card:nth-child(3),.magic-bento-card:nth-child(4),.magic-bento-card:nth-child(5){grid-area:auto}}@media (prefers-reduced-motion:reduce){.magic-bento-card,.magic-bento-card__label{transition:none}.magic-bento-card:hover:before{animation:none}}