/* gadgetChecks Article Header System – v0.7.3
   Reviews + gadgetCheck image-header prototype.
   The approved v0.5.5 master geometry remains untouched in frontend-v0.6.0.css.
   This file only skins test-format headers with featured-image art and score UI. */

body.gcahs-test-header-active.single-post .gcahs-header--test {
    background-color: #141820 !important;
    background-image:
        linear-gradient(90deg,
            rgba(12,15,21,.985) 0%,
            rgba(12,15,21,.955) 31%,
            rgba(12,15,21,.82) 50%,
            rgba(12,15,21,.46) 72%,
            rgba(12,15,21,.30) 100%),
        linear-gradient(0deg, rgba(8,11,16,.22), rgba(8,11,16,.08)),
        var(--gcahs-hero-image, none) !important;
    background-repeat: no-repeat !important;
    background-size: cover, cover, cover !important;
    background-position: center, center, center center !important;
}

body.gcahs-test-header-active.single-post .gcahs-header--test::before {
    border-color: rgba(var(--gcahs-accent-rgb),.20) !important;
    box-shadow:
        0 0 0 68px rgba(var(--gcahs-accent-rgb),.025),
        0 0 0 138px rgba(255,255,255,.012) !important;
}

body.gcahs-test-header-active.single-post .gcahs-header--test::after {
    opacity: .16 !important;
    background-image:
        linear-gradient(135deg, transparent 0 69%, rgba(var(--gcahs-accent-rgb),.16) 69% 69.15%, transparent 69.15% 100%),
        linear-gradient(90deg, transparent, rgba(255,255,255,.025)) !important;
    background-size: auto !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
}

body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-header__texture {
    opacity: .42 !important;
    background:
        radial-gradient(circle at 84% 30%, rgba(var(--gcahs-accent-rgb),.16), transparent 29%),
        linear-gradient(135deg, transparent 0 73%, rgba(var(--gcahs-accent-rgb),.14) 73% 73.15%, transparent 73.15% 100%) !important;
}

body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-header__copy,
body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-meta {
    text-shadow: 0 2px 18px rgba(0,0,0,.28);
}

body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-meta {
    background: rgba(10,13,19,.64) !important;
    border-color: rgba(255,255,255,.08) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}


/* v0.7.2 – requested desktop-only test-header polish.
   Series master and tablet/mobile geometry remain untouched. */
body.gcahs-test-header-active.single-post.gcahs-theme-gadgetcheck .gcahs-seriesname {
    gap: 0 !important;
    column-gap: 0 !important;
}

@media (min-width: 1181px) {
    body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-title {
        font-size: clamp(33px, 2.2vw, 37px) !important;
        line-height: 1.08 !important;
    }

    /* Place the score firmly inside the right-hand 30% identity zone instead
       of letting the wider legacy signet anchor pull it toward the headline. */
    body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-test-score {
        right: clamp(28px, 3.8vw, 58px) !important;
        width: clamp(250px, 20vw, 285px) !important;
    }
}

/* Reuse the existing series-visual anchor so Desktop, Tablet Portrait and
   Mobile Portrait retain the exact approved composition. Only its contents
   change from abstract SVG to a score card. */
