/* ==========================================================================
   Human Relaxation Centre — Design Tokens

   Every colour, size and spacing value in the theme is declared here. Nothing
   downstream hard-codes a colour, so the whole palette can be reworked from
   this one file.

   Two contrast rules the palette is built around:

   1. Body text is #6E6E6E, not a lighter grey. On white that measures 5.1:1,
      which clears the WCAG AA minimum of 4.5:1 for body copy. #8D8D8D measures
      3.3:1 and fails, so it is reserved for incidental text — dates, captions,
      footnotes — where the requirement is different.

   2. The cyan accent is never a text colour on white: it measures 2.4:1 and is
      close to unreadable at body size. Links use the deep blue (7.7:1); cyan is
      decoration only — underlines, icons, and hover states on dark panels.
   ========================================================================== */

:root {
  /* ---------- Primary: deep indigo ---------- */
  --aumtm-blue:        #1D5683;   /* Address bar, links, primary buttons */
  --aumtm-blue-deep:   #15405F;   /* Button hover, one step darker */
  --aumtm-blue-tint:   #EEF4F9;   /* Very pale tint for alternating sections */

  /* ---------- Accent: cyan ---------- */
  --aumtm-cyan:        #16ACCE;   /* Rules, icons, hover on dark panels */
  --aumtm-cyan-soft:   #47C9E5;

  /* ---------- Dark (footer) ---------- */
  --aumtm-ink:         #262626;   /* Footer widget band */
  --aumtm-ink-deep:    #222222;   /* Copyright bar */

  /* ---------- Text ---------- */
  --aumtm-heading:     #3F3F3F;
  --aumtm-text:        #6E6E6E;   /* Body copy, dark enough to pass AA */
  --aumtm-text-dim:    #8D8D8D;   /* Incidental: dates, captions, meta */
  --aumtm-on-dark:     #E8E8E8;   /* Body copy on dark panels */
  --aumtm-on-dark-dim: #AAAAAA;   /* Incidental text on dark panels */

  /* ---------- Surfaces and rules ---------- */
  --aumtm-bg:          #FFFFFF;
  --aumtm-bg-soft:     #FBFBFB;   /* Inner page header band */
  --aumtm-line:        #E6E6E6;
  --aumtm-line-soft:   #F0F0F0;
  --aumtm-line-dark:   rgba(255, 255, 255, 0.10);

  /* ---------- Typefaces ----------
     Spectral is a low-contrast humanist serif, used for display headings only.
     Decorative serifs at small sizes read as costume rather than craft, so
     everything below heading size stays in Raleway. */
  --aumtm-font-display: "Spectral", Georgia, "Times New Roman", serif;
  --aumtm-font-body:    "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI",
                        "PingFang SC", "Microsoft YaHei", Helvetica, Arial, sans-serif;

  /* ---------- Type scale ---------- */
  --aumtm-fs-display:  clamp(2.5rem, 5.6vw, 4.25rem);   /* Hero headline */
  --aumtm-fs-h2:       clamp(1.9rem, 3.6vw, 2.75rem);   /* Section heading */
  --aumtm-fs-h3:       1.25rem;                          /* Card heading */
  --aumtm-fs-lead:     clamp(1.0625rem, 1.4vw, 1.1875rem);
  --aumtm-fs-body:     1rem;
  --aumtm-fs-sm:       0.875rem;
  --aumtm-fs-xs:       0.8125rem;
  --aumtm-fs-2xs:      0.6875rem;

  /* ---------- Spacing ---------- */
  --aumtm-section-y:   clamp(4.5rem, 8vw, 7.5rem);
  --aumtm-container:   1200px;
  --aumtm-container-nr: 820px;
  --aumtm-gutter:      clamp(1.25rem, 4vw, 2.5rem);

  /* ---------- Radius, shadow, motion ---------- */
  --aumtm-radius:      3px;
  --aumtm-radius-lg:   4px;
  --aumtm-shadow:      0 14px 40px rgba(29, 86, 131, 0.10);
  --aumtm-shadow-lg:   0 24px 60px rgba(29, 86, 131, 0.16);
  --aumtm-ease:        cubic-bezier(0.22, 0.61, 0.36, 1);
  --aumtm-dur:         0.45s;

  /* ---------- Structural heights ---------- */
  --aumtm-topbar-h:    40px;
  --aumtm-header-h:    82px;
}

@media (max-width: 900px) {
  :root { --aumtm-header-h: 64px; --aumtm-topbar-h: 36px; }
}

/* ==========================================================================
   Alternative palette — warm timber and ochre

   The palette above is cool and architectural. Uncommenting the block below
   swaps the whole site to a warm one without touching a single layout rule,
   because every colour in the theme resolves through these variables.
   ========================================================================== */
/*
:root {
  --aumtm-blue:        #6B4E32;
  --aumtm-blue-deep:   #4E3823;
  --aumtm-blue-tint:   #F6F1EA;
  --aumtm-cyan:        #A8804A;
  --aumtm-cyan-soft:   #C39A5F;
  --aumtm-ink:         #2A2521;
  --aumtm-ink-deep:    #221E1A;
  --aumtm-shadow:      0 14px 40px rgba(107, 78, 50, 0.10);
  --aumtm-shadow-lg:   0 24px 60px rgba(107, 78, 50, 0.16);
}
*/