Coupon page test

css/* General body styling */body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f9f9f9;}/* Main content area */main { padding: 20px; max-width: 1200px; margin: auto;}/* Coupon list container */.coupon-list { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px;}/* Individual coupon styling */.coupon { background-color: white; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); margin: 10px; padding: 20px; width: calc(33% - 40px); /* Adjust width to fit three columns with gaps */ box-sizing: border-box; transition: transform 0.2s, box-shadow 0.2s;}.coupon:hover { transform: translateY(-5px); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);}/* Coupon image styling */.coupon img { max-width: 100%; border-radius: 8px; height: auto;}/* Coupon title styling */.coupon h2 { font-size: 1.5em; margin: 0.5em 0; color: #333;}/* Coupon description styling */.coupon p { font-size: 1em; color: #666; margin: 0.5em 0;}/* Coupon button styling */.coupon .button { display: inline-block; padding: 10px 20px; background-color: #ff6600; color: white; text-decoration: none; border-radius: 4px; font-size: 1em; text-align: center; transition: background-color 0.2s;}.coupon .button:hover { background-color: #e65c00;}