/*
 * Theme Name:  Psychology Outcomes
 * Theme URI:   https://www.psychologyoutcomes.com.au
 * Description: Custom theme for Psychology Outcomes — modern, design-studio aesthetic for a mental health clinic.
 * Version:     1.0.0
 * Author:      Conyak
 * Text Domain: psychology-outcomes
 * Tags:        custom-logo, custom-menu, featured-images, full-width-template, threaded-comments, translation-ready
 */

/* ============================================================
   BRAND TOKENS — single source of truth
   All colours, type, spacing, radius defined here.
   ============================================================ */
:root {
    /* Palette */
    --po-cream:       #feeae1;
    --po-blue:        #386e99;
    --po-coral:       #c97a5a;
    --po-navy:        #1c3c63;
    --po-pink:        #efd6d3;
    --po-sage:        #d1e4ce;
    --po-sky:         #d9eaf7;
    --po-brown:       #b17e2b;
    --po-white:       #ffffff;
    --po-off-white:   #fdf8f5;
    --po-text:        #1a1a1a;
    --po-text-muted:  #5a5a5a;

    /* Semantic */
    --po-bg:          var(--po-cream);
    --po-surface:     var(--po-white);
    --po-primary:     var(--po-blue);
    --po-primary-dk:  var(--po-navy);
    --po-accent:      var(--po-coral);
    --po-highlight:   var(--po-brown);

    /* Typography — fonts loaded in functions.php / @font-face */
    --po-font-heading: 'Agrandir Grand', 'Helvetica Neue', Arial, sans-serif;
    --po-font-body:    'Garet', 'Helvetica Neue', Arial, sans-serif;

    --po-size-xs:   0.75rem;   /* 12px */
    --po-size-sm:   0.875rem;  /* 14px */
    --po-size-base: 1rem;      /* 16px */
    --po-size-md:   1.125rem;  /* 18px */
    --po-size-lg:   1.25rem;   /* 20px */
    --po-size-xl:   1.5rem;    /* 24px */
    --po-size-2xl:  2rem;      /* 32px */
    --po-size-3xl:  2.75rem;   /* 44px */
    --po-size-4xl:  3.5rem;    /* 56px */
    --po-size-5xl:  4.5rem;    /* 72px */

    --po-weight-regular: 400;
    --po-weight-bold:    700;
    --po-weight-xbold:   800;

    --po-line-tight:  1.15;
    --po-line-base:   1.6;

    --po-letter-heading: 0.04em;

    /* Spacing scale */
    --po-space-1:  0.25rem;
    --po-space-2:  0.5rem;
    --po-space-3:  0.75rem;
    --po-space-4:  1rem;
    --po-space-6:  1.5rem;
    --po-space-8:  2rem;
    --po-space-10: 2.5rem;
    --po-space-12: 3rem;
    --po-space-16: 4rem;
    --po-space-20: 5rem;
    --po-space-24: 6rem;
    --po-space-32: 8rem;

    /* Layout */
    --po-container:      1200px;
    --po-container-wide: 1440px;
    --po-gutter:         clamp(1rem, 4vw, 2rem);

    /* Radius */
    --po-radius-sm:   6px;
    --po-radius-md:   12px;
    --po-radius-lg:   24px;
    --po-radius-xl:   40px;
    --po-radius-full: 9999px;

    /* Shadows */
    --po-shadow-sm:  0 2px 8px rgba(56, 110, 153, 0.08);
    --po-shadow-md:  0 6px 24px rgba(56, 110, 153, 0.12);
    --po-shadow-lg:  0 16px 48px rgba(56, 110, 153, 0.16);

    /* Transitions */
    --po-ease:        cubic-bezier(0.4, 0, 0.2, 1);
    --po-duration-sm: 150ms;
    --po-duration-md: 300ms;
    --po-duration-lg: 500ms;

    /* Z-index scale */
    --po-z-base:    1;
    --po-z-above:   10;
    --po-z-sticky:  100;
    --po-z-overlay: 200;
    --po-z-modal:   300;
}