/* /Layout/MainLayout.razor.rz.scp.css */
main[b-w33e8mzpn7] {
    min-height: calc(100vh - var(--sp-nav-h) - 60px);
    padding-top: var(--sp-nav-h);
}

.sp-site-footer[b-w33e8mzpn7] {
    background: var(--sp-black);
    color: rgba(255,255,255,0.55);
    padding: 1.1rem 0;
    text-align: center;
    font-family: var(--sp-font-ui);
    font-size: 0.85rem;
    letter-spacing: 0.04em;
}

.sp-footer-links[b-w33e8mzpn7] {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.4rem 0.6rem;
}

.sp-footer-links a[b-w33e8mzpn7] {
    color: rgba(255,255,255,0.55);
    text-decoration: none;
    transition: color 0.15s;
}

.sp-footer-links a:hover[b-w33e8mzpn7] {
    color: var(--sp-yellow);
}

.sp-footer-sep[b-w33e8mzpn7] {
    opacity: 0.35;
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* ---- Nav Shell ---- */

.sp-nav[b-gadyb3reyk] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: var(--sp-cream);
    border-bottom: 2.5px solid var(--sp-black);
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
    height: var(--sp-nav-h);
}

.sp-nav-inner[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    height: var(--sp-nav-h);
    padding: 0 1.5rem;
    gap: 1.5rem;
    max-width: 1300px;
    margin: 0 auto;
}

/* ---- Logo ---- */

.sp-nav-logo[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    text-decoration: none;
    flex-shrink: 0;
}

.sp-skull[b-gadyb3reyk] {
    display: block;
}

.sp-nav-logo-text[b-gadyb3reyk] {
    display: flex;
    flex-direction: column;
    line-height: 1;
    gap: 1px;
}

.sp-nav-logo-name[b-gadyb3reyk] {
    font-family: var(--sp-font-display);
    font-size: 1.35rem;
    letter-spacing: 0.05em;
    color: var(--sp-black);
    line-height: 1;
}

.sp-nav-logo-sub[b-gadyb3reyk] {
    font-family: var(--sp-font-ui);
    font-size: 0.68rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--sp-gray);
    line-height: 1;
}

/* ---- Desktop Links ---- */

.sp-nav-links[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    list-style: none;
    margin: 0 auto;
    padding: 0;
}

.sp-nav-item[b-gadyb3reyk] {
    padding: 0;
}

.sp-nav-link[b-gadyb3reyk] {
    display: block;
    font-family: var(--sp-font-ui);
    font-weight: 600;
    font-size: 0.95rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sp-black);
    text-decoration: none;
    padding: 0.4rem 0.75rem;
    border-radius: var(--sp-radius);
    transition: background 0.15s, color 0.15s;
    position: relative;
}

.sp-nav-link[b-gadyb3reyk]::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0.75rem;
    right: 0.75rem;
    height: 2px;
    background: var(--sp-yellow);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.18s ease;
}

.sp-nav-link:hover[b-gadyb3reyk] {
    color: var(--sp-black);
    text-decoration: none;
}

.sp-nav-link:hover[b-gadyb3reyk]::after {
    transform: scaleX(1);
}

/* ---- Auth Buttons ---- */

.sp-nav-actions[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-shrink: 0;
}

.sp-nav-login[b-gadyb3reyk] {
    padding: 0.45rem 1.1rem;
    font-size: 0.9rem;
}

.sp-nav-cta[b-gadyb3reyk] {
    padding: 0.45rem 1.1rem;
    font-size: 0.9rem;
}

/* ---- Hamburger ---- */

.sp-hamburger[b-gadyb3reyk] {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    background: none;
    border: 2px solid var(--sp-black);
    border-radius: var(--sp-radius);
    padding: 6px 7px;
    cursor: pointer;
    flex-shrink: 0;
    margin-left: auto;
}

.sp-hamburger-bar[b-gadyb3reyk] {
    display: block;
    width: 100%;
    height: 2px;
    background: var(--sp-black);
    border-radius: 2px;
    transition: transform 0.2s, opacity 0.2s;
}

/* Hamburger → X when open */
.sp-nav--open .sp-hamburger-bar:nth-child(1)[b-gadyb3reyk] {
    transform: translateY(7px) rotate(45deg);
}
.sp-nav--open .sp-hamburger-bar:nth-child(2)[b-gadyb3reyk] {
    opacity: 0;
}
.sp-nav--open .sp-hamburger-bar:nth-child(3)[b-gadyb3reyk] {
    transform: translateY(-7px) rotate(-45deg);
}

/* ---- Mobile Dropdown ---- */

.sp-mobile-menu[b-gadyb3reyk] {
    display: none;
    flex-direction: column;
    background: var(--sp-cream);
    border-top: 2px solid var(--sp-black);
    padding: 1rem 1.5rem 1.2rem;
    box-shadow: 0 6px 16px rgba(0,0,0,0.12);
}

.sp-mobile-menu--open[b-gadyb3reyk] {
    display: flex;
}

.sp-mobile-links[b-gadyb3reyk] {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.sp-mobile-link[b-gadyb3reyk] {
    display: block;
    font-family: var(--sp-font-ui);
    font-weight: 600;
    font-size: 1.1rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sp-black);
    text-decoration: none;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    transition: color 0.15s;
}

.sp-mobile-link:hover[b-gadyb3reyk] {
    color: var(--sp-gray);
}

.sp-mobile-actions[b-gadyb3reyk] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.sp-mobile-btn[b-gadyb3reyk] {
    flex: 1;
    text-align: center;
    padding: 0.6rem 1rem;
    font-size: 0.9rem;
    min-width: 120px;
}

/* ---- Responsive breakpoints ---- */

@media (max-width: 899px) {
    .sp-nav-links[b-gadyb3reyk],
    .sp-nav-actions[b-gadyb3reyk] {
        display: none;
    }

    .sp-hamburger[b-gadyb3reyk] {
        display: flex;
    }

    .sp-nav--open[b-gadyb3reyk] {
        height: auto;
    }
}

