/* ==========================================================================
   Mari Calegari Psi — Design tokens (Material Design 3 / Material You)
   --------------------------------------------------------------------------
   Seed color: #825E4A (marrom/terracota da marca atual)
   Seed HCT:   hue 48.4 · chroma 19.0 · tone 43.1
   Scheme:     SchemeTonalSpot (padrão Material You), contrast level 0
   Generated with @material/material-color-utilities 0.4.0 (MaterialDynamicColors).

   Este arquivo é a ÚNICA fonte de cor, tipografia, forma, elevação, espaço
   e movimento do site. Para trocar o tema (ou plugar um design system),
   substitua os valores aqui; os componentes em site.css só leem var(--…).

   Temas:
     - padrão: claro
     - escuro: automático via prefers-color-scheme, a menos que
       <html data-theme="light">; forçado com <html data-theme="dark">.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Reference palettes (tons fixos; não usar direto nos componentes)
   -------------------------------------------------------------------------- */
:root {
  --md-source-color: #825E4A;
  /* primary: hue 48.4, chroma 36.0 */
  --md-ref-palette-primary0: #000000;
  --md-ref-palette-primary4: #1e0800;
  --md-ref-palette-primary6: #260c00;
  --md-ref-palette-primary10: #331200;
  --md-ref-palette-primary12: #391500;
  --md-ref-palette-primary17: #491d00;
  --md-ref-palette-primary20: #532200;
  --md-ref-palette-primary22: #592603;
  --md-ref-palette-primary24: #5e2b06;
  --md-ref-palette-primary30: #6f3813;
  --md-ref-palette-primary40: #8c4e28;
  --md-ref-palette-primary50: #aa663e;
  --md-ref-palette-primary60: #c87f55;
  --md-ref-palette-primary70: #e6996c;
  --md-ref-palette-primary80: #ffb68d;
  --md-ref-palette-primary87: #ffd0b8;
  --md-ref-palette-primary90: #ffdbc9;
  --md-ref-palette-primary92: #ffe2d5;
  --md-ref-palette-primary94: #ffeae0;
  --md-ref-palette-primary95: #ffede5;
  --md-ref-palette-primary96: #fff1eb;
  --md-ref-palette-primary98: #fff8f6;
  --md-ref-palette-primary99: #fffbff;
  --md-ref-palette-primary100: #ffffff;
  /* secondary: hue 48.4, chroma 16.0 */
  --md-ref-palette-secondary0: #000000;
  --md-ref-palette-secondary4: #1b0902;
  --md-ref-palette-secondary6: #220e04;
  --md-ref-palette-secondary10: #2b160a;
  --md-ref-palette-secondary12: #301a0d;
  --md-ref-palette-secondary17: #3c2417;
  --md-ref-palette-secondary20: #432b1d;
  --md-ref-palette-secondary22: #482f21;
  --md-ref-palette-secondary24: #4d3325;
  --md-ref-palette-secondary30: #5c4131;
  --md-ref-palette-secondary40: #765847;
  --md-ref-palette-secondary50: #91705f;
  --md-ref-palette-secondary60: #ac8977;
  --md-ref-palette-secondary70: #c8a490;
  --md-ref-palette-secondary80: #e5beaa;
  --md-ref-palette-secondary87: #fad2bd;
  --md-ref-palette-secondary90: #ffdbc9;
  --md-ref-palette-secondary92: #ffe2d5;
  --md-ref-palette-secondary94: #ffeae0;
  --md-ref-palette-secondary95: #ffede5;
  --md-ref-palette-secondary96: #fff1eb;
  --md-ref-palette-secondary98: #fff8f6;
  --md-ref-palette-secondary99: #fffbff;
  --md-ref-palette-secondary100: #ffffff;
  /* tertiary: hue 108.4, chroma 24.0 */
  --md-ref-palette-tertiary0: #000000;
  --md-ref-palette-tertiary4: #100f00;
  --md-ref-palette-tertiary6: #151400;
  --md-ref-palette-tertiary10: #1e1c00;
  --md-ref-palette-tertiary12: #222100;
  --md-ref-palette-tertiary17: #2d2b03;
  --md-ref-palette-tertiary20: #343208;
  --md-ref-palette-tertiary22: #38360c;
  --md-ref-palette-tertiary24: #3d3b11;
  --md-ref-palette-tertiary30: #4a481d;
  --md-ref-palette-tertiary40: #636032;
  --md-ref-palette-tertiary50: #7c7949;
  --md-ref-palette-tertiary60: #969360;
  --md-ref-palette-tertiary70: #b1ad78;
  --md-ref-palette-tertiary80: #cdc991;
  --md-ref-palette-tertiary87: #e1dca3;
  --md-ref-palette-tertiary90: #e9e5ab;
  --md-ref-palette-tertiary92: #efebb0;
  --md-ref-palette-tertiary94: #f5f0b6;
  --md-ref-palette-tertiary95: #f8f3b8;
  --md-ref-palette-tertiary96: #fbf6bb;
  --md-ref-palette-tertiary98: #fffad9;
  --md-ref-palette-tertiary99: #fffdec;
  --md-ref-palette-tertiary100: #ffffff;
  /* neutral: hue 48.4, chroma 6.0 */
  --md-ref-palette-neutral0: #000000;
  --md-ref-palette-neutral4: #140d08;
  --md-ref-palette-neutral6: #1a120d;
  --md-ref-palette-neutral10: #221a15;
  --md-ref-palette-neutral12: #271e19;
  --md-ref-palette-neutral17: #312823;
  --md-ref-palette-neutral20: #382e29;
  --md-ref-palette-neutral22: #3d332e;
  --md-ref-palette-neutral24: #413732;
  --md-ref-palette-neutral30: #50443f;
  --md-ref-palette-neutral40: #685c56;
  --md-ref-palette-neutral50: #82746e;
  --md-ref-palette-neutral60: #9c8e87;
  --md-ref-palette-neutral70: #b7a8a1;
  --md-ref-palette-neutral80: #d3c3bc;
  --md-ref-palette-neutral87: #e8d7cf;
  --md-ref-palette-neutral90: #f0dfd7;
  --md-ref-palette-neutral92: #f6e5dd;
  --md-ref-palette-neutral94: #fceae3;
  --md-ref-palette-neutral95: #ffede5;
  --md-ref-palette-neutral96: #fff1eb;
  --md-ref-palette-neutral98: #fff8f6;
  --md-ref-palette-neutral99: #fffbff;
  --md-ref-palette-neutral100: #ffffff;
  /* neutral-variant: hue 48.4, chroma 8.0 */
  --md-ref-palette-neutral-variant0: #000000;
  --md-ref-palette-neutral-variant4: #160c07;
  --md-ref-palette-neutral-variant6: #1b110b;
  --md-ref-palette-neutral-variant10: #241913;
  --md-ref-palette-neutral-variant12: #291d17;
  --md-ref-palette-neutral-variant17: #342721;
  --md-ref-palette-neutral-variant20: #3b2e27;
  --md-ref-palette-neutral-variant22: #3f322b;
  --md-ref-palette-neutral-variant24: #44362f;
  --md-ref-palette-neutral-variant30: #52443c;
  --md-ref-palette-neutral-variant40: #6b5b53;
  --md-ref-palette-neutral-variant50: #85746b;
  --md-ref-palette-neutral-variant60: #9f8d84;
  --md-ref-palette-neutral-variant70: #bba79e;
  --md-ref-palette-neutral-variant80: #d7c2b8;
  --md-ref-palette-neutral-variant87: #ebd6cc;
  --md-ref-palette-neutral-variant90: #f4ded4;
  --md-ref-palette-neutral-variant92: #fae4d9;
  --md-ref-palette-neutral-variant94: #ffeae0;
  --md-ref-palette-neutral-variant95: #ffede5;
  --md-ref-palette-neutral-variant96: #fff1eb;
  --md-ref-palette-neutral-variant98: #fff8f6;
  --md-ref-palette-neutral-variant99: #fffbff;
  --md-ref-palette-neutral-variant100: #ffffff;
  /* error: hue 25.0, chroma 84.0 */
  --md-ref-palette-error0: #000000;
  --md-ref-palette-error4: #280001;
  --md-ref-palette-error6: #310001;
  --md-ref-palette-error10: #410002;
  --md-ref-palette-error12: #490002;
  --md-ref-palette-error17: #5c0004;
  --md-ref-palette-error20: #690005;
  --md-ref-palette-error22: #710005;
  --md-ref-palette-error24: #790006;
  --md-ref-palette-error30: #93000a;
  --md-ref-palette-error40: #ba1a1a;
  --md-ref-palette-error50: #de3730;
  --md-ref-palette-error60: #ff5449;
  --md-ref-palette-error70: #ff897d;
  --md-ref-palette-error80: #ffb4ab;
  --md-ref-palette-error87: #ffcfc9;
  --md-ref-palette-error90: #ffdad6;
  --md-ref-palette-error92: #ffe2de;
  --md-ref-palette-error94: #ffe9e6;
  --md-ref-palette-error95: #ffedea;
  --md-ref-palette-error96: #fff0ee;
  --md-ref-palette-error98: #fff8f7;
  --md-ref-palette-error99: #fffbff;
  --md-ref-palette-error100: #ffffff;
}

