/* ── Sensory Shop page styles ── */
.sa-hero {
    background: #0d3068;
    padding: 70px 0 60px;
    text-align: center;
}
.sa-hero-eyebrow {
    font: 700 11px/1 'Roboto', Arial, sans-serif;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: rgba(255,255,255,0.6);
    margin: 0 0 18px;
}
.sa-hero h1 {
    font: 700 52px/1.1 'Roboto', Arial, sans-serif;
    color: #fff;
    margin: 0 0 16px;
    letter-spacing: -1px;
}
.sa-hero-sub {
    font: 300 18px/1.7 'Roboto', Arial, sans-serif;
    color: rgba(255,255,255,0.8);
    max-width: 560px;
    margin: 0 auto;
}

.sa-catalog {
    background: #fff;
    padding: 60px 0 80px;
}
.sa-catalog-intro {
    font: 300 17px/1.7 'Roboto', Arial, sans-serif;
    color: #555;
    margin: 16px 0 0;
}

.sa-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    margin-top: 40px;
}
.sa-card {
    flex: 0 0 calc(33.333% - 19px);
    background: #f8f8f8;
    border-top: 3px solid #cc1f1f;
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.sa-card-img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
}
.sa-card-body {
    padding: 20px 22px 26px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.sa-card-name {
    font: 700 18px/1.2 'Roboto', Arial, sans-serif;
    color: #1e1e1e;
    margin: 0 0 8px;
}
.sa-card-weight {
    display: inline-block;
    font: 700 11px/1 'Roboto', Arial, sans-serif;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #fff;
    background: #cc1f1f;
    border-radius: 3px;
    padding: 5px 10px;
    margin-bottom: 14px;
    align-self: flex-start;
}
.sa-card-desc {
    font: 300 15px/1.65 'Roboto', Arial, sans-serif;
    color: #555;
    margin: 0;
    flex: 1;
}

.sa-empty {
    text-align: center;
    padding: 60px 0 40px;
}
.sa-empty p {
    font: 300 17px/1.6 'Roboto', Arial, sans-serif;
    color: #888;
    margin-bottom: 28px;
}

.sa-cta {
    background: #cc1f1f;
    padding: 50px 0;
    text-align: center;
}
.sa-cta h2 { color: #fff; margin-bottom: 12px; }
.sa-cta p {
    font: 300 17px/1.6 'Roboto', Arial, sans-serif;
    color: rgba(255,255,255,0.85);
    max-width: 520px;
    margin: 0 auto 28px;
}
.sa-cta .more_btn2 {
    background: #fff;
    color: #cc1f1f;
    border-color: #fff;
}
.sa-cta .more_btn2:hover {
    background: rgba(255,255,255,0.88);
}

@media (max-width: 800px) {
    .sa-card { flex: 0 0 calc(50% - 14px); }
}
@media (max-width: 500px) {
    .sa-hero h1 { font-size: 36px; }
    .sa-card { flex: 0 0 100%; }
}