@media (min-width: 900px) {
    .sp-mobile-menu[b-gadyb3reyk] {
        display: none !important;
    }
}

/* ---- Authenticated user — desktop ---- */

.sp-nav-user[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.sp-nav-avatar[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--sp-black);
    color: var(--sp-cream);
    font-family: var(--sp-font-display);
    font-size: 1rem;
    font-weight: 700;
    border-radius: var(--sp-radius);
    flex-shrink: 0;
    letter-spacing: 0;
    user-select: none;
}

.sp-nav-username[b-gadyb3reyk] {
    font-family: var(--sp-font-ui);
    font-weight: 600;
    font-size: 0.88rem;
    letter-spacing: 0.03em;
    color: var(--sp-black);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-nav-signout[b-gadyb3reyk] {
    padding: 0.4rem 0.85rem;
    font-size: 0.82rem;
    cursor: pointer;
    background: none;
    font-family: inherit;
}

/* ---- Authenticated user — mobile ---- */

.sp-mobile-user[b-gadyb3reyk] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(0,0,0,0.1);
}

.sp-mobile-user-info[b-gadyb3reyk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sp-mobile-username[b-gadyb3reyk] {
    font-family: var(--sp-font-ui);
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.04em;
    color: var(--sp-black);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Pages/Admin/AdminDashboard.razor.rz.scp.css */
.sp-admin-hero[b-uem4ejwjix] {
    background: var(--sp-cream);
    padding-bottom: 1.75rem;
}

.sp-admin-shell[b-uem4ejwjix] {
    padding: 2rem 0 3.5rem;
}

.sp-stat-card--yellow[b-uem4ejwjix] {
    border-left-color: var(--sp-red);
}

.sp-admin-section[b-uem4ejwjix] {
    margin-top: 1rem;
}

.sp-admin-section-header[b-uem4ejwjix] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.sp-admin-section-title[b-uem4ejwjix] {
    font-family: var(--sp-font-display);
    font-size: 1.7rem;
    letter-spacing: 0.03em;
    margin: 0;
}

.sp-admin-viewall-btn[b-uem4ejwjix] {
    font-size: 0.82rem;
    padding: 0.35rem 0.9rem;
    white-space: nowrap;
}
/* /Pages/Contact.razor.rz.scp.css */
.sp-tape[b-fpg4zq1nx6] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-ct1[b-fpg4zq1nx6] {
    width: 180px;
    height: 20px;
    top: 20px;
    right: 8%;
    transform: rotate(-10deg);
    opacity: 0.55;
}

.sp-contact-shell[b-fpg4zq1nx6] {
    padding: 2.5rem 0 3.5rem;
}

.sp-contact-section-title[b-fpg4zq1nx6] {
    font-family: var(--sp-font-display);
    font-size: 1.8rem;
    letter-spacing: 0.03em;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2.5px solid var(--sp-black);
}

/* ---- Form ---- */

.sp-contact-form[b-fpg4zq1nx6] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.sp-contact-error[b-fpg4zq1nx6] {
    font-family: var(--sp-font-ui);
    font-size: 0.88rem;
    color: var(--sp-red);
    margin-bottom: 1rem;
    font-weight: 600;
}

/* ---- Success ---- */

.sp-contact-success[b-fpg4zq1nx6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 2rem;
    background: #fff;
    border: 2.5px solid var(--sp-black);
    border-left: 5px solid var(--sp-yellow);
    border-radius: var(--sp-radius);
}

.sp-contact-success-title[b-fpg4zq1nx6] {
    font-family: var(--sp-font-display);
    font-size: 2rem;
    letter-spacing: 0.03em;
    margin: 0;
}

.sp-contact-success-body[b-fpg4zq1nx6] {
    font-family: var(--sp-font-ui);
    font-size: 1rem;
    color: var(--sp-gray);
    margin-bottom: 0.5rem;
}

/* ---- Contact Info ---- */

.sp-contact-info-block[b-fpg4zq1nx6] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 1.5rem;
}

.sp-contact-info-row[b-fpg4zq1nx6] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.9rem 0;
    border-bottom: 1px solid var(--sp-cream-dark);
}

.sp-contact-info-row:last-child[b-fpg4zq1nx6] {
    border-bottom: none;
}

.sp-contact-info-icon[b-fpg4zq1nx6] {
    color: var(--sp-black);
    flex-shrink: 0;
    margin-top: 2px;
    width: 20px;
}

.sp-contact-info-label[b-fpg4zq1nx6] {
    display: block;
    font-family: var(--sp-font-ui);
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sp-gray);
    margin-bottom: 0.15rem;
}

.sp-contact-info-value[b-fpg4zq1nx6] {
    display: block;
    font-family: var(--sp-font-ui);
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--sp-black);
    text-decoration: none;
}

