/* ==========================================================
   ClearSkin4u — Design tokens
   Source values from working Profhilo page CSS (unchanged).
   Load first. See LOAD_ORDER.md.
========================================================== */

:root {
    /* Brand */
    --cs-green: #29423b;
    --cs-green-dark: #1d302b;
    --cs-gold: #9d7848;

    /* Neutrals / surfaces */
    --cs-cream: #f5f1eb;
    --cs-cream-dark: #e9e1d7;
    --cs-white: #ffffff;
    --cs-text: #292b29;
    --cs-muted: #625e58;
    --cs-note: #746e67;
    --cs-body-muted: #4f4d49;
    --cs-caption: #454743;
    --cs-disclaimer: #756e67;
    --cs-image-border: #c9beb2;

    /* Borders & shadows */
    --cs-border: rgba(41, 66, 59, .17);
    --cs-shadow: 0 18px 45px rgba(34, 49, 44, .09);

    /* Typography */
    --cs-font-sans: Inter, Arial, sans-serif;
    --cs-font-serif: "Cormorant Garamond", Georgia, serif;
    --cs-font-size-base: 16px;
    --cs-line-height-base: 1.6;

    /* Content widths */
    --cs-wrap-max: 1160px;
    --cs-wrap-gutter-mobile: 36px;
    --cs-wrap-gutter-tablet: 60px;
    --cs-heading-max: 740px;
    --cs-quiz-max: 760px;
    --cs-pricing-max: 960px;
    --cs-faqs-max: 820px;

    /* Spacing (from existing page rhythm) */
    --cs-section-pad-mobile: 58px;
    --cs-section-pad-desktop: 84px;
    --cs-scroll-margin: 16px;
}