body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-test-score {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.gcahs-test-header-active.single-post .gcahs-test-score__card {
    position: relative;
    width: 205px;
    min-height: 205px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 23px 18px 20px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 28px;
    color: #fff;
    background:
        radial-gradient(circle at 50% 22%, rgba(var(--gcahs-accent-rgb),.22), transparent 46%),
        rgba(10,13,19,.72);
    box-shadow:
        0 26px 52px rgba(0,0,0,.34),
        inset 0 0 0 1px rgba(var(--gcahs-accent-rgb),.12);
    -webkit-backdrop-filter: blur(12px) saturate(112%);
    backdrop-filter: blur(12px) saturate(112%);
}

body.gcahs-test-header-active.single-post .gcahs-test-score__card::before {
    content: "";
    position: absolute;
    inset: 10px;
    border: 1px solid rgba(var(--gcahs-accent-rgb),.30);
    border-radius: 21px;
    pointer-events: none;
}

body.gcahs-test-header-active.single-post .gcahs-test-score__label {
    position: relative;
    z-index: 1;
    margin-bottom: 6px;
    color: rgba(255,255,255,.76);
    font-size: 10px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .15em;
}

body.gcahs-test-header-active.single-post .gcahs-test-score__value {
    position: relative;
    z-index: 1;
    display: block;
    margin: 0;
    color: #fff;
    font-size: 68px;
    line-height: .96;
    font-weight: 820;
    letter-spacing: -.055em;
    text-shadow: 0 10px 28px rgba(0,0,0,.30);
}

body.gcahs-test-header-active.single-post .gcahs-test-score__percent {
    display: inline-block;
    margin-left: 4px;
    color: var(--gcahs-accent);
    font-size: .42em;
    line-height: 1;
    font-weight: 850;
    vertical-align: .76em;
    letter-spacing: -.02em;
}

body.gcahs-test-header-active.single-post .gcahs-test-score__caption {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    color: var(--gcahs-accent);
    font-size: 9.5px;
    line-height: 1.15;
    font-weight: 820;
    letter-spacing: .12em;
    text-align: center;
}

body.gcahs-test-header-active.single-post .gcahs-test-score__value--fallback {
    font-size: 40px;
    letter-spacing: .02em;
}

/* Reviews are intentionally a touch more editorial and substantial. */
body.gcahs-test-header-active.single-post.gcahs-theme-reviews .gcahs-test-score__card {
    border-radius: 30px;
}

/* gadgetCheck stays visually quicker/leaner while using the same master. */
body.gcahs-test-header-active.single-post.gcahs-theme-gadgetcheck .gcahs-test-score__card {
    width: 190px;
    min-height: 190px;
    border-radius: 24px;
}

@media (orientation: portrait) and (min-width: 700px) and (max-width: 1180px) {
    body.gcahs-test-header-active.single-post .gcahs-header--test {
        background-position: center, center, 64% center !important;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__card {
        width: 178px;
        min-height: 178px;
        padding: 20px 15px 17px;
        border-radius: 24px;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__value {
        font-size: 58px;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__label {
        font-size: 9px;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__caption {
        font-size: 8.5px;
    }
}

@media (orientation: portrait) and (max-width: 699px) {
    body.gcahs-test-header-active.single-post .gcahs-header--test {
        background-image:
            linear-gradient(90deg, rgba(12,15,21,.96) 0%, rgba(12,15,21,.88) 48%, rgba(12,15,21,.62) 100%),
            linear-gradient(0deg, rgba(8,11,16,.30), rgba(8,11,16,.12)),
            var(--gcahs-hero-image, none) !important;
        background-position: center, center, 62% center !important;
    }

    /* The score replaces the abstract top-right signet without changing the
       mobile 2x2 metadata or headline geometry. */
    body.gcahs-test-header-active.single-post .gcahs-header--test .gcahs-test-score {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__card,
    body.gcahs-test-header-active.single-post.gcahs-theme-gadgetcheck .gcahs-test-score__card {
        width: 82px;
        min-height: 70px;
        height: 70px;
        padding: 8px 5px 6px;
        border-radius: 13px;
        box-shadow: 0 12px 24px rgba(0,0,0,.25);
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__card::before {
        inset: 5px;
        border-radius: 9px;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__label {
        margin-bottom: 2px;
        font-size: 5.9px;
        letter-spacing: .10em;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__value {
        font-size: 29px;
        line-height: .92;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__percent {
        margin-left: 2px;
        font-size: .38em;
        vertical-align: .80em;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__caption {
        max-width: 70px;
        margin-top: 4px;
        font-size: 5.7px;
        letter-spacing: .07em;
        white-space: nowrap;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__value--fallback {
        font-size: 20px;
    }
}

@media (orientation: portrait) and (max-width: 380px) {
    body.gcahs-test-header-active.single-post .gcahs-test-score__card,
    body.gcahs-test-header-active.single-post.gcahs-theme-gadgetcheck .gcahs-test-score__card {
        width: 73px;
        min-height: 62px;
        height: 62px;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__value {
        font-size: 25px;
    }

    body.gcahs-test-header-active.single-post .gcahs-test-score__caption {
        max-width: 63px;
        font-size: 5.1px;
    }
}