a.sp-contact-info-value:hover[b-fpg4zq1nx6] {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.sp-contact-response-time[b-fpg4zq1nx6] {
    background: var(--sp-cream-dark);
    border-left: 4px solid var(--sp-yellow);
    padding: 0.85rem 1rem;
    border-radius: 0 var(--sp-radius) var(--sp-radius) 0;
    margin-bottom: 1.75rem;
    font-family: var(--sp-font-body);
    font-size: 0.88rem;
    color: var(--sp-black);
    line-height: 1.55;
}

.sp-contact-response-time p[b-fpg4zq1nx6] { margin: 0; }

/* ---- Quick Links ---- */

.sp-contact-quick-title[b-fpg4zq1nx6] {
    font-family: var(--sp-font-display);
    font-size: 1.3rem;
    letter-spacing: 0.03em;
    margin-bottom: 0.75rem;
}

.sp-contact-quick-list[b-fpg4zq1nx6] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.sp-contact-quick-list a[b-fpg4zq1nx6] {
    font-family: var(--sp-font-ui);
    font-weight: 600;
    font-size: 0.92rem;
    letter-spacing: 0.03em;
    color: var(--sp-black);
    text-decoration: none;
    transition: color 0.15s;
}

.sp-contact-quick-list a:hover[b-fpg4zq1nx6] {
    color: var(--sp-gray);
    text-decoration: underline;
    text-underline-offset: 3px;
}
/* /Pages/DesignResources.razor.rz.scp.css */
.sp-tape[b-iyihu646yt] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-dr1[b-iyihu646yt] {
    width: 200px;
    height: 20px;
    top: 15px;
    right: 5%;
    transform: rotate(-9deg);
    opacity: 0.55;
}

.sp-dr-section[b-iyihu646yt] {
    padding: 2.5rem 0 2rem;
}

/* ---- Template Cards ---- */

.sp-template-card[b-iyihu646yt] {
    border: 2px solid var(--sp-black);
    border-radius: var(--sp-radius);
    padding: 1.2rem 1.25rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    background: #fff;
    transition: box-shadow 0.15s;
    height: 100%;
}

.sp-template-card:hover[b-iyihu646yt] {
    box-shadow: var(--sp-shadow-sm);
}

.sp-template-icon[b-iyihu646yt] {
    color: var(--sp-black);
}

.sp-template-name[b-iyihu646yt] {
    font-family: var(--sp-font-display);
    font-size: 1.35rem;
    letter-spacing: 0.03em;
    margin: 0;
}

.sp-template-desc[b-iyihu646yt] {
    font-family: var(--sp-font-body);
    font-size: 0.88rem;
    color: var(--sp-gray);
    line-height: 1.55;
    flex: 1;
    margin: 0;
}

.sp-template-meta[b-iyihu646yt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.sp-template-dl[b-iyihu646yt] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem;
    margin-top: 0.25rem;
    background: var(--sp-black);
    color: #fff;
    border: none;
    border-radius: var(--sp-radius);
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.sp-template-dl:hover[b-iyihu646yt] {
    background: var(--sp-yellow);
    color: var(--sp-black);
}

/* ---- Checklist ---- */

.sp-checklist[b-iyihu646yt] {
    border: 2px solid var(--sp-black);
    border-radius: var(--sp-radius);
    padding: 1.4rem 1.5rem;
    background: #fff;
    height: 100%;
}

.sp-checklist-title[b-iyihu646yt] {
    font-family: var(--sp-font-display);
    font-size: 1.5rem;
    letter-spacing: 0.03em;
    margin-bottom: 1rem;
}

.sp-checklist-list[b-iyihu646yt] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.sp-checklist-list li[b-iyihu646yt] {
    font-family: var(--sp-font-body);
    font-size: 0.92rem;
    color: var(--sp-black);
    line-height: 1.45;
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
}

.sp-check-icon[b-iyihu646yt] {
    color: var(--sp-black);
    font-size: 0.9rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
    background: var(--sp-yellow);
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    font-style: normal;
}

/* ---- FAQ ---- */

.sp-faq-list[b-iyihu646yt] {
    max-width: 780px;
    margin: 0 auto;
}

/* ---- Design CTA ---- */

.sp-dr-cta[b-iyihu646yt] {
    padding: 2.5rem 0;
    border-top: 3px solid var(--sp-black);
}

.sp-dr-cta-title[b-iyihu646yt] {
    font-family: var(--sp-font-display);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    letter-spacing: 0.03em;
    margin-bottom: 0.5rem;
}

.sp-dr-cta-sub[b-iyihu646yt] {
    font-family: var(--sp-font-ui);
    font-size: 1rem;
    color: var(--sp-gray);
    line-height: 1.55;
    margin: 0;
}
/* /Pages/ForBands.razor.rz.scp.css */
/* ---- Hero ---- */

.sp-bands-hero[b-lk5qc1pew6] {
    background: var(--sp-cream);
    overflow: hidden;
}

.sp-tape[b-lk5qc1pew6] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-b1[b-lk5qc1pew6] {
    width: 180px;
    height: 20px;
    top: 18px;
    right: 12%;
    transform: rotate(-10deg);
    opacity: 0.55;
}

.sp-tape-b2[b-lk5qc1pew6] {
    width: 140px;
    height: 16px;
    bottom: 30px;
    left: 5%;
    transform: rotate(5deg);
    opacity: 0.4;
}

.sp-tape-cta[b-lk5qc1pew6] {
    position: absolute;
    width: 110%;
    left: -5%;
    height: 22px;
    top: -8px;
    transform: rotate(-0.5deg);
    background: rgba(255,255,255,0.08);
}

/* ---- Stats Grid ---- */

.sp-bands-stats-grid[b-lk5qc1pew6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.sp-bands-stat[b-lk5qc1pew6] {
    background: var(--sp-black);
    color: #fff;
    padding: 1.5rem 1.25rem;
    border-radius: var(--sp-radius);
    border-left: 5px solid var(--sp-yellow);
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.sp-bands-stat-num[b-lk5qc1pew6] {
    font-family: var(--sp-font-display);
    font-size: 2.8rem;
    line-height: 1;
    color: var(--sp-yellow);
}

.sp-bands-stat-label[b-lk5qc1pew6] {
    font-family: var(--sp-font-ui);
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
}

/* ---- How It Works ---- */

.sp-how-it-works[b-lk5qc1pew6] {
    padding: 3rem 0 2.5rem;
}

.sp-step[b-lk5qc1pew6] {
    position: relative;
    padding-left: 1rem;
    border-left: 4px solid var(--sp-yellow);
}

.sp-step-num[b-lk5qc1pew6] {
    font-family: var(--sp-font-display);
    font-size: 3.5rem;
    line-height: 1;
    color: var(--sp-cream-dark);
    position: absolute;
    top: -0.5rem;
    right: 0;
    pointer-events: none;
    user-select: none;
}

.sp-step-title[b-lk5qc1pew6] {
    font-family: var(--sp-font-display);
    font-size: 1.6rem;
    letter-spacing: 0.03em;
    margin-bottom: 0.6rem;
    position: relative;
}

.sp-step-desc[b-lk5qc1pew6] {
    font-family: var(--sp-font-body);
    font-size: 0.95rem;
    color: var(--sp-gray);
    line-height: 1.65;
    position: relative;
}

/* ---- Band Product Cards ---- */

.sp-bands-products[b-lk5qc1pew6] {
    padding: 2.5rem 0 3rem;
}

.sp-band-product-card[b-lk5qc1pew6] {
    border: 2px solid var(--sp-black);
    border-radius: var(--sp-radius);
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: transform 0.15s, box-shadow 0.15s;
}

.sp-band-product-card:hover[b-lk5qc1pew6] {
    transform: translateY(-3px);
    box-shadow: var(--sp-shadow);
}

.sp-band-product-img[b-lk5qc1pew6] {
    width: 100%;
    aspect-ratio: 3/2;
    background: var(--sp-cream-dark);
    background-image:
        linear-gradient(45deg, rgba(0,0,0,0.05) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(0,0,0,0.05) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(0,0,0,0.05) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(0,0,0,0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.sp-band-product-body[b-lk5qc1pew6] {
    padding: 1.1rem 1.15rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    flex: 1;
}

.sp-band-product-name[b-lk5qc1pew6] {
    font-family: var(--sp-font-display);
    font-size: 1.45rem;
    letter-spacing: 0.03em;
    margin: 0;
}

.sp-band-product-desc[b-lk5qc1pew6] {
    font-family: var(--sp-font-body);
    font-size: 0.88rem;
    color: var(--sp-gray);
    line-height: 1.55;
    flex: 1;
}

.sp-band-product-price[b-lk5qc1pew6] {
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.04em;
    margin-bottom: 0.5rem;
}

/* ---- Testimonials ---- */

.sp-testimonials[b-lk5qc1pew6] {
    padding: 2.5rem 0 3rem;
    background: var(--sp-cream);
}

.sp-testimonial[b-lk5qc1pew6] {
    background: #fff;
    border: 2px solid var(--sp-black);
    border-radius: var(--sp-radius);
    padding: 1.4rem 1.5rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: var(--sp-shadow-sm);
}

.sp-testimonial-quote[b-lk5qc1pew6] {
    font-family: var(--sp-font-body);
    font-size: 0.95rem;
    color: var(--sp-black);
    line-height: 1.65;
    font-style: italic;
    margin-bottom: 1.2rem;
    flex: 1;
}

.sp-testimonial-quote[b-lk5qc1pew6]::before {
    content: '\201C';
    font-family: Georgia, serif;
    font-size: 2rem;
    color: var(--sp-yellow);
    line-height: 0;
    vertical-align: -0.5rem;
    margin-right: 0.2rem;
}

.sp-testimonial-author[b-lk5qc1pew6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sp-testimonial-avatar[b-lk5qc1pew6] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--sp-cream-dark);
    border: 2px solid var(--sp-black);
    flex-shrink: 0;
}

.sp-testimonial-name[b-lk5qc1pew6] {
    display: block;
    font-family: var(--sp-font-ui);
    font-size: 0.9rem;
    letter-spacing: 0.04em;
    color: var(--sp-black);
}

.sp-testimonial-location[b-lk5qc1pew6] {
    display: block;
    font-family: var(--sp-font-ui);
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sp-gray);
}

/* ---- CTA Banner ---- */

.sp-cta-banner[b-lk5qc1pew6] {
    background: var(--sp-black);
    padding: 4rem 0 3.5rem;
    position: relative;
    overflow: hidden;
}

.sp-cta-title[b-lk5qc1pew6] {
    font-family: var(--sp-font-display);
    font-size: clamp(2.5rem, 6vw, 4rem);
    letter-spacing: 0.04em;
    color: #fff;
    margin-bottom: 0.75rem;
}

.sp-cta-subtitle[b-lk5qc1pew6] {
    font-family: var(--sp-font-ui);
    font-size: 1.1rem;
    color: rgba(255,255,255,0.6);
    margin-bottom: 2rem;
    letter-spacing: 0.03em;
}

@media (max-width: 575px) {
    .sp-bands-stats-grid[b-lk5qc1pew6] {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    .sp-bands-stat-num[b-lk5qc1pew6] {
        font-size: 2.2rem;
    }
}
/* /Pages/GetStarted.razor.rz.scp.css */
.sp-gs-shell[b-v72gqkjiuu] {
    display: grid;
    grid-template-columns: 380px 1fr;
    min-height: calc(100vh - var(--sp-nav-h) - 60px);
}

/* ---- Sidebar ---- */

.sp-gs-sidebar[b-v72gqkjiuu] {
    background: var(--sp-black);
    color: #fff;
    padding: 2.5rem 2rem 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    overflow: hidden;
}

.sp-tape[b-v72gqkjiuu] {
    position: absolute;
    pointer-events: none;
    background: rgba(255,255,255,0.08);
}

.sp-tape-gs1[b-v72gqkjiuu] {
    width: 140%;
    height: 24px;
    top: 28px;
    left: -20%;
    transform: rotate(-2deg);
}

.sp-gs-logo[b-v72gqkjiuu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    margin-bottom: 2.5rem;
    position: relative;
    z-index: 1;
}

.sp-gs-logo-name[b-v72gqkjiuu] {
    display: block;
    font-family: var(--sp-font-display);
    font-size: 1.3rem;
    letter-spacing: 0.05em;
    color: var(--sp-yellow);
    line-height: 1;
}

.sp-gs-logo-sub[b-v72gqkjiuu] {
    display: block;
    font-family: var(--sp-font-ui);
    font-size: 0.66rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.45);
    line-height: 1;
    margin-top: 2px;
}

.sp-gs-sidebar-content[b-v72gqkjiuu] {
    position: relative;
    z-index: 1;
}

.sp-gs-sidebar-title[b-v72gqkjiuu] {
    font-family: var(--sp-font-display);
    font-size: 2rem;
    letter-spacing: 0.03em;
    color: #fff;
    margin-bottom: 0.75rem;
}

.sp-gs-sidebar-body[b-v72gqkjiuu] {
    font-family: var(--sp-font-ui);
    font-size: 0.95rem;
    color: rgba(255,255,255,0.6);
    line-height: 1.65;
    margin-bottom: 1.75rem;
}

.sp-gs-perks[b-v72gqkjiuu] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.sp-gs-perks li[b-v72gqkjiuu] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-family: var(--sp-font-ui);
    font-size: 0.95rem;
    color: rgba(255,255,255,0.85);
}

.sp-gs-perk-icon[b-v72gqkjiuu] {
    background: var(--sp-yellow);
    color: var(--sp-black);
    width: 20px;
    height: 20px;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    flex-shrink: 0;
}

/* ---- Main Panel ---- */

.sp-gs-main[b-v72gqkjiuu] {
    padding: 3rem 2.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 560px;
}

.sp-gs-title[b-v72gqkjiuu] {
    font-family: var(--sp-font-display);
    font-size: clamp(2rem, 4vw, 3.2rem);
    letter-spacing: 0.03em;
    margin-bottom: 0.6rem;
}

.sp-gs-desc[b-v72gqkjiuu] {
    font-family: var(--sp-font-ui);
    font-size: 1rem;
    color: var(--sp-gray);
    line-height: 1.55;
    margin-bottom: 2rem;
}

/* ---- Account Type Cards ---- */

.sp-gs-types[b-v72gqkjiuu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.sp-gs-type-card[b-v72gqkjiuu] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    width: 100%;
    padding: 1.1rem 1.25rem;
    background: #fff;
    border: 2.5px solid var(--sp-black);
    border-radius: var(--sp-radius);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.14s, background 0.14s, box-shadow 0.14s;
}

.sp-gs-type-card:hover[b-v72gqkjiuu] {
    box-shadow: var(--sp-shadow-sm);
}

.sp-gs-type-card--active[b-v72gqkjiuu] {
    border-color: var(--sp-black);
    background: var(--sp-yellow);
    box-shadow: var(--sp-shadow-sm);
}

.sp-gs-type-icon[b-v72gqkjiuu] {
    flex-shrink: 0;
    color: var(--sp-black);
    margin-top: 2px;
}

.sp-gs-type-name[b-v72gqkjiuu] {
    display: block;
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.04em;
    color: var(--sp-black);
    margin-bottom: 0.2rem;
}

.sp-gs-type-desc[b-v72gqkjiuu] {
    display: block;
    font-family: var(--sp-font-body);
    font-size: 0.85rem;
    color: var(--sp-gray);
    line-height: 1.4;
}

.sp-gs-type-card--active .sp-gs-type-desc[b-v72gqkjiuu] {
    color: rgba(26,26,26,0.65);
}

/* ---- Actions ---- */

.sp-gs-actions[b-v72gqkjiuu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.sp-gs-next-btn[b-v72gqkjiuu] {
    font-size: 1rem;
    padding: 0.75rem 2rem;
    width: fit-content;
}

.sp-gs-next-btn:disabled[b-v72gqkjiuu] {
    opacity: 0.4;
    cursor: not-allowed;
}

.sp-gs-signin-link[b-v72gqkjiuu] {
    font-family: var(--sp-font-ui);
    font-size: 0.9rem;
    color: var(--sp-gray);
    margin: 0;
}

.sp-gs-signin-link a[b-v72gqkjiuu] {
    color: var(--sp-black);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ---- Responsive ---- */

@media (max-width: 899px) {
    .sp-gs-shell[b-v72gqkjiuu] {
        grid-template-columns: 1fr;
    }

    .sp-gs-sidebar[b-v72gqkjiuu] {
        padding: 2rem 1.5rem;
    }

    .sp-gs-main[b-v72gqkjiuu] {
        padding: 2rem 1.5rem;
        max-width: 100%;
    }
}
/* /Pages/Home.razor.rz.scp.css */
/* ================================================
   HOME PAGE — Scoped Styles
   ================================================ */

/* ---- Hero ---- */

.sp-hero[b-7fw03er69j] {
    padding: 4rem 0 3.5rem;
    position: relative;
    overflow: hidden;
}

.sp-hero-title[b-7fw03er69j] {
    font-family: var(--sp-font-display);
    font-size: clamp(3rem, 7vw, 5.5rem);
    line-height: 0.95;
    letter-spacing: 0.02em;
    color: var(--sp-black);
    margin-bottom: 1.2rem;
}

.sp-hero-subtitle[b-7fw03er69j] {
    font-family: var(--sp-font-ui);
    font-size: clamp(1rem, 2.2vw, 1.2rem);
    font-weight: 400;
    color: var(--sp-gray);
    line-height: 1.55;
    max-width: 440px;
    margin-bottom: 2rem;
}

.sp-hero-actions[b-7fw03er69j] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.sp-hero-secondary-btn[b-7fw03er69j] {
    font-size: 0.9rem;
    padding: 0.6rem 1.4rem;
}

/* ---- Polaroid Grid ---- */

.sp-polaroid-grid[b-7fw03er69j] {
    position: relative;
    height: 340px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sp-polaroid[b-7fw03er69j] {
    position: absolute;
    background: #fff;
    padding: 10px 10px 36px;
    box-shadow: var(--sp-shadow);
    cursor: default;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.sp-polaroid:hover[b-7fw03er69j] {
    box-shadow: 4px 8px 24px rgba(0,0,0,0.28);
    z-index: 10;
}

.sp-polaroid-img[b-7fw03er69j] {
    width: 180px;
    height: 160px;
    overflow: hidden;
}

.sp-polaroid-placeholder[b-7fw03er69j] {
    width: 100%;
    height: 100%;
    background: var(--sp-cream-dark);
    background-image:
        linear-gradient(45deg, rgba(0,0,0,0.04) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(0,0,0,0.04) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(0,0,0,0.04) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(0,0,0,0.04) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.sp-polaroid-caption[b-7fw03er69j] {
    margin-top: 0;
    font-family: var(--sp-font-ui);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sp-gray);
    text-align: center;
    padding-top: 8px;
}

.sp-polaroid-1[b-7fw03er69j] {
    transform: rotate(-4deg) translate(-80px, -20px);
    z-index: 3;
}

.sp-polaroid-2[b-7fw03er69j] {
    transform: rotate(2.5deg) translate(20px, -40px);
    z-index: 2;
}

.sp-polaroid-3[b-7fw03er69j] {
    transform: rotate(-1.5deg) translate(120px, 10px);
    z-index: 1;
}

/* ---- Tape Decorations ---- */

.sp-tape[b-7fw03er69j] {
    position: absolute;
    pointer-events: none;
    z-index: 1;
    background: var(--sp-tape-color);
}

.sp-tape-hero-1[b-7fw03er69j] {
    width: 240px;
    height: 22px;
    top: 30px;
    right: 10%;
    transform: rotate(-12deg);
    opacity: 0.7;
}

.sp-tape-hero-2[b-7fw03er69j] {
    width: 160px;
    height: 18px;
    bottom: 40px;
    left: 8%;
    transform: rotate(6deg);
    opacity: 0.5;
}

.sp-tape-cta[b-7fw03er69j] {
    position: absolute;
    width: 110%;
    left: -5%;
    height: 22px;
    top: -8px;
    transform: rotate(-0.5deg);
    background: rgba(255,255,255,0.1);
    z-index: 2;
}

/* ---- Category Buttons ---- */

.sp-categories[b-7fw03er69j] {
    padding: 2.5rem 0 2rem;
    background: var(--sp-cream);
}

.sp-category-btn[b-7fw03er69j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    width: 100%;
    padding: 1.1rem 1.5rem;
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sp-black);
    background: var(--sp-cream);
    border: 2.5px solid var(--sp-black);
    border-radius: var(--sp-radius);
    text-decoration: none;
    transition: background 0.15s, color 0.15s, transform 0.1s;
    box-shadow: var(--sp-shadow-sm);
    position: relative;
    overflow: hidden;
}

.sp-category-btn[b-7fw03er69j]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--sp-yellow);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.2s ease;
    z-index: 0;
}

.sp-category-btn:hover[b-7fw03er69j]::before {
    transform: scaleX(1);
}

.sp-category-btn:hover[b-7fw03er69j] {
    color: var(--sp-black);
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: var(--sp-shadow);
}

.sp-category-btn > *[b-7fw03er69j] {
    position: relative;
    z-index: 1;
}

.sp-category-icon[b-7fw03er69j] {
    display: flex;
    align-items: center;
}

/* ---- Why Choose Us ---- */

.sp-why-us[b-7fw03er69j] {
    padding: 3rem 0 2.5rem;
    background: var(--sp-cream);
}

.sp-feature-icon[b-7fw03er69j] {
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}

.sp-feature-icon svg[b-7fw03er69j] {
    stroke: var(--sp-black);
}

.sp-feature-title[b-7fw03er69j] {
    font-family: var(--sp-font-display);
    font-size: 1.55rem;
    letter-spacing: 0.04em;
    margin-bottom: 0.5rem;
    color: var(--sp-black);
}

.sp-feature-desc[b-7fw03er69j] {
    font-family: var(--sp-font-body);
    font-size: 0.95rem;
    color: var(--sp-gray);
    line-height: 1.6;
    max-width: 260px;
    margin: 0 auto;
}

/* ---- Featured Artists ---- */

.sp-artists[b-7fw03er69j] {
    padding: 2.5rem 0 3rem;
    background: var(--sp-cream);
}

.sp-artist-card[b-7fw03er69j] {
    position: relative;
    overflow: hidden;
    border-radius: var(--sp-radius);
    box-shadow: var(--sp-shadow-sm);
    cursor: pointer;
    transition: transform 0.18s, box-shadow 0.18s;
}

.sp-artist-card:hover[b-7fw03er69j] {
    transform: translateY(-4px);
    box-shadow: var(--sp-shadow);
}

.sp-artist-img[b-7fw03er69j] {
    width: 100%;
    padding-bottom: 62%;   /* 16:10 aspect ratio */
    background: var(--sp-cream-dark);
    background-image:
        linear-gradient(135deg, rgba(0,0,0,0.06) 25%, transparent 25%),
        linear-gradient(-135deg, rgba(0,0,0,0.06) 25%, transparent 25%),
        linear-gradient(135deg, transparent 75%, rgba(0,0,0,0.06) 75%),
        linear-gradient(-135deg, transparent 75%, rgba(0,0,0,0.06) 75%);
    background-size: 24px 24px;
    background-position: 0 0, 0 12px, 12px -12px, -12px 0px;
    position: relative;
}

.sp-artist-label[b-7fw03er69j] {
    padding: 0.5rem 0.75rem;
    font-family: var(--sp-font-ui);
    font-weight: 600;
    font-size: 0.85rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: var(--sp-black);
    color: #fff;
    text-align: center;
}

/* ---- CTA Banner ---- */

.sp-cta-banner[b-7fw03er69j] {
    background: var(--sp-black);
    padding: 4rem 0 3.5rem;
    position: relative;
    overflow: hidden;
}

.sp-cta-title[b-7fw03er69j] {
    font-family: var(--sp-font-display);
    font-size: clamp(2.5rem, 6vw, 4rem);
    letter-spacing: 0.04em;
    color: #fff;
    margin-bottom: 0.75rem;
}

.sp-cta-subtitle[b-7fw03er69j] {
    font-family: var(--sp-font-ui);
    font-size: 1.1rem;
    color: rgba(255,255,255,0.65);
    margin-bottom: 2rem;
    letter-spacing: 0.03em;
}

/* ---- Responsive Overrides ---- */

@media (max-width: 991px) {
    .sp-polaroid-grid[b-7fw03er69j] {
        height: 260px;
    }

    .sp-polaroid-img[b-7fw03er69j] {
        width: 140px;
        height: 120px;
    }

    .sp-polaroid-1[b-7fw03er69j] {
        transform: rotate(-4deg) translate(-60px, -15px);
    }

    .sp-polaroid-2[b-7fw03er69j] {
        transform: rotate(2.5deg) translate(15px, -30px);
    }

    .sp-polaroid-3[b-7fw03er69j] {
        transform: rotate(-1.5deg) translate(90px, 8px);
    }
}

@media (max-width: 767px) {
    .sp-hero[b-7fw03er69j] {
        padding: 2.5rem 0 2rem;
    }

    .sp-hero-subtitle[b-7fw03er69j] {
        max-width: 100%;
    }

    .sp-polaroid-grid[b-7fw03er69j] {
        height: 210px;
        margin-top: 0.5rem;
    }

    .sp-polaroid-img[b-7fw03er69j] {
        width: 110px;
        height: 96px;
    }

    .sp-polaroid-1[b-7fw03er69j] {
        transform: rotate(-4deg) translate(-46px, -12px);
    }

    .sp-polaroid-2[b-7fw03er69j] {
        transform: rotate(2deg) translate(10px, -22px);
    }

    .sp-polaroid-3[b-7fw03er69j] {
        transform: rotate(-2deg) translate(68px, 5px);
    }

    .sp-tape-hero-1[b-7fw03er69j],
    .sp-tape-hero-2[b-7fw03er69j] {
        display: none;
    }
}

@media (max-width: 575px) {
    .sp-artist-card + .sp-artist-card[b-7fw03er69j] {
        margin-top: 0;
    }
}
/* /Pages/Login.razor.rz.scp.css */
.sp-auth-shell[b-q43my21k1b] {
    min-height: calc(100vh - var(--sp-nav-h) - 60px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    position: relative;
}

.sp-tape-login[b-q43my21k1b] {
    position: absolute;
    width: 200px;
    height: 20px;
    top: 50px;
    right: 10%;
    transform: rotate(-9deg);
    background: var(--sp-tape-color);
    opacity: 0.55;
    pointer-events: none;
}

.sp-auth-card[b-q43my21k1b] {
    width: 100%;
    max-width: 420px;
    background: #fff;
    border: 2.5px solid var(--sp-black);
    border-radius: var(--sp-radius);
    padding: 2.5rem 2.25rem;
    box-shadow: var(--sp-shadow);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    text-align: center;
}

.sp-auth-logo[b-q43my21k1b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
    margin-bottom: 1.5rem;
}

.sp-auth-logo-text[b-q43my21k1b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
    gap: 2px;
}

.sp-auth-logo-name[b-q43my21k1b] {
    font-family: var(--sp-font-display);
    font-size: 1.4rem;
    letter-spacing: 0.05em;
    color: var(--sp-black);
}

.sp-auth-logo-sub[b-q43my21k1b] {
    font-family: var(--sp-font-ui);
    font-size: 0.68rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--sp-gray);
}

.sp-auth-title[b-q43my21k1b] {
    font-family: var(--sp-font-display);
    font-size: 2.2rem;
    letter-spacing: 0.03em;
    margin-bottom: 0.4rem;
    width: 100%;
}

.sp-auth-subtitle[b-q43my21k1b] {
    font-family: var(--sp-font-ui);
    font-size: 0.95rem;
    color: var(--sp-gray);
    line-height: 1.5;
    margin-bottom: 1.75rem;
    width: 100%;
}

.sp-signin-btn[b-q43my21k1b] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    width: 100%;
    padding: 0.8rem 1rem;
    background: var(--sp-black);
    color: #fff;
    border: 2px solid var(--sp-black);
    border-radius: var(--sp-radius);
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    margin-bottom: 1.25rem;
}

.sp-signin-btn:hover[b-q43my21k1b] {
    background: var(--sp-yellow);
    color: var(--sp-black);
    border-color: var(--sp-black);
}

.sp-auth-divider[b-q43my21k1b] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    font-family: var(--sp-font-ui);
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sp-gray-light);
}

.sp-auth-divider[b-q43my21k1b]::before,
.sp-auth-divider[b-q43my21k1b]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--sp-cream-dark);
}

.sp-auth-register-btn[b-q43my21k1b] {
    width: 100%;
    text-align: center;
    margin-bottom: 1.5rem;
}

.sp-auth-fine-print[b-q43my21k1b] {
    font-family: var(--sp-font-body);
    font-size: 0.78rem;
    color: var(--sp-gray);
    line-height: 1.5;
    margin: 0;
}

.sp-auth-fine-print a[b-q43my21k1b] {
    color: var(--sp-black);
    text-decoration: underline;
    text-underline-offset: 2px;
}
/* /Pages/NotFound.razor.rz.scp.css */
.sp-notfound-shell[b-0afxiqc0wm] {
    min-height: calc(100vh - var(--sp-nav-h) - 60px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem 1.5rem;
    position: relative;
    overflow: hidden;
    text-align: center;
}

.sp-tape[b-0afxiqc0wm] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-nf1[b-0afxiqc0wm] {
    width: 280px;
    height: 22px;
    top: 60px;
    right: 8%;
    transform: rotate(-8deg);
    opacity: 0.5;
}

.sp-tape-nf2[b-0afxiqc0wm] {
    width: 200px;
    height: 18px;
    bottom: 80px;
    left: 6%;
    transform: rotate(5deg);
    opacity: 0.4;
}

.sp-notfound-content[b-0afxiqc0wm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    max-width: 520px;
}

.sp-notfound-num[b-0afxiqc0wm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    margin-bottom: 1.25rem;
}

.sp-notfound-num span[b-0afxiqc0wm] {
    font-family: var(--sp-font-display);
    font-size: clamp(5rem, 18vw, 10rem);
    line-height: 1;
    color: var(--sp-black);
    display: block;
}

.sp-notfound-skull[b-0afxiqc0wm] {
    flex-shrink: 0;
    margin: 0 0.25rem;
    transform: translateY(-4px);
}

.sp-notfound-title[b-0afxiqc0wm] {
    font-family: var(--sp-font-display);
    font-size: clamp(1.8rem, 5vw, 3rem);
    letter-spacing: 0.03em;
    margin-bottom: 0.75rem;
}

.sp-notfound-body[b-0afxiqc0wm] {
    font-family: var(--sp-font-ui);
    font-size: 1.05rem;
    color: var(--sp-gray);
    line-height: 1.6;
    margin-bottom: 2rem;
}

.sp-notfound-actions[b-0afxiqc0wm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}
/* /Pages/Orders.razor.rz.scp.css */
.sp-tape[b-6fj8ut1t4f] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-or1[b-6fj8ut1t4f] {
    width: 160px;
    height: 18px;
    top: 18px;
    right: 7%;
    transform: rotate(-7deg);
    opacity: 0.5;
}

.sp-orders-shell[b-6fj8ut1t4f] {
    padding: 2.5rem 0 3.5rem;
}

.sp-order-id[b-6fj8ut1t4f] {
    font-family: var(--sp-font-ui);
    font-weight: 700;
    letter-spacing: 0.08em;
    font-size: 0.9rem;
}

.sp-orders-view-link[b-6fj8ut1t4f] {
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sp-black);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s;
}

.sp-orders-view-link:hover[b-6fj8ut1t4f] {
    color: var(--sp-gray);
}
/* /Pages/Portfolio.razor.rz.scp.css */
.sp-tape[b-ztr1mpe1us] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-pf1[b-ztr1mpe1us] {
    width: 160px;
    height: 18px;
    top: 22px;
    right: 8%;
    transform: rotate(-7deg);
    opacity: 0.55;
}

.sp-portfolio-shell[b-ztr1mpe1us] {
    padding: 2.5rem 0 3rem;
}

.sp-portfolio-grid[b-ztr1mpe1us] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 200px;
    gap: 0.75rem;
}