/* --------------------------------------------------------------------------
   2. System color roles — CLARO (padrão)
   -------------------------------------------------------------------------- */
:root {
  color-scheme: light;
  --md-sys-color-primary: #8c4e28;
  --md-sys-color-on-primary: #ffffff;
  --md-sys-color-primary-container: #ffdbc9;
  --md-sys-color-on-primary-container: #6f3813;
  --md-sys-color-secondary: #765847;
  --md-sys-color-on-secondary: #ffffff;
  --md-sys-color-secondary-container: #ffdbc9;
  --md-sys-color-on-secondary-container: #5c4131;
  --md-sys-color-tertiary: #636032;
  --md-sys-color-on-tertiary: #ffffff;
  --md-sys-color-tertiary-container: #e9e5ab;
  --md-sys-color-on-tertiary-container: #4a481d;
  --md-sys-color-error: #ba1a1a;
  --md-sys-color-on-error: #ffffff;
  --md-sys-color-error-container: #ffdad6;
  --md-sys-color-on-error-container: #93000a;
  --md-sys-color-background: #fff8f6;
  --md-sys-color-on-background: #221a15;
  --md-sys-color-surface: #fff8f6;
  --md-sys-color-surface-dim: #e8d7cf;
  --md-sys-color-surface-bright: #fff8f6;
  --md-sys-color-surface-container-lowest: #ffffff;
  --md-sys-color-surface-container-low: #fff1eb;
  --md-sys-color-surface-container: #fceae3;
  --md-sys-color-surface-container-high: #f6e5dd;
  --md-sys-color-surface-container-highest: #f0dfd7;
  --md-sys-color-on-surface: #221a15;
  --md-sys-color-surface-variant: #f4ded4;
  --md-sys-color-on-surface-variant: #52443c;
  --md-sys-color-outline: #85746b;
  --md-sys-color-outline-variant: #d7c2b8;
  --md-sys-color-inverse-surface: #382e29;
  --md-sys-color-inverse-on-surface: #ffede5;
  --md-sys-color-inverse-primary: #ffb68d;
  --md-sys-color-shadow: #000000;
  --md-sys-color-scrim: #000000;
  --md-sys-color-surface-tint: #8c4e28;
  --md-sys-color-primary-fixed: #ffdbc9;
  --md-sys-color-primary-fixed-dim: #ffb68d;
  --md-sys-color-on-primary-fixed: #331200;
  --md-sys-color-on-primary-fixed-variant: #6f3813;
  --md-sys-color-secondary-fixed: #ffdbc9;
  --md-sys-color-secondary-fixed-dim: #e5beaa;
  --md-sys-color-on-secondary-fixed: #2b160a;
  --md-sys-color-on-secondary-fixed-variant: #5c4131;
  --md-sys-color-tertiary-fixed: #e9e5ab;
  --md-sys-color-tertiary-fixed-dim: #cdc991;
  --md-sys-color-on-tertiary-fixed: #1e1c00;
  --md-sys-color-on-tertiary-fixed-variant: #4a481d;
}

