/* Industries bento: six tiles of different sizes and styles packed into one grid (white, dark, photo, bright accent, grey). */
.bento-sec { background: #f8f8f9; }
.bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(250px, auto); gap: 10px; }
.bento__tile { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 1.2rem; padding: clamp(1.1rem, 1.8vw, 1.7rem); border-radius: 18px; overflow: hidden; isolation: isolate; color: var(--ink-2); background: #fff; border: 1px solid rgba(11,11,14,.07); transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.bento__tile:hover { transform: translateY(-5px); box-shadow: 0 28px 60px -32px rgba(11,11,14,.45); }
.bento__t1 { grid-column: span 2; }
.bento__t2 { grid-row: span 2; }
.bento__t6 { grid-column: span 2; }

.bento__num { align-self: flex-start; font-family: var(--ff-mono); font-size: .76rem; font-weight: 600; padding: .28rem .7rem; border-radius: 999px; background: rgba(11,11,14,.07); color: var(--ink-3); }
.bento__body h2 { font-size: clamp(1.45rem, 1.1rem + 1.2vw, 2.3rem); font-weight: 700; letter-spacing: -0.055em; line-height: 1.02; max-width: 16ch; }
.bento__body p { margin-top: .8rem; max-width: 46ch; color: var(--ink-3); letter-spacing: -0.02em; line-height: 1.5; font-size: .98rem; }
.bento__body .chips { margin-top: 1rem; align-items: center; }
.bento__work { width: 100%; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); }
.bento .chip { background: rgba(11,11,14,.06); border-color: transparent; color: var(--ink-2); transition: background-color .3s, color .3s; }
.bento a.chip:hover { background: var(--purple); color: #fff; }

/* dark: purple glow + a huge outlined number */
.bento__tile--dark { color: #fff; border-color: transparent; background: radial-gradient(70% 90% at 90% 0%, rgba(144,15,255,.6), rgba(144,15,255,0) 70%), radial-gradient(50% 60% at 0% 100%, rgba(144,15,255,.25), rgba(144,15,255,0) 70%), linear-gradient(160deg, #1a0b33, #0b0b10); }
.bento__tile--dark .bento__num { background: rgba(255,255,255,.14); color: rgba(255,255,255,.85); }
.bento__tile--dark .bento__body p { color: rgba(255,255,255,.78); }
.bento__big { position: absolute; right: .4rem; top: -.1em; z-index: -1; font-size: clamp(9rem, 6rem + 12vw, 18rem); font-weight: 700; letter-spacing: -0.08em; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(178,102,255,.4); transition: transform .9s var(--ease); }
.bento__tile--dark:hover .bento__big { transform: translate(-10px, 6px); }

/* photo: project image under a dark gradient */
.bento__tile--photo { color: #fff; border-color: transparent; background: #0b0b0e; }
.bento__bg { position: absolute; inset: 0; z-index: -2; }
.bento__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.75); transition: transform 1.2s var(--ease); }
.bento__tile--photo:hover .bento__bg img { transform: scale(1.06); }
.bento__tile--photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(5,6,9,.95) 0%, rgba(5,6,9,.75) 40%, rgba(5,6,9,.15) 80%); }
.bento__tile--photo .bento__num { background: rgba(255,255,255,.18); color: #fff; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.bento__tile--photo .bento__body p { color: rgba(255,255,255,.88); }
.bento__tile--photo .bento__work { color: rgba(255,255,255,.7); }
.bento__tile--photo .chip { background: rgba(255,255,255,.16); color: #fff; }
.bento__tile--photo a.chip:hover { background: #fff; color: var(--purple); }

/* accent: solid brand purple */
.bento__tile--accent { color: #fff; border-color: transparent; background: var(--purple); }
.bento__tile--accent .bento__num { background: rgba(255,255,255,.2); color: #fff; }
.bento__tile--accent .bento__body p, .bento__tile--accent .bento__work { color: rgba(255,255,255,.9); }
.bento__tile--accent .chip { background: rgba(255,255,255,.2); color: #fff; }
.bento__tile--accent a.chip:hover { background: #fff; color: var(--purple); }
.bento__tile--accent::after { content: ""; position: absolute; right: -40px; top: -40px; width: 180px; height: 180px; border-radius: 50%; z-index: -1; border: 1px solid rgba(255,255,255,.3); box-shadow: 0 0 0 28px rgba(255,255,255,.05), 0 0 0 58px rgba(255,255,255,.04); transition: transform 1s var(--ease); }
.bento__tile--accent:hover::after { transform: scale(1.12); }

/* grey */
.bento__tile--grey { background: #e6e6ea; border-color: transparent; }
.bento__tile--grey .bento__num { background: rgba(11,11,14,.08); }
.bento__tile--grey .chip { background: #fff; }

@media (max-width: 960px) { .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bento__t1, .bento__t6 { grid-column: span 2; } .bento__t2 { grid-row: auto; } }
@media (max-width: 620px) { .bento { grid-template-columns: 1fr; grid-auto-rows: auto; } .bento__t1, .bento__t6 { grid-column: auto; } .bento__tile { min-height: 260px; } }
@media (prefers-reduced-motion: reduce) { .bento__tile, .bento__bg img, .bento__big, .bento__tile--accent::after { transition: none; } .bento__tile:hover { transform: none; } }