/* ================================
   PAGE-BUYERSGUIDE.CSS
   Styles specific to albumbuyersguide.html
   Loaded AFTER styles.css and page-albumdetail.css
   ================================ */

/* ================================
   INTRO TEXT
   Centered text below the page headline
   ================================ */
.guide-intro {
    text-align: center;
    font-family: 'Rosario', sans-serif;
    font-size: 15px;
    color: #545454;
    margin: 12px 0 25px;
    line-height: 1.4;
}

/* ================================
   ALBUM ENTRY
   Each album's section: title/rank, two-column layout,
   store link, then a divider.
   ================================ */
.guide-entry {
    margin-bottom: 0;
}

/* Album title line: "STANDARD DEVIATION (Danny's Personal Rank: #3)" */
.guide-album-title {
    font-family: 'Rosario', sans-serif;
    font-size: 16px;
    font-weight: 800;
    color: #545454;
    margin-bottom: 2px;
}

.guide-album-title a {
    color: rgb(51, 51, 99);
    text-decoration: none;
    text-transform: uppercase;
    transition: opacity 0.3s ease;
}

.guide-album-title a:hover {
    opacity: 0.7;
}

.guide-album-rank {
    font-family: 'Cabin Condensed', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #aaa;
    text-transform: none;
}

/* ================================
   TWO-COLUMN CONTENT LAYOUT
   Description on the left (~70%), favorite songs on the right (~30%)
   ================================ */
.guide-columns {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.guide-description {
    flex: 7;
    min-width: 0;
}

.guide-favorites {
    flex: 3;
    min-width: 0;
}

/* Column sub-headers */
.guide-column-label {
    font-family: 'Rosario', sans-serif;
    font-size: 13px;
    font-weight: 800;
    color: #545454;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.guide-column-label em {
    font-style: italic;
}

/* Description text */
.guide-text {
    font-family: 'Rosario', sans-serif;
    font-size: 15px;
    color: #545454;
    line-height: 1.45;
    text-align: justify;
    margin-bottom: 8px;
}

.guide-text em {
    font-style: italic;
}

.guide-text a {
    color: rgb(51, 51, 99);
    text-decoration: underline;
    transition: opacity 0.3s ease;
}

.guide-text a:hover {
    opacity: 0.7;
}

/* Note text (smaller, like the Prism "no more CDs" note) */
.guide-note {
    font-family: 'Rosario', sans-serif;
    font-size: 13px;
    color: #545454;
    line-height: 1.4;
    margin-top: 4px;
}

/* Favorite songs list */
.guide-song-list {
    font-family: 'Rosario', sans-serif;
    font-size: 15px;
    color: #545454;
    line-height: 1.6;
    text-align: center;
}

/* Store link */
.guide-store-link {
    margin-top: 6px;
    margin-bottom: 2px;
}

.guide-store-link a {
    font-family: 'Rosario', sans-serif;
    font-size: 13px;
    color: #545454;
    text-decoration: underline;
    transition: opacity 0.3s ease;
}

.guide-store-link a:hover {
    opacity: 0.7;
}

/* Divider between album entries */
.guide-divider {
    border: none;
    border-top: 1px solid #ccc;
    margin: 5px 0 15px;
}

/* ================================
   RESPONSIVE — MOBILE (≤768px)
   ================================ */
@media (max-width: 768px) {

    .guide-intro {
        font-size: 14px;
    }

    .guide-columns {
        flex-direction: column;
        gap: 12px;
    }

    .guide-favorites {
        text-align: center;
    }

    .guide-text {
        font-size: 14px;
    }

    .guide-song-list {
        font-size: 14px;
    }

    .guide-album-title {
        font-size: 15px;
    }

    .guide-album-rank {
        font-size: 12px;
    }

    .guide-column-label {
        font-size: 12px;
    }
}