/* --------------------------------------------------------------------------
   3. System color roles — ESCURO
   (duplicado: segue o sistema, ou forçado pelo seletor de tema)
   -------------------------------------------------------------------------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --md-sys-color-primary: #ffb68d;
    --md-sys-color-on-primary: #532200;
    --md-sys-color-primary-container: #6f3813;
    --md-sys-color-on-primary-container: #ffdbc9;
    --md-sys-color-secondary: #e5beaa;
    --md-sys-color-on-secondary: #432b1d;
    --md-sys-color-secondary-container: #5c4131;
    --md-sys-color-on-secondary-container: #ffdbc9;
    --md-sys-color-tertiary: #cdc991;
    --md-sys-color-on-tertiary: #343208;
    --md-sys-color-tertiary-container: #4a481d;
    --md-sys-color-on-tertiary-container: #e9e5ab;
    --md-sys-color-error: #ffb4ab;
    --md-sys-color-on-error: #690005;
    --md-sys-color-error-container: #93000a;
    --md-sys-color-on-error-container: #ffdad6;
    --md-sys-color-background: #1a120d;
    --md-sys-color-on-background: #f0dfd7;
    --md-sys-color-surface: #1a120d;
    --md-sys-color-surface-dim: #1a120d;
    --md-sys-color-surface-bright: #413732;
    --md-sys-color-surface-container-lowest: #140d08;
    --md-sys-color-surface-container-low: #221a15;
    --md-sys-color-surface-container: #271e19;
    --md-sys-color-surface-container-high: #312823;
    --md-sys-color-surface-container-highest: #3d332e;
    --md-sys-color-on-surface: #f0dfd7;
    --md-sys-color-surface-variant: #52443c;
    --md-sys-color-on-surface-variant: #d7c2b8;
    --md-sys-color-outline: #9f8d84;
    --md-sys-color-outline-variant: #52443c;
    --md-sys-color-inverse-surface: #f0dfd7;
    --md-sys-color-inverse-on-surface: #382e29;
    --md-sys-color-inverse-primary: #8c4e28;
    --md-sys-color-shadow: #000000;
    --md-sys-color-scrim: #000000;
    --md-sys-color-surface-tint: #ffb68d;
    --md-sys-color-primary-fixed: #ffdbc9;
    --md-sys-color-primary-fixed-dim: #ffb68d;
    --md-sys-color-on-primary-fixed: #331200;
    --md-sys-color-on-primary-fixed-variant: #6f3813;
    --md-sys-color-secondary-fixed: #ffdbc9;
    --md-sys-color-secondary-fixed-dim: #e5beaa;
    --md-sys-color-on-secondary-fixed: #2b160a;
    --md-sys-color-on-secondary-fixed-variant: #5c4131;
    --md-sys-color-tertiary-fixed: #e9e5ab;
    --md-sys-color-tertiary-fixed-dim: #cdc991;
    --md-sys-color-on-tertiary-fixed: #1e1c00;
    --md-sys-color-on-tertiary-fixed-variant: #4a481d;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --md-sys-color-primary: #ffb68d;
  --md-sys-color-on-primary: #532200;
  --md-sys-color-primary-container: #6f3813;
  --md-sys-color-on-primary-container: #ffdbc9;
  --md-sys-color-secondary: #e5beaa;
  --md-sys-color-on-secondary: #432b1d;
  --md-sys-color-secondary-container: #5c4131;
  --md-sys-color-on-secondary-container: #ffdbc9;
  --md-sys-color-tertiary: #cdc991;
  --md-sys-color-on-tertiary: #343208;
  --md-sys-color-tertiary-container: #4a481d;
  --md-sys-color-on-tertiary-container: #e9e5ab;
  --md-sys-color-error: #ffb4ab;
  --md-sys-color-on-error: #690005;
  --md-sys-color-error-container: #93000a;
  --md-sys-color-on-error-container: #ffdad6;
  --md-sys-color-background: #1a120d;
  --md-sys-color-on-background: #f0dfd7;
  --md-sys-color-surface: #1a120d;
  --md-sys-color-surface-dim: #1a120d;
  --md-sys-color-surface-bright: #413732;
  --md-sys-color-surface-container-lowest: #140d08;
  --md-sys-color-surface-container-low: #221a15;
  --md-sys-color-surface-container: #271e19;
  --md-sys-color-surface-container-high: #312823;
  --md-sys-color-surface-container-highest: #3d332e;
  --md-sys-color-on-surface: #f0dfd7;
  --md-sys-color-surface-variant: #52443c;
  --md-sys-color-on-surface-variant: #d7c2b8;
  --md-sys-color-outline: #9f8d84;
  --md-sys-color-outline-variant: #52443c;
  --md-sys-color-inverse-surface: #f0dfd7;
  --md-sys-color-inverse-on-surface: #382e29;
  --md-sys-color-inverse-primary: #8c4e28;
  --md-sys-color-shadow: #000000;
  --md-sys-color-scrim: #000000;
  --md-sys-color-surface-tint: #ffb68d;
  --md-sys-color-primary-fixed: #ffdbc9;
  --md-sys-color-primary-fixed-dim: #ffb68d;
  --md-sys-color-on-primary-fixed: #331200;
  --md-sys-color-on-primary-fixed-variant: #6f3813;
  --md-sys-color-secondary-fixed: #ffdbc9;
  --md-sys-color-secondary-fixed-dim: #e5beaa;
  --md-sys-color-on-secondary-fixed: #2b160a;
  --md-sys-color-on-secondary-fixed-variant: #5c4131;
  --md-sys-color-tertiary-fixed: #e9e5ab;
  --md-sys-color-tertiary-fixed-dim: #cdc991;
  --md-sys-color-on-tertiary-fixed: #1e1c00;
  --md-sys-color-on-tertiary-fixed-variant: #4a481d;
}

/* --------------------------------------------------------------------------
   4. Tipografia
   Marca: Merriweather (títulos, display, citações) + Inter (texto, rótulos).
   Escala M3 (display / headline / title / body / label). Display e headline
   são fluidos (clamp) para caber em 360 px sem quebrar palavras.
   -------------------------------------------------------------------------- */
