/* =====================================================================
   Ellen Doula Care: tokens.css  (source of truth: Brand Guide V6, 2026-10-05)
   Maps 1:1 to Wix Studio  Site Styles  (Colors, Text themes, spacing).
   Page refs: V6 p11 colours · p12 proportions/roles · p13 contrast · p14 EN type
              p15 type scale · p16 grid & spacing · p17 fields & dividers · p19 icons & motion
   ===================================================================== */

/* ---------- Self-hosted fonts (offline, SIL OFL) ---------- */
@font-face { font-family: "Newsreader"; src: url("../assets/fonts/newsreader-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("../assets/fonts/newsreader-italic-400-latin.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("../assets/fonts/manrope-latin.woff2") format("woff2"); font-weight: 400 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Noto Serif TC EDC"; src: url("../assets/fonts/noto-serif-tc-400-subset.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Noto Sans TC EDC"; src: url("../assets/fonts/noto-sans-tc-400-subset.woff2") format("woff2"); font-weight: 400 500; font-display: swap; }
@font-face { font-family: "Noto Sans TC EDC"; src: url("../assets/fonts/noto-sans-tc-600-subset.woff2") format("woff2"); font-weight: 600 700; font-display: swap; }
@font-face { font-family: "Noto Serif SC EDC"; src: url("../assets/fonts/noto-serif-sc-400-subset.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Noto Sans SC EDC"; src: url("../assets/fonts/noto-sans-sc-400-subset.woff2") format("woff2"); font-weight: 400 500; font-display: swap; }
@font-face { font-family: "Noto Sans SC EDC"; src: url("../assets/fonts/noto-sans-sc-600-subset.woff2") format("woff2"); font-weight: 600 700; font-display: swap; }

:root {
  /* ---------- The five brand colours (V6 p11) — Site Styles > Colors ---------- */
  --edc-ivory: #FBF8F4;   /* 01 頁面底色 page ground ............ ~50% */
  --edc-linen: #F4EFE8;   /* 02 柔和分區 soft zones ............. ~27% */
  --edc-blush: #E7C6BE;
  --edc-blush-deep: #B87F74; /* readable Blush for small decorative marks */   /* 04 溫暖分區 warm emphasis zones .... ~12% */
  --edc-dusk:  #6E7C96;
  --edc-dusk-deep: #55637A; /* body-size Dusk (AA on Ivory) */   /* 05 結構與大字強調 wordmark, rules, large graphics, large type ~7% */
  --edc-ink:   #3A332F;   /* 03 正文與資訊 text, nav, links, primary button ~4% */

  /* ---------- Derived tones: mixes of the five, never new hues ----------
     V6 p12 says layouts use only the five colours. York asked for tonal variety,
     so these are mixes of brand colours (flagged in README). Remove = set to a base colour. */
  --edc-blush-soft: #F2E2DC;   /* Blush 45% on Ivory: tag ground, hover wash */
  --edc-dusk-soft:  #DFDFE1;   /* Dusk 20% on Ivory: tag ground for Education */
  --edc-line:       #DCD7D0;   /* Ink 13% on Linen: 1px dividers & card borders */
  --edc-line-strong:#D1CDC9;   /* Ink 22% on Ivory: hover borders */
  --edc-muted:      #645E5A;   /* Ink 78% on Ivory: meta text, 6.0:1 on Ivory / 5.6:1 on Linen */
  --edc-on-ink-muted: #CBC7C3; /* Ivory 75% on Ink: secondary text on Ink, 7.4:1 */
  --edc-on-ink-line:  #5D5652; /* Ivory 18% on Ink: rules on Ink */

  /* ---------- Type families (V6 p14-15) — Site Styles > Fonts ---------- */
  --edc-font-serif: "Newsreader", "Noto Serif TC EDC", "Noto Serif TC", "Songti TC", Georgia, serif;
  --edc-font-sans:  "Manrope", "Noto Sans TC EDC", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, -apple-system, "Segoe UI", sans-serif;
  /* Chinese stacks are Latin-first: the Latin subsets contain no CJK, so Latin words / digits inside Chinese text use
     Newsreader / Manrope and every CJK glyph falls through to Noto Serif TC / Noto Sans TC (V6 p15: 中英文按視覺高度配對). */
  --edc-font-serif-zh: "Newsreader", "Noto Serif TC EDC", "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  --edc-font-sans-zh:  "Manrope", "Noto Sans TC EDC", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --edc-font-serif-sc: "Newsreader", "Noto Serif SC EDC", "Noto Serif SC", "Songti SC", "SimSun", serif;
  --edc-font-sans-sc:  "Manrope", "Noto Sans SC EDC", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --edc-w-regular: 400;   /* Newsreader 400 · Manrope 400 · Noto 400 */
  --edc-w-semi: 600;      /* Manrope 600 · Noto Sans 600 (nav, buttons, subheads). No synthetic bold. */

  /* ---------- Type scale (V6 p15, desktop / mobile, CSS px) — Site Styles > Text themes ---------- */
  --edc-fs-h1: 64px;   --edc-lh-h1: 1.15;    /* 主標題  Newsreader 400 / Noto Serif 400 */
  --edc-fs-h2: 40px;   --edc-lh-h2: 1.25;    /* 分區標題 Newsreader 400 / Noto Serif 400 */
  --edc-fs-h3: 24px;   --edc-lh-h3: 1.35;    /* 小標題  Manrope 600 / Noto Sans 600 */
  --edc-fs-body: 18px; --edc-lh-body: 1.65;  --edc-lh-body-zh: 1.75;  /* 正文 Manrope 400 / Noto Sans 400 */
  --edc-fs-btn: 16px;  --edc-lh-btn: 1.5;    /* 按鈕 Manrope 600 / Noto Sans 600 */
  --edc-fs-cap: 14px;  --edc-lh-cap: 1.5;    /* 說明 Manrope 400 / Noto Sans 400 */
  --edc-track-label: .1em;                   /* EN labels may add .08–.12em (p15); Chinese never tracked */

  /* ---------- Grid & spacing (V6 p16) ---------- */
  --edc-s-1: 8px; --edc-s-2: 16px; --edc-s-3: 24px; --edc-s-4: 32px; --edc-s-5: 48px; --edc-s-6: 64px;
  --edc-s-7: 96px; --edc-s-8: 128px;         /* section rhythm (multiples of 8/32) */
  --edc-section-y: 112px;
  --edc-margin-x: max(20px, 6vw);            /* 網頁左右留白約 6%；手機至少 20 px */
  --edc-max: 1240px;
  --edc-gutter: 24px;                        /* 12 columns desktop / 4 columns mobile */

  /* ---------- Shape (V6 p7, p17, p20: simple rectangles) ---------- */
  --edc-r-xs: 2px;      /* tags */
  --edc-r-sm: 4px;      /* buttons, inputs, cards */
  --edc-r-round: 999px; /* avatar circle only (p9 03 / AVATAR) */
  --edc-border: 1px solid var(--edc-line);   /* screen dividers are 1px (p17) */
  --edc-offset: 16px;   /* Blush/Dusk photo-edge offset block (p20-21) */

  /* ---------- Motion (V6 p19: 160–240ms light fade; no bounce, no auto-carousel, no breathing loops) ---------- */
  --edc-dur-fast: 160ms;
  --edc-dur: 200ms;
  --edc-dur-slow: 240ms;
  --edc-ease: cubic-bezier(.25, .1, .25, 1);
  --edc-reveal-y: 12px;

  /* ---------- Header ---------- */
  --edc-header-h: 84px;
  --edc-header-h-condensed: 64px;
}
@media (max-width: 750px) {
  :root {
    --edc-fs-h1: 40px; --edc-fs-h2: 30px; --edc-fs-h3: 22px;   /* mobile column of V6 p15 */
    --edc-section-y: 72px;
    --edc-gutter: 16px;
    --edc-offset: 10px;
    --edc-header-h: 64px; --edc-header-h-condensed: 56px;
  }
}
@media (min-width: 751px) and (max-width: 1000px) {
  :root { --edc-fs-h1: 52px; --edc-fs-h2: 34px; --edc-section-y: 88px; }   /* tablet: interpolated */
}
