/*
Theme Name: Coin303 Test
Description: Konversi langsung halaman HTML COIN303 ke tema WordPress. Hanya warna latar yang diubah ke merah marun.
Version: 2.0.0
Text Domain: coin303-test
*/

/* Warna merah marun (override CSS asli) */
body { background: #5e0000 !important; }
.header-top { background: #730000 !important; }
.site-header, .site-header .logo { background: #730000 !important; }
.seo-content, footer { background: transparent !important; }
.bgsprt { background: rgba(8, 8, 8, .68) !important; }

/* Sprite icon menu (file di server bernama cola-3.webp) */
.sprite-menu { background-image: url(https://coin303.com.im/wp-content/themes/CR/images/cola-3.webp) !important; }

/* ===== Halaman artikel (page.php / single.php) ===== */
.cr-wrap { padding: 25px 15px 40px; }
.cr-article {
    background: linear-gradient(180deg, rgba(20,0,0,.92), rgba(0,0,0,.92));
    border: 2px solid #fac810; border-radius: 18px; padding: 30px 35px;
    box-shadow: 0 0 6px #fac810, 0 0 22px rgba(250,200,16,.45), inset 0 0 18px rgba(250,200,16,.12);
}
.cr-title {
    text-align: center; text-transform: uppercase; font-size: 1.9rem; font-weight: 800; line-height: 1.25;
    margin: 0 0 6px; padding-bottom: 14px; border-bottom: 2px dashed rgba(250,200,16,.35);
    background: linear-gradient(180deg, #fff4a8, #fac810 50%, #c8961c); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.cr-meta { text-align: center; color: #bfa77a; font-size: 13px; margin: 8px 0 0; }
.cr-meta a { color: #fac810 !important; }
.cr-thumb { margin: 22px auto 26px; max-width: 720px; }
.cr-thumb img { display: block; width: 100%; height: auto; border-radius: 12px; border: 3px solid #730000; box-shadow: 0 6px 24px rgba(0,0,0,.6); }
.cr-body { color: #e8dcc0; text-align: justify; font-size: 15px; line-height: 1.75; }
.cr-body p { margin: 0 0 1rem; }
.cr-body strong, .cr-body b { color: #fff; }
.cr-body a { color: #fac810 !important; font-weight: 600; }
.cr-body h2 { color: #fac810; font-size: 1.5rem; margin: 2rem 0 .8rem; padding: 6px 0 6px 14px; border-left: 5px solid #e01010; background: linear-gradient(90deg, rgba(224,16,16,.18), transparent); text-align: left; }
.cr-body h3 { color: #ff5a4d; font-size: 1.25rem; margin: 1.5rem 0 .6rem; text-align: left; }
.cr-body h4 { color: #fac810; font-size: 1.1rem; margin: 1.2rem 0 .5rem; }
.cr-body ul, .cr-body ol { margin: 0 0 1rem 1.3rem; padding: 0; }
.cr-body ul { list-style: none; margin-left: 0; }
.cr-body ul li { position: relative; padding-left: 22px; margin-bottom: 6px; }
.cr-body ul li::before { content: "\25C6"; position: absolute; left: 0; top: 0; color: #fac810; font-size: 12px; }
.cr-body img { max-width: 100%; height: auto; border-radius: 10px; margin: 10px auto; display: block; }
@media (max-width: 767px) {
    .cr-wrap { padding: 50px 10px 70px; }
    .cr-article { padding: 20px 16px; border-radius: 14px; }
    .cr-title { font-size: 1.35rem; }
    .cr-body h2 { font-size: 1.25rem; }
    .cr-body h3 { font-size: 1.1rem; }
        }