:root {
  --md-ref-typeface-brand: "Merriweather", Georgia, "Times New Roman", serif;
  --md-ref-typeface-plain: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Display (Merriweather) */
  --md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-display-large-size: clamp(2.5rem, 1.55rem + 3.8vw, 3.5625rem);   /* 40 a 57 px */
  --md-sys-typescale-display-large-line-height: 1.12;
  --md-sys-typescale-display-large-weight: 700;
  --md-sys-typescale-display-large-tracking: -0.015em;

  --md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-display-medium-size: clamp(2.125rem, 1.5rem + 2.5vw, 2.8125rem); /* 34 a 45 px */
  --md-sys-typescale-display-medium-line-height: 1.16;
  --md-sys-typescale-display-medium-weight: 700;
  --md-sys-typescale-display-medium-tracking: -0.01em;

  --md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-display-small-size: clamp(1.875rem, 1.45rem + 1.7vw, 2.25rem);   /* 30 a 36 px */
  --md-sys-typescale-display-small-line-height: 1.22;
  --md-sys-typescale-display-small-weight: 700;
  --md-sys-typescale-display-small-tracking: -0.005em;

  /* Headline (Merriweather) */
  --md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-large-size: clamp(1.625rem, 1.3rem + 1.4vw, 2.125rem);  /* 26 a 34 px */
  --md-sys-typescale-headline-large-line-height: 1.25;
  --md-sys-typescale-headline-large-weight: 700;

  --md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-medium-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);  /* 22 a 28 px */
  --md-sys-typescale-headline-medium-line-height: 1.3;
  --md-sys-typescale-headline-medium-weight: 700;

  --md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-small-size: clamp(1.25rem, 1.15rem + 0.45vw, 1.5rem);   /* 20 a 24 px */
  --md-sys-typescale-headline-small-line-height: 1.4;
  --md-sys-typescale-headline-small-weight: 400;

  /* Title (Inter) */
  --md-sys-typescale-title-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-title-large-size: 1.375rem;   /* 22 px */
  --md-sys-typescale-title-large-line-height: 1.75rem;
  --md-sys-typescale-title-large-weight: 600;

  --md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-title-medium-size: 1.0625rem; /* 17 px */
  --md-sys-typescale-title-medium-line-height: 1.5rem;
  --md-sys-typescale-title-medium-weight: 600;

  --md-sys-typescale-title-small-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-title-small-size: 0.875rem;   /* 14 px */
  --md-sys-typescale-title-small-line-height: 1.25rem;
  --md-sys-typescale-title-small-weight: 600;

  /* Body (Inter), um pouco maior que o M3 base para leitura confortável */
  --md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-large-size: 1.125rem;    /* 18 px */
  --md-sys-typescale-body-large-line-height: 1.7;
  --md-sys-typescale-body-large-weight: 400;

  --md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-medium-size: 1rem;       /* 16 px */
  --md-sys-typescale-body-medium-line-height: 1.65;
  --md-sys-typescale-body-medium-weight: 400;

  --md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-small-size: 0.875rem;    /* 14 px */
  --md-sys-typescale-body-small-line-height: 1.55;
  --md-sys-typescale-body-small-weight: 400;

  /* Label (Inter) */
  --md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-large-size: 0.9375rem;  /* 15 px */
  --md-sys-typescale-label-large-line-height: 1.25rem;
  --md-sys-typescale-label-large-weight: 600;
  --md-sys-typescale-label-large-tracking: 0.006em;

  --md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-medium-size: 0.8125rem; /* 13 px */
  --md-sys-typescale-label-medium-line-height: 1rem;
  --md-sys-typescale-label-medium-weight: 600;
  --md-sys-typescale-label-medium-tracking: 0.03em;

  --md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-small-size: 0.75rem;    /* 12 px */
  --md-sys-typescale-label-small-line-height: 1rem;
  --md-sys-typescale-label-small-weight: 600;
  --md-sys-typescale-label-small-tracking: 0.04em;
}

