/*
 * base.css — CSS Custom Properties + Base Resets
 * CRCKC Child Theme
 * Covers: :root variables, html/body defaults, WP block transparency overrides
 */

/* ============================================================
   CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
  --crckc-bg:           #f7f4ee;
  --crckc-text:         #2d2a24;
  --crckc-text-muted:   #6f685d;
  --crckc-border:       rgba(62, 52, 40, 0.10);
  --crckc-accent:       #1f6b5c;
  --crckc-accent-dark:  #164d43;
  --crckc-accent-soft:  rgba(220, 235, 230, 0.72);
  --crckc-highlight:    rgba(236, 245, 241, 0.78);
  --crckc-surface-soft: rgba(244, 239, 231, 0.72);
  --crckc-radius:       18px;
  --crckc-shadow:       0 10px 30px rgba(40, 34, 28, 0.05);
  --crckc-shadow-hover: 0 16px 42px rgba(40, 34, 28, 0.09);
  --crckc-content:      920px;
  --crckc-wide:         1400px;
  --crckc-section-pad:  clamp(2.5rem, 5vw, 4.5rem);
  --crckc-mobile-gutter: 4px;
}

/* ============================================================
   BASE RESETS
   ============================================================ */
html {
  background-color: var(--crckc-bg);
}

body,
.editor-styles-wrapper {
  font-family: "Noto Sans TC", "Noto Sans", sans-serif;
  color: var(--crckc-text);
  line-height: 1.8;
  letter-spacing: 0.01em;
  background-color: transparent;
}

body { position: relative; }
body > * { position: relative; z-index: 3; }

/* Make all major WP block wrappers transparent so the animated
   background shows through every section */
.wp-site-blocks,
.editor-styles-wrapper,
main,
.wp-block-cover,
.wp-block-template-part,
.wp-block-post-content { background: transparent !important; }