/* Industrial Theme v1
   Theme values live in tokens.css under:
   body[data-site-theme="industrial"]
*/

body[data-site-theme="industrial"] h1,
body[data-site-theme="industrial"] h2,
body[data-site-theme="industrial"] h3,
body[data-site-theme="industrial"] .brand-link,
body[data-site-theme="industrial"] .button,
body[data-site-theme="industrial"] .btn {
    font-family: var(--sf-font-heading);
    letter-spacing: 0.035em;
}

body[data-site-theme="industrial"] .brand-link {
    text-transform: uppercase;
}

body[data-site-theme="industrial"] .button,
body[data-site-theme="industrial"] .btn {
    text-transform: uppercase;
}

/* Page hero / display headings */

body[data-site-theme="industrial"] .page-hero-card,
body[data-site-theme="industrial"] .range-hero-card,
body[data-site-theme="industrial"] .hero-grid {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--sf-brand-primary) 8%, transparent),
            var(--sf-page-surface)
        );
    border: 1px solid var(--sf-card-border);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
}

body[data-site-theme="industrial"] .page-hero h1,
body[data-site-theme="industrial"] .range-copy h1,
body[data-site-theme="industrial"] .hero-kicker,
body[data-site-theme="industrial"] .hero-copy h1 {
    color: var(--sf-heading-primary);
    font-family: var(--sf-font-heading);
    font-weight: 900;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    text-shadow: 0 3px 0 rgba(0, 0, 0, 0.35);
}

body[data-site-theme="industrial"] .page-hero h1,
body[data-site-theme="industrial"] .range-copy h1 {
    font-size: clamp(3rem, 7vw, 5.5rem);
}

body[data-site-theme="industrial"] .page-hero p,
body[data-site-theme="industrial"] .range-copy p,
body[data-site-theme="industrial"] .hero-subtext {
    color: var(--sf-heading-secondary);
    font-family: var(--sf-font-ui);
    font-style: italic;
    letter-spacing: 0.06em;
}

/* Section headings */

body[data-site-theme="industrial"] .section-heading h2,
body[data-site-theme="industrial"] .seasonal-heading h2 {
    color: var(--sf-heading-primary);
    font-family: var(--sf-font-heading);
    font-weight: 900;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

body[data-site-theme="industrial"] .section-heading h2 span {
    color: var(--sf-heading-secondary);
    font-style: normal;
}

/* Cards / highlighted surfaces */

body[data-site-theme="industrial"] .product-card,
body[data-site-theme="industrial"] .collection-card,
body[data-site-theme="industrial"] .obsession-card,
body[data-site-theme="industrial"] .cart-item,
body[data-site-theme="industrial"] .cart-summary,
body[data-site-theme="industrial"] .cart-empty {
    border-color: var(--sf-card-border);
}

body[data-site-theme="industrial"] .product-card:hover,
body[data-site-theme="industrial"] .collection-card:hover,
body[data-site-theme="industrial"] .obsession-card:hover {
    border-color: var(--sf-brand-primary);
}

/* Collections industrial layout */

body[data-site-theme="industrial"] .page-hero {
    padding: 1rem 0 0;
    background: var(--sf-page-bg);
}

body[data-site-theme="industrial"] .page-hero-card {
    padding: clamp(3rem, 7vw, 5.5rem) 1.5rem;
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--sf-brand-primary) 8%, transparent),
            var(--sf-page-surface)
        );
    border: 1px solid var(--sf-card-border);
    border-radius: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

body[data-site-theme="industrial"] .page-hero h1 {
    margin-bottom: 1.2rem;
    color: var(--sf-heading-primary);
    font-size: clamp(4rem, 10vw, 7.5rem);
    line-height: 0.9;
}

body[data-site-theme="industrial"] .page-hero h1::after {
    content: "";
    display: block;
    width: 5.5rem;
    height: 0.25rem;
    margin: 1.25rem auto 0;
    background: var(--sf-brand-primary);
}

body[data-site-theme="industrial"] .page-hero p {
    color: var(--sf-brand-primary);
    font-size: clamp(1rem, 2vw, 1.35rem);
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body[data-site-theme="industrial"] .collections-section {
    padding: 3rem 0 4rem;
    background:
        radial-gradient(
            circle at top,
            color-mix(in srgb, var(--sf-brand-primary) 5%, transparent),
            transparent 32rem
        ),
        var(--sf-page-bg);
}

body[data-site-theme="industrial"] .collections-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 980px;
    margin: 0 auto;
}

body[data-site-theme="industrial"] .collection-card {
    border-radius: 6px;
    background: linear-gradient(
        180deg,
        var(--sf-card-bg),
        var(--sf-page-surface)
    );
}

body[data-site-theme="industrial"] .collection-info {
    padding: 1.5rem;
}

body[data-site-theme="industrial"] .collection-info h3 {
    font-size: clamp(2rem, 4vw, 3rem);
    text-transform: uppercase;
}

body[data-site-theme="industrial"] .collection-info h3::after {
    content: "";
    display: block;
    width: 4rem;
    height: 0.18rem;
    margin: 0.7rem auto 0;
    background: var(--sf-brand-primary);
}

body[data-site-theme="industrial"] .collection-info p {
    max-width: 24rem;
    margin: 0 auto;
    color: var(--sf-text-secondary);
    font-size: 1.05rem;
}

body[data-site-theme="industrial"] .collection-info .btn {
    margin-top: 1rem;
    border: 1px solid var(--sf-brand-primary);
    background: transparent;
    color: var(--sf-brand-primary);
}

body[data-site-theme="industrial"] .collection-info .btn:hover {
    background: var(--sf-brand-primary);
    color: var(--sf-brand-text);
}
