/*
Theme Name: CoinsCipher
Theme URI: https://coinscipher.com
Author: Marom Anaky (Cryptrom)
Author URI: https://tropicon.digital
Description: Custom editorial theme for CoinsCipher, a crypto tax and market analysis publication. Replaces Elementor with a fast, semantic, GEO-optimized foundation.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: coinscipher
*/

/* =====================================================================
   This file holds only the design tokens and a tiny base layer.
   Component CSS lives in /assets/css/ and is enqueued from inc/enqueue.php.
   ===================================================================== */

:root {

    /* ---- Color: Warm Editorial -------------------------------------- */
    --cc-bg:            #FBF8F2;   /* page background, warm off-white */
    --cc-surface:       #FFFFFF;   /* cards, inputs, raised surfaces */
    --cc-surface-alt:   #F5F0E5;   /* subtle inset background */
    --cc-text:          #1A1815;   /* primary text */
    --cc-text-muted:    #6B6760;   /* secondary text, metadata */
    --cc-text-faint:    #9A968D;   /* timestamps, hints */
    --cc-accent:        #C97B0F;   /* gold — links, CTAs */
    --cc-accent-hover:  #A36309;   /* gold on hover */
    --cc-border:        #E8E2D5;   /* default border */
    --cc-border-strong: #D6CDB8;   /* emphasized border */

    /* Semantic — market data */
    --cc-up:    #1F7A3D;   /* positive price moves */
    --cc-down:  #B22020;   /* negative price moves */

    /* ---- Type ------------------------------------------------------- */
    --cc-font-display: "Newsreader", Georgia, "Times New Roman", serif;
    --cc-font-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --cc-font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

    /* ---- Scale ------------------------------------------------------ */
    --cc-text-xs:   13px;
    --cc-text-sm:   15px;
    --cc-text-base: 17px;   /* base reading size, optimized for long-form */
    --cc-text-lg:   19px;
    --cc-h6:        16px;
    --cc-h5:        18px;
    --cc-h4:        22px;
    --cc-h3:        26px;
    --cc-h2:        32px;
    --cc-h1:        44px;

    --cc-lh-tight: 1.2;
    --cc-lh-snug:  1.4;
    --cc-lh-body:  1.7;

    /* ---- Layout ----------------------------------------------------- */
    --cc-radius-sm: 4px;
    --cc-radius-md: 8px;
    --cc-radius-lg: 12px;

    --cc-container: 1180px;
    --cc-prose:     680px;

    --cc-space-1:  4px;
    --cc-space-2:  8px;
    --cc-space-3:  12px;
    --cc-space-4:  16px;
    --cc-space-5:  24px;
    --cc-space-6:  32px;
    --cc-space-7:  48px;
    --cc-space-8:  64px;
    --cc-space-9:  96px;
}

/* Base reset / global rules everything else depends on. */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    background: var(--cc-bg);
    color: var(--cc-text);
    font-family: var(--cc-font-body);
    font-size: var(--cc-text-base);
    line-height: var(--cc-lh-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4 {
    font-family: var(--cc-font-display);
    font-weight: 500;
    line-height: var(--cc-lh-tight);
    margin: 0 0 var(--cc-space-4);
    color: var(--cc-text);
    letter-spacing: -0.01em;
}
h5, h6 {
    font-family: var(--cc-font-body);
    font-weight: 600;
    line-height: var(--cc-lh-snug);
    margin: 0 0 var(--cc-space-3);
}

p { margin: 0 0 var(--cc-space-4); }

a {
    color: var(--cc-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}
a:hover { color: var(--cc-accent-hover); }

img, svg, video { max-width: 100%; height: auto; display: block; }

code, kbd, pre, samp { font-family: var(--cc-font-mono); }

/* Skip link for accessibility — visible only on focus. */
.cc-skip {
    position: absolute;
    left: -9999px;
    top: var(--cc-space-3);
    background: var(--cc-text);
    color: var(--cc-bg);
    padding: var(--cc-space-2) var(--cc-space-4);
    border-radius: var(--cc-radius-md);
    z-index: 9999;
}
.cc-skip:focus { left: var(--cc-space-3); }
