/* * BOSS PDP plugin — Artist Bio template styles. * Entirely separate from boss-pdp.css (different class prefix, * different class), so nothing here can affect the WooCommerce * PDP template and nothing there can affect this. */ header a { font-weight: 500; font-size: 18px; } .boss_artist-template-default main { margin-top: 0 !important; } .boss_artist-template-default main > .wp-block-group { padding-top: 0 !important; } body header .is-layout-flex, body footer .is-layout-flex { justify-content: space-between; } .boss-artist-short-bio p, .boss-artist-full-bio p { font-size: 22px; } /***********/ .boss-artist-body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: #222; line-height: 1.6; } .boss-artist-wrap { max-width: 1200px; margin: 0 auto; padding: 32px 20px 60px; box-sizing: border-box; } .boss-artist-wrap * { box-sizing: border-box; } /* ---------- Hero: image + name/role/short-bio/links side by side ---------- */ .boss-artist-hero { display: flex; flex-wrap: wrap; gap: 60px; align-items: flex-start; margin-bottom: 40px; } .boss-artist-image-col { flex: 1 1 0; min-width: 280px; } .boss-artist-photo { width: 100%; height: auto; display: block; border-radius: 6px; } .boss-artist-info-col { flex: 1 1 0; min-width: 280px; } .boss-artist-name { font-size: 36px; line-height: 1.2; font-weight: bold; margin: 0 0 6px; } .boss-artist-role { font-size: 15px; font-weight: 600; opacity: 0.65; margin: 0 0 18px; text-transform: uppercase; letter-spacing: 0.04em; } .boss-artist-short-bio { font-size: 16px; margin-bottom: 20px; } .boss-artist-short-bio p:first-child { margin-top: 0; } .boss-artist-short-bio p:last-child { margin-bottom: 0; } /* ---------- Social / streaming links ---------- */ .boss-artist-social { display: flex; flex-wrap: wrap; gap: 10px 12px; list-style: none; margin: 0; padding: 0; } .boss-artist-social-link a { display: inline-block; text-decoration: none; font-size: 13px; font-weight: 600; padding: 7px 16px; border: 1px solid #dcdcdc; border-radius: 20px; color: #fff; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; background: #e63946; } .boss-artist-social-link a:hover, .boss-artist-social-link a:focus { background-color: #f4f4f4; border-color: #bbb; color: #222; } /* ---------- Collections ---------- */ .boss-artist-collections { margin: 18px 0 0; font-size: 13px; } .boss-artist-collections-label { text-transform: uppercase; letter-spacing: 0.03em; font-weight: 600; color: #555; margin-right: 4px; } .boss-artist-collection-link { font-weight: 700; color: #e63946; text-decoration: none; } .boss-artist-collection-link:hover { text-decoration: underline; } /* ---------- Full bio ---------- */ .boss-artist-full-bio { font-size: 16px; line-height: 1.75; width: 100%; } .boss-artist-full-bio p:first-child { margin-top: 0; } /* ========================================================================== Tablet ========================================================================== */ @media (max-width: 1024px) { .boss-artist-hero { gap: 24px; } } /* ========================================================================== Mobile ========================================================================== */ @media (max-width: 600px) { .boss-artist-wrap { padding: 20px 16px 40px; } .boss-artist-hero { gap: 18px; margin-bottom: 28px; } .boss-artist-image-col, .boss-artist-info-col { flex: 1 1 100%; max-width: 100%; } .boss-artist-name { font-size: 24px; } .boss-artist-full-bio { font-size: 15px; } }