/* --------------------------------------------------------------------------
   5. Forma (cantos): escala M3 + formas orgânicas da marca
   -------------------------------------------------------------------------- */
:root {
  --md-sys-shape-corner-none: 0;
  --md-sys-shape-corner-extra-small: 4px;
  --md-sys-shape-corner-small: 8px;
  --md-sys-shape-corner-medium: 12px;
  --md-sys-shape-corner-large: 16px;
  --md-sys-shape-corner-large-increased: 20px;
  --md-sys-shape-corner-extra-large: 28px;
  --md-sys-shape-corner-extra-large-increased: 32px;
  --md-sys-shape-corner-extra-extra-large: 48px;
  --md-sys-shape-corner-full: 9999px;

  /* Assinaturas orgânicas: "janela de sol" (arco) e "seixo" */
  --mc-shape-arch: 9999px 9999px var(--md-sys-shape-corner-extra-large) var(--md-sys-shape-corner-extra-large);
  --mc-shape-pebble: 62% 38% 54% 46% / 48% 56% 44% 52%;
  --mc-shape-leaf: var(--md-sys-shape-corner-extra-large) var(--md-sys-shape-corner-small);
}

/* --------------------------------------------------------------------------
   6. Elevação: sombras M3 (níveis 0 a 5) + sombra quente difusa
   -------------------------------------------------------------------------- */