.sp-portfolio-item[b-ztr1mpe1us] {
    position: relative;
    overflow: hidden;
    border-radius: var(--sp-radius);
    border: 2px solid var(--sp-black);
    cursor: pointer;
}

.sp-portfolio-item--featured[b-ztr1mpe1us] {
    grid-column: span 2;
    grid-row: span 2;
}

.sp-portfolio-img[b-ztr1mpe1us] {
    width: 100%;
    height: 100%;
    background: var(--sp-cream-dark);
    background-image:
        linear-gradient(135deg, rgba(0,0,0,0.06) 25%, transparent 25%),
        linear-gradient(-135deg, rgba(0,0,0,0.06) 25%, transparent 25%),
        linear-gradient(135deg, transparent 75%, rgba(0,0,0,0.06) 75%),
        linear-gradient(-135deg, transparent 75%, rgba(0,0,0,0.06) 75%);
    background-size: 24px 24px;
    background-position: 0 0, 0 12px, 12px -12px, -12px 0px;
    transition: transform 0.3s ease;
}

.sp-portfolio-item:hover .sp-portfolio-img[b-ztr1mpe1us] {
    transform: scale(1.04);
}

.sp-portfolio-overlay[b-ztr1mpe1us] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0.7rem 0.85rem 0.8rem;
    background: linear-gradient(transparent, rgba(26,26,26,0.88));
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    transform: translateY(100%);
    transition: transform 0.2s ease;
}

