/* Source: DigitalOcean gaming-development, Tools section: horizontal tabs and split content. */
.gre-use-cases { padding: 76px 40px 82px; background: #102d56; color: #fff; }
.gre-use-cases-inner { max-width: 1160px; margin: auto; }
.gre-use-cases h2 { margin: 0 0 36px; text-align: center; font: 550 clamp(29px, 2.8vw, 38px)/1.3 Montserrat, Inter, sans-serif; letter-spacing: -.04em; }
.gre-use-case-tabs { display: flex; justify-content: center; gap: 34px; margin-bottom: 48px; border-bottom: 1px solid #ffffff30; }
.gre-use-case-tabs button { position: relative; padding: 16px 4px; border: 0; background: transparent; color: #c1d2e9; font-size: 15px; cursor: pointer; }
.gre-use-case-tabs button[aria-selected="true"] { color: #fff; font-weight: 600; }
.gre-use-case-tabs button[aria-selected="true"]::after { content: ''; position: absolute; inset: auto 0 -1px; height: 3px; background: #80bdff; }
.gre-use-case-tabs button:hover { color: #fff; }
.gre-use-case-panel { display: grid; grid-template-columns: 1fr 1.25fr; align-items: start; gap: 90px; padding: 12px 0; }
.gre-use-case-panel + .gre-use-case-panel { margin-top: 35px; }
.gre-use-case-panel h3 { max-width: 430px; margin: 0; font: 500 clamp(30px, 3vw, 42px)/1.25 Montserrat, Inter, sans-serif; letter-spacing: -.045em; text-wrap: balance; }
.gre-use-case-copy p { margin: 0; font-size: 16px; line-height: 1.85; color: #d0ddef; }
.gre-use-case-copy p + p { margin-top: 20px; }
.gre-use-case-copy a { display: inline-flex; gap: 25px; margin-top: 28px; color: #fff; text-decoration: none; font-size: 14px; font-weight: 600; }
.gre-use-case-copy a:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 1000px) { .gre-use-case-panel { gap: 44px; } }
@media (max-width: 760px) { .gre-use-cases { padding: 48px 24px; } .gre-use-cases h2 { text-align: left; font-size: 30px; } .gre-use-case-tabs { justify-content: flex-start; gap: 20px; overflow-x: auto; margin-bottom: 30px; } .gre-use-case-tabs button { white-space: nowrap; font-size: 13px; padding-block: 14px; } .gre-use-case-panel { grid-template-columns: 1fr; gap: 25px; } .gre-use-case-panel h3 { font-size: 30px; } .gre-use-case-copy p { font-size: 14px; } }