:root {
  --mc-shadow-key: color-mix(in srgb, var(--md-sys-color-shadow) 22%, transparent);
  --mc-shadow-ambient: color-mix(in srgb, var(--md-sys-color-shadow) 11%, transparent);
  --md-sys-elevation-level0: none;
  --md-sys-elevation-level1: 0 1px 2px 0 var(--mc-shadow-key), 0 1px 3px 1px var(--mc-shadow-ambient);
  --md-sys-elevation-level2: 0 1px 2px 0 var(--mc-shadow-key), 0 2px 6px 2px var(--mc-shadow-ambient);
  --md-sys-elevation-level3: 0 1px 3px 0 var(--mc-shadow-key), 0 4px 8px 3px var(--mc-shadow-ambient);
  --md-sys-elevation-level4: 0 2px 3px 0 var(--mc-shadow-key), 0 6px 10px 4px var(--mc-shadow-ambient);
  --md-sys-elevation-level5: 0 4px 4px 0 var(--mc-shadow-key), 0 8px 12px 6px var(--mc-shadow-ambient);
  /* Sombra difusa tingida pelo primário (fotos, cartões em destaque) */
  --mc-shadow-sunlit: 0 28px 56px -28px color-mix(in srgb, var(--md-ref-palette-primary30) 55%, transparent);
}