.sp-portfolio-item:hover .sp-portfolio-overlay[b-ztr1mpe1us] {
    transform: translateY(0);
}

.sp-portfolio-cat[b-ztr1mpe1us] {
    font-family: var(--sp-font-ui);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--sp-yellow);
}

.sp-portfolio-band[b-ztr1mpe1us] {
    font-family: var(--sp-font-display);
    font-size: 1.1rem;
    color: #fff;
    letter-spacing: 0.04em;
}

/* ---- Portfolio CTA ---- */

.sp-portfolio-cta[b-ztr1mpe1us] {
    padding: 2.5rem 0;
    border-top: 3px solid var(--sp-black);
}

.sp-portfolio-cta-title[b-ztr1mpe1us] {
    font-family: var(--sp-font-display);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    letter-spacing: 0.03em;
    margin-bottom: 0.5rem;
}

.sp-portfolio-cta-sub[b-ztr1mpe1us] {
    font-family: var(--sp-font-ui);
    font-size: 1rem;
    color: var(--sp-gray);
    line-height: 1.55;
    margin: 0;
}

/* ---- Responsive ---- */

@media (max-width: 899px) {
    .sp-portfolio-grid[b-ztr1mpe1us] {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 160px;
    }
}

@media (max-width: 599px) {
    .sp-portfolio-grid[b-ztr1mpe1us] {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 140px;
    }

    .sp-portfolio-item--featured[b-ztr1mpe1us] {
        grid-column: span 2;
        grid-row: span 1;
    }

    .sp-portfolio-overlay[b-ztr1mpe1us] {
        transform: translateY(0);
    }
}
/* /Pages/Products.razor.rz.scp.css */
.sp-tape[b-nn07fueikv] {
    position: absolute;
    pointer-events: none;
    background: var(--sp-tape-color);
}

