/* ============================================================
   Aster Aesthetics design tokens. Single source of truth.
   Loaded first on every page (site and store). Every other
   stylesheet reads these; nothing should hard-code a colour,
   radius or shadow. Reference: docs/DESIGN-SYSTEM.md and the
   living brand page at /design-system (staging).
   ============================================================ */
@font-face{font-family:'Aster Cormorant';font-style:normal;font-weight:300 700;font-display:swap;src:url('/assets/customer-design-20261027/cormorant.woff2') format('woff2')}
@font-face{font-family:'Aster Cormorant';font-style:italic;font-weight:300 700;font-display:swap;src:url('/assets/customer-design-20261027/cormorant-italic.woff2') format('woff2')}
@font-face{font-family:'Aster Montserrat';font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/customer-design-20261027/montserrat.woff2') format('woff2')}

:root {
  /* --- Colour: surfaces --- */
  --ae-white: #ffffff;
  --ae-blush: #fbf8f8;          /* alternate band, image placeholder */
  --ae-placeholder: #f1eded;    /* behind photos while loading */

  /* --- Colour: text --- */
  --ae-ink: #241c1d;            /* headings, solid buttons, input borders */
  --ae-muted: #5e5e5c;          /* body copy, captions */

  /* --- Colour: lines --- */
  --ae-line: #eadfe0;           /* hairlines, card borders, pagination */
  --ae-card-border: #e2d3d5;    /* concern tiles, membership tiers */

  /* --- Colour: accent (the only one) --- */
  --ae-wine: #7a1f2b;
  --ae-hover: var(--ae-wine);
  --ae-hover-tint: rgba(122, 31, 43, 0.08);
  --ae-on-dark: #ffffff;

  /* --- Type --- */
  --ae-serif: 'Aster Cormorant', 'Cormorant Garamond', Georgia, serif;
  --ae-sans: 'Aster Montserrat', 'Montserrat', Arial, sans-serif;
  --ae-h1: clamp(48px, 5vw, 76px);
  --ae-h2: clamp(40px, 4.2vw, 58px);
  --ae-h3: 26px;
  --ae-display-weight: 500;
  --ae-display-leading: 1.08;
  --ae-quote: clamp(23px, 2.4vw, 30px);
  --ae-intro: 17px;
  --ae-body: 15px;
  --ae-small: 13px;
  --ae-fine: 11px;
  --ae-label: 11px;             /* eyebrows, buttons, links */
  --ae-label-tracking: .14em;
  --ae-eyebrow-tracking: .2em;
  --ae-body-leading: 1.75;

  /* --- Shape --- */
  --ae-radius: 0;
  --ae-radius-circle: 50%;      /* avatars, social icons, dots only */
  --ae-shadow: none;
  --ae-hairline: 1px solid var(--ae-line);

  /* --- Layout --- */
  --ae-wrap: 1360px;
  --ae-section-pad: 96px 4%;
  --ae-section-pad-mobile: 64px 20px;
  --ae-gap: 24px;
  --ae-gap-tight: 14px;
  --ae-card-pad: 32px;
  --ae-measure: 68ch;

  /* --- Controls --- */
  --ae-control-height: 50px;
  --ae-input-height: 54px;
  --ae-button-pad: 16px 26px;
  --ae-transition: .15s;

  /* Legacy aliases still read by older stylesheets (hover unification, Nov 4). */
  --aster-hover: var(--ae-wine);
  --aster-hover-tint: var(--ae-hover-tint);
  --aster-editorial-font: var(--ae-serif);
  --aster-quote-font: var(--ae-serif);
}