/* ==========================================================================
   KOFLAK — theme override
   Paleta oficial (Dossier de Artista): 70% negro / 20% oro / 10% rojo
   ========================================================================== */

:root {
    --koflak-black: #0b0d0d;
    --koflak-black-soft: #141414;
    --koflak-gold: #d4af3f;
    --koflak-gold-soft: #e9cd7a;
    --koflak-white: #ffffff;
    --koflak-red: #cc1730;
}

body {
    font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
    background: var(--koflak-black);
}

h1, h2, h3, h4, h5, h6,
.large, .uppercase, .block-title h1, .block-title h6,
.main-menu a, .btn, .btn-primary, .block-album h4, .block-member h4,
h1.large, .inner-hero h1 {
    font-family: 'Anton', 'Roboto', sans-serif !important;
    letter-spacing: 0.03em;
}

/* ---- Accent color: gold replaces default bootstrap blue ---- */

.btn-primary,
.block-top,
.mfp-arrow:before {
    background-color: var(--koflak-gold) !important;
    border-color: var(--koflak-gold) !important;
    color: var(--koflak-black) !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--koflak-gold-soft) !important;
    border-color: var(--koflak-gold-soft) !important;
    color: var(--koflak-black) !important;
}

.btn-s.btn, a.link, .swap-color, .block-title h6, h6.uppercase.mb-1 {
    color: var(--koflak-gold) !important;
}

.btn-s.btn {
    border-color: var(--koflak-gold) !important;
}

.header .logo img {
    max-height: 46px;
    width: auto;
}

a, .scroll:hover, .main-menu a:hover {
    color: inherit;
}

.main-nav .main-menu a:hover {
    color: var(--koflak-gold) !important;
}

.loader {
    background: var(--koflak-black) !important;
}

.spinner {
    stroke: var(--koflak-gold) !important;
}

/* ---- Photography: unify mixed lighting into one cohesive dark/gold mood ---- */

.hero .background-img img,
.about img,
.block-images img,
.divider .background-img img,
.card-gallery img,
.block-album img {
    filter: grayscale(12%) contrast(1.08) brightness(0.92) saturate(1.05);
}

.hero .overlay:before,
.divider.overlay:before {
    background: linear-gradient(180deg, rgba(11,13,13,.55) 0%, rgba(11,13,13,.75) 100%);
}

/* ---- Social icons ---- */

.block-social a, .socicon-spotify, .socicon-apple, .socicon-youtube {
    color: var(--koflak-white);
    transition: color .2s ease;
}

.block-social a:hover {
    color: var(--koflak-gold);
}

.block-social.colored li a {
    background: var(--koflak-black-soft) !important;
    border: 1px solid var(--koflak-gold);
}

.block-social.colored li a:hover {
    background: var(--koflak-gold) !important;
    color: var(--koflak-black) !important;
}

/* ---- Countdown ---- */

.countdown {
    color: var(--koflak-gold);
    font-family: 'Anton', sans-serif;
    font-size: 1.4rem;
}

/* ---- Spotify embed ---- */

.koflak-spotify-embed {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0,0,0,.5);
}

/* ---- Cortos / video preview ---- */

.koflak-video-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: var(--koflak-black-soft);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
}

.koflak-video-wrap .koflak-video-poster {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(12%) contrast(1.08) brightness(0.85);
}

.koflak-video-wrap video {
    width: 100%;
    height: 100%;
    display: block;
    background: #000;
}

.koflak-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 74px;
    height: 74px;
    border-radius: 50%;
    background: rgba(212, 175, 63, 0.92);
    border: none;
    color: var(--koflak-black);
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .2s ease, background .2s ease;
}

.koflak-video-wrap:hover .koflak-video-play {
    transform: translate(-50%, -50%) scale(1.08);
    background: var(--koflak-gold-soft);
}

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

.card.block-info {
    background: var(--koflak-black-soft);
    border: 1px solid rgba(212, 175, 63, 0.25);
}

.card.block-info a {
    color: var(--koflak-white);
}

.card.block-info a:hover {
    color: var(--koflak-gold);
}

/* ---- Footer ---- */

.footer-monograma {
    width: 40px;
    height: auto;
    opacity: 0.9;
}

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

@media (max-width: 767px) {
    .koflak-video-wrap {
        aspect-ratio: 16 / 10;
        margin-bottom: 8px;
    }

    .block-tour .col-lg-3.text-center,
    .block-tour .col-lg-6,
    .block-tour .text-md-right {
        text-align: center !important;
        margin-bottom: 6px;
    }

    .header .logo img {
        max-height: 34px;
    }
}