:root{--brand-primary:#D4FF00;--text-dark:#000000;--text-muted:#555555;--bg-light:#F4F4F4;--white:#FFFFFF;--black:#000000;--radius-md:16px;--radius-lg:32px;--radius-pill:999px;--border-dark:3px solid #000000;--shadow-hard:8px 8px 0px #000000}
body{font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,sans-serif;color:var(--text-dark);background-color:var(--bg-light);-webkit-font-smoothing:antialiased;margin:0;padding:0}
.container{width:100%;padding-right:1.5rem;padding-left:1.5rem;margin-right:auto;margin-left:auto;max-width:1320px}
.container-fluid{width:100%;padding-right:1.5rem;padding-left:1.5rem;margin-right:auto;margin-left:auto}
.row{display:flex;flex-wrap:wrap;margin-right:-.75rem;margin-left:-.75rem}
.col-lg-10{flex:0 0 auto;width:83.33333333%}
.text-center{text-align:center}
.justify-content-center{justify-content:center}
.position-relative{position:relative}
.z-2{z-index:2}
.d-flex{display:flex}
.flex-column{flex-direction:column}
.align-items-start{align-items:flex-start}
.align-items-center{align-items:center}
.gap-2{gap:0.5rem}
.gap-3{gap:1rem}
.gap-4{gap:1.5rem}
.flex-shrink-0{flex-shrink:0}
.mb-0{margin-bottom:0!important}
.me-1{margin-right:0.25rem!important}
.top-header{position:sticky;top:0;width:100%;z-index:9999;background-color:#ffffff;border-bottom:1px solid rgba(0,0,0,0.05);box-sizing:border-box}
.header-inner-wrap{max-width:1320px;margin:0 auto;height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 24px}
.brand-link-area{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-logo-container{width:40px;height:40px;display:flex;align-items:center;justify-content:center}
.brand-logo-container img{max-width:100%;max-height:100%;object-fit:contain}
.brand-text-name{font-size:1.5rem;font-weight:900;color:#000000;margin:0;letter-spacing:-0.5px}
.main-navigation{display:flex;align-items:center;justify-content:flex-end}
.nav-list-group{display:flex;list-style:none;margin:0;padding:0}
.nav-list-element{display:flex;align-items:center}
.nav-pill-btn{background-color:#D4FF00;color:#000000;font-size:1rem;font-weight:700;text-decoration:none;padding:12px 28px;border-radius:999px;transition:all 0.2s ease;display:inline-block;letter-spacing:0.2px}
.nav-pill-btn:hover{background-color:#bce600;transform:scale(1.02)}
.hero-wrapper{padding:100px 0 120px;background-color:var(--bg-light);border-bottom:var(--border-dark);overflow:hidden}
.hero-top-badge{background:var(--black);color:var(--brand-primary);padding:10px 24px;border-radius:var(--radius-pill);font-weight:800;display:inline-flex;align-items:center;text-transform:uppercase;font-size:0.85rem;letter-spacing:1px;margin-bottom:30px;box-shadow:4px 4px 0px rgba(0,0,0,0.1)}
.live-indicator{display:inline-block;width:10px;height:10px;background-color:var(--brand-primary);border-radius:50%;margin-right:12px;animation:pulse-green 1.5s infinite}
@keyframes pulse-green{0%{transform:scale(0.9);opacity:1}50%{transform:scale(1.5);opacity:0.5}100%{transform:scale(0.9);opacity:1}}
.hero-title{font-weight:900;font-size:3.5rem;line-height:1.2;color:var(--text-dark);letter-spacing:-2px;margin-top:0;margin-bottom:24px}
.title-highlight{background-color:var(--brand-primary);font-size:2.5rem;color:var(--black);padding:4px 24px;border-radius:var(--radius-pill);display:inline-block;border:var(--border-dark);transform:rotate(-2deg);box-shadow:6px 6px 0px var(--black)}
.hero-subtitle{font-size:1.25rem;color:var(--text-muted);font-weight:500;max-width:800px;margin:0 auto;line-height:1.6}
.trending-tags-container{margin-top:4rem}
.tags-label{display:block;margin-bottom:20px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--text-dark)}
.tags-cloud{display:flex;flex-wrap:wrap;justify-content:center;gap:1.25rem}
.trend-tag{display:inline-flex;align-items:center;background:var(--white);color:var(--text-dark);text-decoration:none;padding:12px 28px;border-radius:var(--radius-pill);font-size:1.05rem;font-weight:800;border:var(--border-dark);transition:all 0.2s ease}
.trend-tag i{margin-right:8px;font-size:1.2rem}
.trend-tag:hover{background:var(--brand-primary);color:var(--black);transform:translate(-4px,-4px);box-shadow:var(--shadow-hard)}
.section-container{padding:90px 0}
.bg-green{background-color:var(--brand-primary);border-bottom:var(--border-dark)}
.bg-white{background-color:var(--white);border-bottom:var(--border-dark)}
.bg-light-gray{background-color:var(--bg-light);border-bottom:var(--border-dark)}
.bg-black{background-color:var(--black)!important}
.bg-green-light{background-color:#F5FFC2!important}
.text-black{color:var(--black)!important}
.text-white{color:var(--white)!important}
.fw-bold{font-weight:700!important}
.opacity-75{opacity:0.8!important}
.section-header{text-align:center;margin-bottom:60px}
.section-title{font-size:3rem;font-weight:900;color:var(--text-dark);margin-top:0;margin-bottom:15px;letter-spacing:-1px}
.section-desc{color:var(--text-muted);font-size:1.2rem;font-weight:600;margin:0}
.brand-grid-layout{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:24px;width:100%}
.brand-logo-item{height:100px;background:var(--white);border-radius:var(--radius-md);padding:20px;display:flex;align-items:center;justify-content:center;border:var(--border-dark);transition:all 0.2s ease;cursor:pointer}
.brand-logo-item:hover{background:var(--brand-primary);transform:translate(-4px,-4px);box-shadow:6px 6px 0px var(--black)}
.brand-logo-item img{max-width:100%;max-height:50px;object-fit:contain;mix-blend-mode:multiply}
.bento-grid-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;max-width:1320px;margin:0 auto;align-items:stretch}
.bento-card{background:#FFFFFF;border-radius:32px;padding:45px;border:3px solid #000000;box-shadow:8px 8px 0px #000000;display:flex;flex-direction:column;position:relative;transition:transform 0.2s ease,box-shadow 0.2s ease;box-sizing:border-box;overflow:hidden}
.bento-card:hover{transform:translate(-4px,-4px);box-shadow:12px 12px 0px #000000}
.icon-glass{width:64px;height:64px;border-radius:16px;background:#000000;color:#D4FF00;border:3px solid #000000;display:inline-flex;align-items:center;justify-content:center;font-size:1.8rem;margin-bottom:24px;flex-shrink:0}
.border-green{border-color:#D4FF00!important}
.bento-content{display:flex;flex-direction:column;flex-grow:1}
.bento-content h3{font-size:2rem;font-weight:900;margin-top:0;margin-bottom:15px;letter-spacing:-1px;line-height:1.2}
.bento-content p{font-size:1.15rem;line-height:1.6;font-weight:500;margin-bottom:0}
.visual-mockup{margin-top:40px;padding-top:30px;border-top:2px dashed rgba(0,0,0,0.1)}
.mockup-coupon{background:#FFFFFF;border:3px solid #000000;border-radius:16px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;box-shadow:4px 4px 0px #000000;transform:rotate(-2deg);transition:transform 0.3s ease;flex-wrap:wrap;gap:10px}
.bento-card:hover .mockup-coupon{transform:rotate(0deg) scale(1.02)}
.code-text{font-size:1.4rem;font-weight:900;letter-spacing:1px;color:#000000}
.badge-success-soft{background:#D4FF00;color:#000000;padding:6px 14px;border-radius:999px;font-size:0.9rem;font-weight:800;border:2px solid #000000;display:inline-block;white-space:nowrap}
.live-pulse{display:inline-block;width:12px;height:12px;background-color:#D4FF00;border-radius:50%;position:relative;margin-left:8px;vertical-align:middle;top:-2px}
.live-pulse::after{content:'';position:absolute;width:100%;height:100%;background-color:#D4FF00;border-radius:50%;top:0;left:0;animation:pulse-animation 1.5s infinite}
@media (min-width:576px){.flex-sm-row{flex-direction:row!important}}
@media (min-width:992px){.px-lg-5{padding-right:3rem!important;padding-left:3rem!important}}
@media (max-width:1024px){.bento-grid-3col{grid-template-columns:repeat(2,1fr)}.bento-card:last-child{grid-column:1 / -1}}
@media (max-width:991px){.hero-title{font-size:3.2rem}.section-title{font-size:2.2rem}.bento-card{padding:30px}}
@media (max-width:768px){.header-inner-wrap{height:70px;padding:0 16px}.brand-text-name{display:none}.nav-pill-btn{padding:10px 20px;font-size:0.95rem}.hero-wrapper{padding:70px 0}.hero-title{font-size:2.5rem}.trend-tag{padding:10px 20px;font-size:0.95rem}.bento-grid-3col{grid-template-columns:1fr}.bento-content h3{font-size:1.6rem}.mockup-coupon{justify-content:center;text-align:center}}