/*
 * Half Baked Ska V2 - cleaned stylesheet
 * Dead selectors from superseded layouts removed 2026-09-02.
 * Keep this file in load order before theme-red.css and hero-agreed.css.
 */

:root {--red: #c51f24;
    --red-dark: #951419;
    --cream: #eee8dc;
    --cream-dark: #ddd3c4;
    --black: #090909;
    --panel: #171717;
    --grey: #aaa;}

body {background:
        radial-gradient(
            circle at 50% 0,
            #171717 0,
            #0d0d0d 48%,
            #080808 100%
        );

    color: #fff;}

::selection {background: var(--red);
    color: #fff;}

.home-section-label {color: var(--red);}

.button {background: var(--red);
    border-color: var(--red);
    color: #fff;}

.button:hover {background: var(--red-dark);
    border-color: var(--red-dark);}

.button.secondary {background: transparent;
    border-color: #777;
    color: #fff;}

.button.secondary:hover {background: #fff;
    border-color: #fff;
    color: #111;}

header {max-width: 1180px;
    padding: 22px 25px 24px;}

.main-nav a {position: relative;}

.main-nav a.active {border-bottom: 0;
    color: #fff;}

.main-nav a.active::after {content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: -8px;

    height: 3px;

    background: var(--red);}

.home-next-gig {max-width: 1180px;

    margin: 0 auto 70px;
    padding: 0;

    grid-template-columns: 135px 1fr 170px;

    position: relative;

    background: var(--cream);
    color: #111;

    border: 0;

    box-shadow:
        0 0 0 1px #fff,
        8px 8px 0 rgba(0,0,0,.35);}

.home-next-gig::before,
.home-next-gig::after {content: "";

    position: absolute;

    top: 50%;

    width: 25px;
    height: 50px;

    border-radius: 50%;

    background: #090909;

    transform: translateY(-50%);}

.home-next-gig::before {left: -13px;}

.home-next-gig::after {right: -13px;}

.home-next-date {background: #fff;
    color: #111;

    border-right: 1px dashed #999;}

.home-next-day {color: #111;

    font-family: Impact, "Arial Black", sans-serif;
    font-size: 52px;}

.home-next-month {color: var(--red);}

.home-entry {border-color: var(--red);
    color: var(--red);}

.home-next-action {background: var(--cream);

    border-left: 1px dashed #999;}

.home-intro {max-width: 1100px;}

.home-intro h2 {font-family: Impact, "Arial Black", sans-serif;

    letter-spacing: -1px;
    line-height: .9;}

.home-intro h2::after {content: "";

    display: block;

    width: 55px;
    height: 4px;

    margin-top: 16px;

    background: var(--red);}

.home-music h2,
.home-videos h2,
.home-gallery-cta h2,
.home-booking h2,
.page-heading {font-family: Impact, "Arial Black", sans-serif;

    letter-spacing: -1px;}

.home-track {min-height: 170px;

    position: relative;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #1c1c1c,
            #111
        );

    border-top: 3px solid #555;
    border-bottom: 3px solid transparent;}

.home-track:hover {border-bottom-color: var(--red);}

.home-track span {color: var(--red);}

.home-track h3 {position: relative;
    z-index: 2;

    font-family: Impact, "Arial Black", sans-serif;}

.home-track::after {content: "";

    position: absolute;

    right: -25px;
    bottom: -25px;

    width: 95px;
    height: 95px;

    border: 13px solid #090909;
    border-radius: 50%;}

.home-video-preview {border-top-color: var(--red);

    box-shadow:
        7px 7px 0 #171717;}

.home-video-play {background: var(--red);
    color: #fff;}

.home-video-copy h3 {font-family: Impact, "Arial Black", sans-serif;

    letter-spacing: -1px;
    line-height: .92;}

.video-card {border-top-color: var(--red);}

.video-tag {color: var(--red);}

.home-gallery-cta {min-height: 245px;

    background:
        linear-gradient(
            135deg,
            #f6f1e8,
            var(--cream)
        );

    border-top: 0;

    color: #111;

    box-shadow:
        7px 7px 0 #171717;}

.home-gallery-cta .home-section-label {color: var(--red);}

.home-gallery-cta h2,
.home-gallery-mark {color: #111;}

.home-gallery-cta p {color: #555;}

.home-gallery-mark strong {color: var(--red);}

.home-booking {position: relative;

    overflow: hidden;

    background:
        linear-gradient(
            120deg,
            var(--red-dark),
            var(--red)
        );

    color: #fff;

    border: 0;

    box-shadow:
        7px 7px 0 #171717;}

.home-booking .home-section-label {color: #fff;
    opacity: .75;}

.home-booking .button {background: #0a0a0a;
    border-color: #0a0a0a;}

.home-booking .button.secondary {background: transparent;
    border-color: #fff;}

.page-heading::after {content: "";

    display: block;

    width: 70px;
    height: 5px;

    margin-top: 16px;

    background: var(--red);}

.music-track,
.video-card,
.contact-card,
.setup-section {border-color: var(--red);}

@media (max-width: 800px) {.home-next-gig {grid-template-columns: 100px 1fr;}

.home-next-action {grid-column: 1 / -1;

        border-left: 0;
        border-top: 1px dashed #999;}}

@media (max-width: 750px) {.main-nav a.active {background: var(--red);
        color: #fff;}

.main-nav a.active::after {display: none;}}

@media (max-width: 500px) {.home-next-gig {margin-left: 20px;
        margin-right: 20px;}}

header {max-width: 1220px;}

.home-next-gig {max-width: 1280px;

    margin-bottom: 18px;

    min-height: 105px;

    grid-template-columns:
        135px
        minmax(0, 1fr)
        180px;}

.home-next-date {padding-top: 15px;
    padding-bottom: 15px;}

.home-next-action {padding: 18px;}

.home-feature-grid {max-width: 1280px;

    margin: 0 auto 18px;
    padding: 0 25px;

    display: grid;

    grid-template-columns:
        .88fr
        1.38fr
        1.15fr;

    gap: 0;

    align-items: stretch;}

.home-feature-grid > .home-intro,
.home-feature-grid > .home-music,
.home-feature-grid > .home-videos {width: auto;
    max-width: none;

    min-height: 290px;

    margin: 0;

    padding: 22px;

    border-top: 1px solid #333;}

.home-feature-grid > .home-intro,
.home-feature-grid > .home-music {border-right: 1px solid #333;}

.home-feature-grid .home-intro {display: block;

    position: relative;}

.home-feature-grid .home-intro::before {content: "★";

    position: absolute;

    left: 0;
    top: 19px;

    color: var(--red);

    font-size: 15px;}

.home-feature-grid .home-intro > div:first-child {padding-left: 18px;}

.home-feature-grid .home-intro h2 {margin: 6px 0 12px;

    font-size: 27px;
    line-height: .95;}

.home-feature-grid .home-intro p {margin: 0 0 10px;

    font-size: 14px;
    line-height: 1.45;

    color: #ccc;}

.home-feature-grid .home-music .home-section-heading {margin-bottom: 12px;}

.home-feature-grid .home-music .home-section-heading h2 {margin: 0;

    font-size: 30px;}

.home-feature-grid .home-music .home-section-label {display: none;}

.home-feature-grid .home-track-grid {grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;}

.home-feature-grid .home-track {min-height: 145px;

    padding: 14px 12px;

    border-top: 2px solid #555;}

.home-feature-grid .home-track span {font-size: 9px;}

.home-feature-grid .home-track h3 {margin: 22px 0 18px;

    font-size: 18px;
    line-height: .95;}

.home-feature-grid .home-track strong {font-size: 9px;}

.home-feature-grid .home-videos .home-section-heading {margin-bottom: 12px;}

.home-feature-grid .home-videos .home-section-heading h2 {margin: 0;

    font-size: 30px;}

.home-feature-grid .home-video-teaser {grid-template-columns:
        1.05fr
        .95fr;

    gap: 14px;

    align-items: center;}

.home-feature-grid .home-video-preview {height: 155px;

    min-height: 0;

    padding: 4px;
    gap: 3px;

    border-top: 2px solid var(--red);}

.home-feature-grid .home-video-preview img {min-height: 0;}

.home-feature-grid .home-video-play {width: 46px;
    height: 46px;

    font-size: 17px;}

.home-feature-grid .home-video-copy {padding: 0;}

.home-feature-grid .home-video-copy .home-section-label {font-size: 8px;}

.home-feature-grid .home-video-copy h3 {margin: 6px 0 10px;

    font-size: 23px;
    line-height: .9;}

.home-feature-grid .home-video-copy p {margin-bottom: 12px;

    font-size: 11px;
    line-height: 1.4;}

.home-feature-grid .home-video-copy .button {padding: 10px 13px;

    font-size: 10px;}

.home-bottom-grid {max-width: 1280px;

    margin: 0 auto 45px;
    padding: 0 25px;

    display: grid;

    grid-template-columns:
        1.08fr
        .92fr;

    gap: 18px;

    align-items: stretch;}

.home-bottom-grid > .home-gallery,
.home-bottom-grid > .home-booking {width: auto;
    max-width: none;

    margin: 0;
    padding: 0;}

.home-bottom-grid .home-gallery-cta {height: 100%;
    min-height: 175px;

    padding: 25px;

    grid-template-columns:
        1.35fr
        .65fr
        auto;

    gap: 25px;}

.home-bottom-grid .home-gallery-cta h2 {margin: 5px 0 8px;

    font-size: 40px;}

.home-bottom-grid .home-gallery-cta p {margin: 0;

    font-size: 13px;
    line-height: 1.4;}

.home-bottom-grid .home-gallery-mark {font-size: 18px;}

.home-bottom-grid .home-booking {min-height: 175px;

    padding: 26px 28px;

    display: flex;
    justify-content: space-between;
    align-items: center;}

.home-bottom-grid .home-booking h2 {margin: 6px 0 8px;

    font-size: 38px;}

.home-bottom-grid .home-booking p {margin: 0;

    font-size: 13px;}

.home-bottom-grid .home-booking-buttons {min-width: 165px;}

.home-bottom-grid .home-booking .button {width: 100%;}

.home-bottom-grid .home-booking .button.secondary {background: #3b5998;
    border-color: #6d86bd;
    color: #fff;}

.home-bottom-grid .home-booking .button.secondary:hover {background: #29487d;}

.home-intro,
.home-music,
.home-videos,
.home-gallery,
.home-booking {margin-top: 0;
    margin-bottom: 0;}

@media (max-width: 950px) {.home-feature-grid {grid-template-columns:
            1fr
            1fr;}

.home-feature-grid > .home-intro {grid-column: 1 / -1;

        min-height: auto;

        border-right: 0;}

.home-bottom-grid {grid-template-columns: 1fr;}}

@media (max-width: 650px) {.home-feature-grid {grid-template-columns: 1fr;

        padding-left: 20px;
        padding-right: 20px;}

.home-feature-grid > .home-intro,
.home-feature-grid > .home-music,
.home-feature-grid > .home-videos {grid-column: auto;

        border-right: 0;
        border-bottom: 1px solid #333;}

.home-feature-grid .home-track-grid {grid-template-columns: 1fr;}

.home-feature-grid .home-video-teaser {grid-template-columns: 1fr;}

.home-feature-grid .home-video-preview {height: 280px;}

.home-bottom-grid {padding-left: 20px;
        padding-right: 20px;}

.home-bottom-grid .home-gallery-cta {grid-template-columns: 1fr;}}

.home-feature-grid .home-intro h2 {font-family: Arial, Helvetica, sans-serif;

    font-size: 25px;
    font-weight: 900;

    line-height: .95;
    letter-spacing: -1px;}

.home-feature-grid .home-track h3 {font-family: Arial, Helvetica, sans-serif;

    font-size: 15px;
    font-weight: 900;

    line-height: 1.05;
    letter-spacing: -.3px;}

.home-feature-grid .home-track span,
.home-feature-grid .home-track strong {font-family: Arial, Helvetica, sans-serif;

    font-weight: 900;}

.home-feature-grid .home-video-copy h3 {font-family: Arial, Helvetica, sans-serif;

    font-size: 19px;
    font-weight: 900;

    line-height: 1;
    letter-spacing: -.5px;}

.home-feature-grid .home-video-copy p {font-family: Arial, Helvetica, sans-serif;

    font-size: 12px;
    line-height: 1.45;}

.home-feature-grid .home-section-label {font-family: Arial, Helvetica, sans-serif;

    font-weight: 900;

    letter-spacing: 2px;}

.home-feature-grid .home-music .home-section-heading h2,
.home-feature-grid .home-videos .home-section-heading h2 {font-family: Impact, "Arial Black", sans-serif;

    font-size: 32px;}

.home-feature-grid {grid-template-columns:
        .95fr
        1.45fr
        1.25fr;}

.home-feature-grid > .home-intro,
.home-feature-grid > .home-music,
.home-feature-grid > .home-videos {min-height: 310px;
    padding: 24px;}

.home-feature-grid .home-track {min-height: 155px;}

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

.hbs-header {width: 100%;
    max-width: 1220px;

    margin: 0 auto;

    padding: 18px 25px 14px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 45px;}

.hbs-header-logo {position: relative;

    display: flex;
    align-items: baseline;

    gap: 5px;

    padding-bottom: 12px;

    color: #eee8dc;

    text-decoration: none;

    white-space: nowrap;

    font-family:
        Impact,
        "Arial Black",
        Arial,
        sans-serif;

    font-size: 27px;
    font-weight: 900;

    line-height: 1;

    letter-spacing: .5px;

    text-transform: uppercase;}

.hbs-header .main-nav {margin-left: auto;

    display: flex;
    align-items: center;

    gap: 31px;}

.hbs-header .main-nav a {position: relative;

    padding: 3px 0;

    color: #d3cec5;

    text-decoration: none;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 13px;
    font-weight: 900;

    letter-spacing: .4px;

    text-transform: uppercase;

    border: 0;}

.hbs-header .main-nav a:hover {color: #fff;}

.hbs-header .main-nav a.active {color: var(--red);
    border: 0;}

.hbs-header .main-nav a.active::after {content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: -9px;

    height: 3px;

    background: var(--red);}

@media (max-width: 800px) {.hbs-header {padding:
            22px
            32px;}

.hbs-header-logo {font-size: 27px;}

.hbs-header .main-nav {gap: 0;}}

@media (max-width: 500px) {.hbs-header {padding:
            18px
            24px;}

.hbs-header-logo {font-size: 23px;}}