/* --------------------------------------------------------------------------
   7. Estados (state layers M3) e foco
   -------------------------------------------------------------------------- */
:root {
  --md-sys-state-hover-state-layer-opacity: 0.08;
  --md-sys-state-focus-state-layer-opacity: 0.10;
  --md-sys-state-pressed-state-layer-opacity: 0.10;
  --md-sys-state-dragged-state-layer-opacity: 0.16;
  --mc-focus-ring-width: 3px;
  --mc-focus-ring-offset: 2px;
  --mc-focus-ring-color: var(--md-sys-color-primary);
}

/* --------------------------------------------------------------------------
   8. Espaço e layout (base 4 px)
   -------------------------------------------------------------------------- */
:root {
  --mc-space-1: 0.25rem;  /*  4 px */
  --mc-space-2: 0.5rem;   /*  8 px */
  --mc-space-3: 0.75rem;  /* 12 px */
  --mc-space-4: 1rem;     /* 16 px */
  --mc-space-5: 1.25rem;  /* 20 px */
  --mc-space-6: 1.5rem;   /* 24 px */
  --mc-space-8: 2rem;     /* 32 px */
  --mc-space-10: 2.5rem;  /* 40 px */
  --mc-space-12: 3rem;    /* 48 px */
  --mc-space-16: 4rem;    /* 64 px */
  --mc-space-20: 5rem;    /* 80 px */
  --mc-space-24: 6rem;    /* 96 px */

  --mc-layout-max: 75rem;                                  /* 1200 px de conteúdo */
  --mc-layout-text: 40rem;                                 /* largura de leitura */
  --mc-layout-gutter: clamp(1rem, 0.6rem + 1.8vw, 2rem);   /* 16 px no celular */
  --mc-fold-gap: clamp(0.75rem, 0.5rem + 1vw, 1.25rem);    /* espaço entre dobras */
  --mc-fold-pad: clamp(1.5rem, 0.9rem + 3vw, 4rem);        /* respiro interno da dobra */
  --mc-top-app-bar-height: 4rem;
  --mc-touch-target: 48px;
}

/* --------------------------------------------------------------------------
   9. Movimento: easing e duração M3
   -------------------------------------------------------------------------- */
:root {
  --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --md-sys-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);
  --md-sys-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
  --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
  --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
  --md-sys-motion-duration-short2: 100ms;
  --md-sys-motion-duration-short4: 200ms;
  --md-sys-motion-duration-medium2: 300ms;
  --md-sys-motion-duration-medium4: 400ms;
  --md-sys-motion-duration-long2: 500ms;
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --md-sys-motion-duration-short2: 0ms;
    --md-sys-motion-duration-short4: 0ms;
    --md-sys-motion-duration-medium2: 0ms;
    --md-sys-motion-duration-medium4: 0ms;
    --md-sys-motion-duration-long2: 0ms;
  }
}