/*
Theme Name: Hardcore Band
Theme URI: https://example.com/hardcore-band
Author: Your Name
Author URI: https://example.com
Description: A block theme for bands and musicians. Fully editable in the WordPress Site Editor — change the header, footer, homepage, and every page visually. Minimal, image-forward aesthetic with bold uppercase typography and a full-bleed hero. Includes Tour Dates and Releases post types.
Version: 2.0.0
Requires at least: 6.4
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hardcore-band
Tags: block-theme, full-site-editing, music, band, one-column, custom-menu, featured-images, translation-ready, block-patterns, block-styles, wide-blocks, editor-style
*/

/* Small utility layer — the block editor handles most styling via theme.json */

body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

a { transition: opacity .2s ease; }
a:hover { opacity: .65; }

.wp-block-navigation .wp-block-navigation-item__content:hover { opacity: .65; }

/* Product / release card hover zoom */
.hb-card img { transition: transform .5s ease; }
.hb-card:hover img { transform: scale(1.04); }

/* Underline animation on nav */
.wp-block-navigation__container > .wp-block-navigation-item > a { position: relative; }
.wp-block-navigation__container > .wp-block-navigation-item > a::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: -2px;
    height: 2px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}
.wp-block-navigation__container > .wp-block-navigation-item > a:hover::after,
.wp-block-navigation__container > .current-menu-item > a::after {
    transform: scaleX(1);
}

/* Hero overlay */
.hb-hero {
    position: relative;
}
.hb-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0) 55%);
    pointer-events: none;
    z-index: 1;
}
.hb-hero > .wp-block-cover__inner-container,
.hb-hero .wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
}

/* Tour list row */
.hb-tour-row {
    display: grid;
    grid-template-columns: 120px 1fr auto;
    gap: 32px;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid #eee;
}
.hb-tour-row .hb-tour-date {
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 14px;
}
.hb-tour-row .hb-tour-venue strong { display: block; font-weight: 700; }
.hb-tour-row .hb-tour-venue span { color: #666; font-size: 13px; }
.hb-tour-row .hb-tour-tickets a {
    padding: 10px 22px;
    border: 2px solid currentColor;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    text-decoration: none;
    display: inline-block;
}
.hb-tour-row .hb-tour-tickets a:hover {
    background: #111;
    color: #fff;
    opacity: 1;
}

/* Release grid */
.hb-releases {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px;
}
.hb-release { text-align: center; }
.hb-release__cover {
    aspect-ratio: 1 / 1;
    background: #f4f4f4;
    margin-bottom: 16px;
    overflow: hidden;
}
.hb-release__cover img {
    width: 100%; height: 100%; object-fit: cover;
}
.hb-release__title {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .08em;
    margin: 0 0 4px;
    text-transform: uppercase;
}
.hb-release__year {
    font-size: 13px;
    color: #666;
    letter-spacing: .1em;
    margin-bottom: 12px;
}
.hb-release__links {
    display: flex;
    justify-content: center;
    gap: 16px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
}
.hb-release__links a { border-bottom: 1px solid currentColor; padding-bottom: 2px; text-decoration: none; }

/* Responsive tour list */
@media (max-width: 768px) {
    .hb-tour-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .hb-releases { grid-template-columns: 1fr; }
}

@media (max-width: 1024px) {
    .hb-releases { grid-template-columns: repeat(2, 1fr); }
}

/* Social icons in footer */
.hb-socials {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.hb-socials a {
    display: inline-flex;
    width: 36px; height: 36px;
    align-items: center; justify-content: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    text-decoration: none;
    opacity: .8;
    transition: opacity .2s, background .2s, color .2s;
}
.hb-socials a:hover {
    opacity: 1;
    background: currentColor;
}
.hb-socials a:hover svg {
    fill: #fff;
}
.hb-socials svg { width: 16px; height: 16px; fill: currentColor; }
