/* ============================================================================
   Healthy Habits — tokens + self-hosted faces
   (hhc-theme 1.0.x, Stitch direction "B · The Check-up", picked 2026-10-27)
   Loaded first; main.css reads the --color-* / --font-size-* bridge below,
   hhc.css reads the --hh-* tokens.
   ========================================================================= */

/* --- Faces: Vollkorn 600–700 (variable) + 400 italic for headlines, numerals
       and the tagline; Fira Sans 400 / 400 italic / 600 for reading text and
       UI. latin + latin-ext, Google Fonts css2 (Chrome UA), 2026-10-27. ---- */
@font-face {
    font-family: 'Vollkorn';
    font-style: normal;
    font-weight: 600 700;
    font-display: swap;
    src: url('../fonts/vollkorn-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Vollkorn';
    font-style: normal;
    font-weight: 600 700;
    font-display: swap;
    src: url('../fonts/vollkorn-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Vollkorn';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/vollkorn-italic-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Vollkorn';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/vollkorn-italic-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Fira Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/fira-sans-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Fira Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/fira-sans-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Fira Sans';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/fira-sans-italic-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Fira Sans';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/fira-sans-italic-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Fira Sans';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/fira-sans-600-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Fira Sans';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/fira-sans-600-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    color-scheme: light;
    /* --- Palette (B · The Check-up): warm paper, ONE deep coral ink for
       everything interactive (the logo's #F96A5F is 2.75:1 on paper, so it
       stays in the logo mark only), the logo's pale blue for the newsletter
       panels, a blush contents panel. Footer on paper under a double rule.
       WCAG: #A83226 on #FFF8F4 6.35 · on #FBEFE6 5.90 · on #E8F1F8 5.83 ·
       #FFFFFF on #A83226 6.67 · #6B5B55 on #FFF8F4 6.14 · on #FBEFE6 5.72 ·
       #231A17 on #FFF8F4 16.2 */
    --hh-ground:      #FFF8F4;   /* page: warm paper */
    --hh-tint:        #FBEFE6;   /* blush: contents panel, cover text panel */
    --hh-tint-soft:   #FDF4EE;
    --hh-tint-deep:   #EFD3C3;
    --hh-tint-rule:   #EBD5C8;
    --hh-plum-tint:   #F8E6E2;   /* the current topic, hover wash */
    --hh-blue:        #E8F1F8;   /* the logo's pale blue: newsletter panels */
    --hh-blue-rule:   #C9DFF0;
    --hh-card:        #FFFFFF;
    --hh-rule:        #E8DAD2;   /* hairlines */
    --hh-ink:         #231A17;   /* headlines + text */
    --hh-text:        #2E2420;
    --hh-meta:        #6B5B55;
    --hh-brand:       #A83226;   /* deep coral: links, buttons, numerals */
    --hh-brand-dark:  #8E2A20;
    --hh-stripe:      #F96A5F;   /* the logo coral, decorative only (rules, dots) */
    --hh-footer:      #FFF8F4;   /* footer on paper */
    --hh-footer-text: #231A17;
    --hh-footer-meta: #6B5B55;

    /* --- Type ---------------------------------------------------------------- */
    --hh-display: Vollkorn, Georgia, 'Times New Roman', serif;
    --hh-body:    'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --hh-ui:      'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --hh-stretch: 100%;          /* no width axis on these faces */
    --hh-size-body: clamp(1.0625rem, 1.01rem + 0.3vw, 1.1875rem);   /* 17–19px */
    --hh-lh-body:   1.65;
    --hh-lh-head:   1.1;
    --hh-title: clamp(2.125rem, 1.55rem + 2vw, 2.875rem);   /* article H1, capped 46px */
    --hh-h2:    clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem);
    --hh-h3:    clamp(1.1875rem, 1.1rem + 0.35vw, 1.375rem);
    --hh-label: 0.75rem;

    /* --- Shape & metrics ------------------------------------------------------ */
    --hh-radius:    4px;
    --hh-page-max:  1280px;
    --hh-sidebar:   304px;
    --hh-gutter:    clamp(1rem, 3vw, 2rem);

    /* --- Bridge to main.css (do not restyle main.css) ------------------------- */
    --font-size-body-min: 1.0625rem;
    --font-size-body-max: 1.1875rem;
    --font-size-body-fluid: calc(1.01rem + 0.3vw);
    --font-size-h1-min: 2.125rem;
    --font-size-h1-max: 3rem;
    --font-size-h1-fluid: calc(1.5rem + 2.2vw);
    --font-size-h2-min: 1.5rem;
    --font-size-h2-max: 1.875rem;
    --font-size-h2-fluid: calc(1.3rem + 0.8vw);
    --font-size-h3-min: 1.1875rem;
    --font-size-h3-max: 1.375rem;
    --font-size-h3-fluid: calc(1.1rem + 0.35vw);
    --font-size-h4-min: 1.0625rem;
    --font-size-h4-max: 1.1875rem;
    --font-size-h4-fluid: calc(1.02rem + 0.2vw);
    --font-size-h5-min: 1rem;
    --font-size-h5-max: 1.0625rem;
    --font-size-h5-fluid: calc(0.98rem + 0.15vw);
    --font-size-h6-min: 1rem;
    --font-size-h6-max: 1rem;
    --font-size-h6-fluid: 1rem;
    --line-height-body: 1.65;
    --line-height-heading: 1.1;
    --color-primary: #A83226;
    --color-primary-hover: #8E2A20;
    --color-heading: #231A17;
    --color-accent: #A83226;
    --color-text-dark: #231A17;
    --color-text-medium: #6B5B55;
    --color-text-light: #6B5B55;
    --color-background: #FFF8F4;
    --color-background-light: #FFFFFF;
    --color-background-tint: #FBEFE6;
    --color-border: #E8DAD2;
    --color-border-soft: #E8DAD2;
    --color-footer-bg: #FFF8F4;
    --color-error: #B42318;
    --color-warning: #8A5A00;
    --font-family-display: Vollkorn, Georgia, 'Times New Roman', serif;
    --font-family-body: 'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --font-family: 'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --radius-sm: 4px;
    --radius-md: 4px;
    --radius-lg: 4px;
    --border-radius: 4px;
    --border-radius-lg: 4px;
    --content-max: 780px;
    --page-max: 1280px;
    --color-border-light: #E8DAD2;
    --color-footer-border: #EBD5C8;
    --color-footer-text: #231A17;
    --color-copyright: #6B5B55;
    --color-facebook: #A83226; --color-facebook-hover: #8E2A20;
    --color-twitter: #A83226; --color-twitter-hover: #8E2A20;
    --color-pinterest: #A83226; --color-pinterest-hover: #8E2A20;
    --color-linkedin: #A83226; --color-linkedin-hover: #8E2A20;
    --color-error-bg: #F9E3E0; --color-error-text: #8A1C12;
    --color-warning-bg: #F6EBD2; --color-warning-text: #6B4600;
    --font-primary: 'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --font-heading: Vollkorn, Georgia, 'Times New Roman', serif;
}