/* Best seller (Combo) page — loads after style.css */
.bs-page section { padding: 0; }
.bs-page p { margin: 0; }
.bs-card { border: 1px solid rgba(8,9,9,0.12); border-radius: 16px; overflow: hidden; background: #ffffff; }
.bs-card img, .bs-img { display: block; width: 100%; height: auto; }

.bs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 32px; }
.bs-hero { align-items: start; padding-top: 48px !important; }
.bs-hero-text { display: flex; flex-direction: column; gap: 20px; max-width: 34em; min-width: 0; }
.bs-hero-text h1 { font-family: Anton, 'Archivo Black', sans-serif; font-weight: 400; font-size: clamp(30px, 4.6vw, 44px); line-height: 1.15; letter-spacing: 0.01em; margin: 0; }
.bs-hero-text p { font-size: 17px; line-height: 1.55; text-wrap: pretty; }
.bs-hero-text strong { color: #0A7D40; }

.bs-section { padding-top: clamp(48px, 7vw, 80px) !important; }
.bs-steps-head { align-items: center; }
.bs-steps-head h2 { font-size: clamp(20px, 2.8vw, 28px); line-height: 1.2; color: #D32307; margin: 0 0 6px; letter-spacing: 0; }
.bs-steps-head .sub { font-size: 19px; line-height: 1.3; }

.bs-steps-body { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 40px; align-items: start; padding-top: 40px; }
.bs-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.bs-steps > li { display: flex; flex-direction: column; gap: 8px; }
.bs-step-head { display: flex; align-items: center; gap: 12px; }
.bs-num { flex: none; width: 36px; height: 36px; border-radius: 50%; background: #f4e450; border: 3px solid #080909; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 17px; }
.bs-steps h3 { font-size: 19px; line-height: 1.3; font-weight: 700; color: #D32307; margin: 0; }
.bs-steps p, .bs-steps ul li { font-size: 15px; line-height: 1.5; }
.bs-steps ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; }
.bs-steps > li.bs-step-last { flex-direction: row; gap: 16px; align-items: center; }
.bs-step-last > div { display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-width: 0; }
.bs-mascot { flex: none; width: 92px; height: auto; display: block; }

.bs-figs { display: flex; flex-direction: column; gap: 24px; align-items: center; min-width: 0; }
.bs-figs figure { margin: 0; width: 100%; max-width: 420px; }

.bs-buy { align-items: center; }
.bs-buy-text { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; min-width: 0; }
.bs-buy-text h2 { color: #080909; font-size: clamp(24px, 3.4vw, 32px); margin: 0; letter-spacing: 0; }
.bs-buy-text .sub { font-size: 17px; line-height: 1.55; }
.bs-price { font-size: 26px; font-weight: 700; line-height: 1.2; margin-top: 4px !important; color: #D32307; }
.bs-contents { font-size: 14px; line-height: 1.4; }

.bs-btn { display: flex; align-items: center; justify-content: center; height: 56px; width: 100%; max-width: 350px; min-width: 220px; padding: 0 24px; margin-bottom: 4px; background: #f95b42; color: #080909; border: 3px solid #080909; border-radius: 12px; box-shadow: 0 4px 0 #080909; font: 700 18px/1 Poppins, sans-serif; text-decoration: none; cursor: pointer; transition: transform 60ms ease, box-shadow 60ms ease; }
.bs-btn:hover { color: #080909; }
.bs-btn:active { transform: translateY(4px); box-shadow: 0 0 0 #080909; }

.footer-coin { width: 160px; height: auto; margin: 0 auto 16px; display: block; }

@media (max-width: 359px) { .bs-btn { min-width: 0; } }
@media (min-width: 400px) { .bs-steps-head h2 { white-space: nowrap; } }