/* ═══════════════════════════════════════════════════════ SHARED UTILITIES ═══════════════════════════════════════════════════════ */ .exp-container { max-width: 1160px; margin: 0 auto; padding: 0 24px; } .exp-section-head { font-size: 28px; font-weight: 800; color: #182230; text-align: center; margin-bottom: 40px; } .exp-section-sub { font-size: 15px; color: #667085; text-align: center; margin-top: -28px; margin-bottom: 40px; } /* ═══════════════════════════════════════════════════════ SECTION 1 — HERO ═══════════════════════════════════════════════════════ */ .exp-hero { background: #fff; padding: 80px 0 70px; overflow: hidden; } .exp-hero-inner { display: flex; align-items: center; gap: 48px; } .exp-hero-left { flex: 1; min-width: 0; } .exp-hero-left h1 { font-size: 46px; font-weight: 900; color: #182230; line-height: 1.1; margin-bottom: 16px; letter-spacing: -0.5px; } .exp-hero-left .exp-hero-sub { font-size: 17px; color: #667085; line-height: 1.6; margin-bottom: 32px; max-width: 480px; } .exp-hero-btns { display: flex; gap: 14px; flex-wrap: wrap; } .exp-btn-primary { display: inline-block; padding: 14px 28px; background: #3B61DC; color: #fff; border-radius: 8px; font-size: 15px; font-weight: 700; text-decoration: none; transition: background 0.15s; white-space: nowrap; } .exp-btn-primary:hover { background: #2d4db5; color: #fff; } .exp-btn-outline { display: inline-block; padding: 14px 28px; background: #fff; color: #3B61DC; border: 2px solid #3B61DC; border-radius: 8px; font-size: 15px; font-weight: 700; text-decoration: none; transition: background 0.15s; white-space: nowrap; } .exp-btn-outline:hover { background: #f0f4ff; color: #3B61DC; } /* Hero right — gradient blob */ .exp-hero-right { flex: 0 0 420px; height: 400px; position: relative; } .exp-hero-blob { width: 100%; height: 100%; background: linear-gradient(135deg, #3B61DC 0%, #6b8ef0 40%, #b8c9f8 100%); border-radius: 60% 40% 55% 45% / 50% 55% 45% 50%; position: relative; overflow: hidden; } .exp-hero-blob::before { content: ''; position: absolute; top: 15%; left: 15%; width: 70%; height: 70%; background: rgba(255,255,255,0.12); border-radius: 50%; } .exp-hero-blob::after { content: '$'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 120px; font-weight: 900; color: rgba(255,255,255,0.25); line-height: 1; } /* ═══════════════════════════════════════════════════════ SECTION 2 — HOW IT WORKS ═══════════════════════════════════════════════════════ */ .exp-how { background: #f8f9fa; padding: 60px 0; } .exp-how-cols { display: flex; gap: 32px; justify-content: center; flex-wrap: wrap; } .exp-how-col { flex: 1 1 240px; max-width: 300px; text-align: center; padding: 32px 24px; background: #fff; border-radius: 14px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); } .exp-how-icon { width: 64px; height: 64px; background: #3B61DC; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 18px; } .exp-how-icon i { color: #fff; font-size: 24px; } .exp-how-col h3 { font-size: 17px; font-weight: 700; color: #182230; margin-bottom: 10px; } .exp-how-col p { font-size: 14px; color: #667085; line-height: 1.6; margin: 0; } /* ═══════════════════════════════════════════════════════ SECTION 3 — BROWSE BY CATEGORY ═══════════════════════════════════════════════════════ */ .exp-cats { background: #fff; padding: 60px 0; } .exp-cat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; } .exp-cat-tile { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 24px 16px; background: #f7f8fc; border-radius: 12px; text-decoration: none; color: #182230; font-size: 13px; font-weight: 600; text-align: center; line-height: 1.3; transition: transform 0.15s, box-shadow 0.15s; border: 1px solid #e4e7ec; } .exp-cat-tile:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(59,97,220,0.14); color: #3B61DC; border-color: #3B61DC; } .exp-cat-tile i { font-size: 26px; color: #3B61DC; } /* ═══════════════════════════════════════════════════════ SECTION 4 — FEATURED LOCAL BUSINESSES (CSS overrides on top of the existing deal-listing Livewire component output) ═══════════════════════════════════════════════════════ */ .exp-businesses { background: #fff; padding: 60px 0; border-top: 1px solid #f0f0f0; } .exp-section-head-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; flex-wrap: wrap; gap: 12px; } .exp-section-head-row h2 { font-size: 26px; font-weight: 800; color: #182230; margin: 0; } .exp-view-all { font-size: 14px; font-weight: 600; color: #3B61DC; text-decoration: none; } .exp-view-all:hover { color: #2d4db5; text-decoration: underline; } /* Override deal-listing cards to match new design */ .exp-businesses .deal-listing-wrap, .exp-businesses .cmn-gap { padding: 0 !important; margin: 0 !important; background: transparent !important; } .exp-businesses .container { padding: 0 !important; max-width: 100% !important; } .exp-businesses .section-head, .exp-businesses .section-header, .exp-businesses .explore-head { display: none !important; } .exp-businesses .row { margin: 0 -10px !important; } .exp-businesses .col-md-4 { padding: 10px !important; } /* Business card overrides */ .exp-businesses .deals-item-main, .exp-businesses .business-card, .exp-businesses .deals-box { border-radius: 12px !important; box-shadow: 0 2px 12px rgba(0,0,0,0.07) !important; border: 1px solid #e4e7ec !important; overflow: hidden !important; transition: transform 0.15s, box-shadow 0.15s !important; background: #fff !important; } .exp-businesses .deals-item-main:hover, .exp-businesses .business-card:hover, .exp-businesses .deals-box:hover { transform: translateY(-4px) !important; box-shadow: 0 10px 28px rgba(59,97,220,0.13) !important; } /* ═══════════════════════════════════════════════════════ SECTION 5 — THREE PORTAL CARDS ═══════════════════════════════════════════════════════ */ .exp-portals { background: #EEF2FF; padding: 60px 0; } .exp-portal-cards { display: flex; gap: 24px; flex-wrap: wrap; justify-content: center; } .exp-portal-card { flex: 1 1 280px; max-width: 340px; background: #fff; border-radius: 16px; box-shadow: 0 4px 20px rgba(59,97,220,0.09); padding: 36px 28px 32px; display: flex; flex-direction: column; align-items: flex-start; } .exp-portal-icon { width: 56px; height: 56px; background: #EEF2FF; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; } .exp-portal-icon i { font-size: 24px; color: #3B61DC; } .exp-portal-card h3 { font-size: 18px; font-weight: 700; color: #182230; margin-bottom: 10px; } .exp-portal-card p { font-size: 14px; color: #667085; line-height: 1.6; margin-bottom: 24px; flex: 1; } .exp-portal-btn { display: inline-block; padding: 11px 22px; border: 2px solid #3B61DC; border-radius: 8px; color: #3B61DC; font-size: 14px; font-weight: 700; text-decoration: none; transition: background 0.15s, color 0.15s; } .exp-portal-btn:hover { background: #3B61DC; color: #fff; } /* ═══════════════════════════════════════════════════════ SECTION 6 — APP DOWNLOAD CTA ═══════════════════════════════════════════════════════ */ .exp-app { background: #1a1a2e; padding: 72px 0; text-align: center; } .exp-app h2 { font-size: 34px; font-weight: 800; color: #fff; margin-bottom: 12px; } .exp-app .exp-app-sub { font-size: 16px; color: #a0aec0; margin-bottom: 36px; } .exp-app-btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-bottom: 20px; } .exp-app-btn { display: flex; align-items: center; gap: 10px; padding: 13px 24px; background: #fff; color: #1a1a2e; border-radius: 50px; text-decoration: none; font-size: 14px; font-weight: 700; transition: background 0.15s, color 0.15s; white-space: nowrap; } .exp-app-btn:hover { background: #e8eeff; color: #1a1a2e; } .exp-app-btn i { font-size: 20px; } .exp-app-coming { font-size: 12px; color: #667085; letter-spacing: 0.3px; } /* ═══════════════════════════════════════════════════════ RESPONSIVE ═══════════════════════════════════════════════════════ */ @media (max-width: 991px) { .exp-hero-inner { flex-direction: column; } .exp-hero-right { flex: none; width: 100%; height: 260px; } .exp-hero-left h1 { font-size: 34px; } .exp-cat-grid { grid-template-columns: repeat(2, 1fr); } .exp-portal-card { max-width: 100%; } } @media (max-width: 600px) { .exp-hero-left h1 { font-size: 28px; } .exp-hero-left .exp-hero-sub { font-size: 15px; } .exp-how-col { max-width: 100%; } .exp-cat-grid { grid-template-columns: repeat(2, 1fr); } .exp-section-head { font-size: 22px; } .exp-app h2 { font-size: 26px; } .exp-portal-cards { flex-direction: column; align-items: stretch; } .exp-portal-card { max-width: 100%; } }
Earn real Gimmzi Balance at local restaurants, shops, and experiences in Wilmington and Charlotte.
Find local restaurants, shops, salons, and more in your neighborhood.
Every purchase earns you real Gimmzi Balance — not points, real dollars.
Use your Gimmzi Balance on exclusive deals from local businesses.
830 Inspiration Drive, Wilmington, NC, USA, Wilmington, 28405
5 East Lane Avenue, Phoenix, AZ, USA, Phoenix, 85020
100 Boundary Loop Rd NW, Calabash, NC 28467, USA, Calabash, 28467
Discover local businesses offering exclusive Gimmzi Balance rewards in your neighborhood.
Browse MerchantsBook stays at local STR properties and hotels. Earn Gimmzi Balance every night of your stay.
Browse TravelFind apartment communities where residents earn Gimmzi Balance daily just for living there.
Browse CommunitiesDownload the app and earn Gimmzi Balance wherever you go.