.sp-tape-pg-1[b-nn07fueikv] {
    width: 200px;
    height: 20px;
    top: 20px;
    right: 6%;
    transform: rotate(-8deg);
    opacity: 0.6;
}

.sp-products-shell[b-nn07fueikv] {
    padding: 2.5rem 0 3rem;
}

.sp-product-grid[b-nn07fueikv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1.25rem;
}

.sp-product-card[b-nn07fueikv] {
    display: flex;
    flex-direction: column;
}

.sp-product-card-footer[b-nn07fueikv] {
    margin-top: auto;
    padding: 0.6rem 1.2rem 0.85rem;
    border-top: 1px solid var(--sp-cream-dark);
}

.sp-product-order-btn[b-nn07fueikv] {
    font-family: var(--sp-font-ui);
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sp-gray);
    transition: color 0.15s;
}

.sp-product-card:hover .sp-product-order-btn[b-nn07fueikv] {
    color: var(--sp-black);
}

.sp-card--loading[b-nn07fueikv] {
    pointer-events: none;
}

.sp-products-cta[b-nn07fueikv] {
    padding: 2.5rem 0;
    background: var(--sp-cream);
}

.sp-products-cta-text[b-nn07fueikv] {
    font-family: var(--sp-font-ui);
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--sp-gray);
    margin-bottom: 1rem;
}

@media (max-width: 575px) {
    .sp-product-grid[b-nn07fueikv] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.85rem;
    }
}