/* Shared home banner ad row (PC 2-col flex / H5 stack). */ /* PC Figma: stretch row, 94px, gap 36, two equal flex slots */ .home-ad-row { align-self: stretch; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; gap: 36px; width: 100%; flex-shrink: 0; box-sizing: border-box; } .home-ad-row.home-ad-row--mobile { display: none; } .home-ad-row .home-ad-banner { position: relative; flex: 1 1 calc((100% - 36px) / 2); width: auto; min-width: 0; max-width: calc((100% - 36px) / 2); height: 94px; overflow: hidden; border-radius: 12px; box-sizing: border-box; } .home-ad-row .home-ad-banner img { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; object-fit: cover; } @media (min-width: 768px) { .home-ad-row { gap: 36px; } .home-ad-row .home-ad-banner { flex: 1 1 calc((100% - 36px) / 2); max-width: calc((100% - 36px) / 2); height: 94px; border-radius: 12px; } .home-ad-row .home-ad-banner img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } } @media (max-width: 767px) { .home-ad-row, .home-ad-row.home-ad-row--mobile { height: auto; display: flex; flex-direction: column; flex-wrap: nowrap; align-self: stretch; gap: 12px; } .home-ad-row.home-ad-row--desktop { display: none; } /* H5 Figma: 343×43 banner — stretch, 43px, radius 6, image cover-crop */ .home-ad-row .home-ad-banner { position: relative; align-self: stretch; flex: 0 0 43px; width: 100%; max-width: none; height: 43px; overflow: hidden; border-radius: 6px; } .home-ad-row .home-ad-banner img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; background: #464646; } }