/**
 * PA Design System 2.0 — tokens (single source of truth)
 * Shared by marketing site + booking. See PA-Design-System-2.0.md
 */
:root {
  /* Color — core */
  --pa2-ink: #1d1d1f;
  --pa2-ink-soft: #2c2c2e;
  --pa2-white: #ffffff;
  --pa2-canvas: #f5f5f7;
  --pa2-canvas-alt: #ebebed;
  --pa2-muted: #6e6e73;
  --pa2-tertiary: #86868b;
  --pa2-hairline: rgba(0, 0, 0, 0.08);
  --pa2-hairline-strong: rgba(0, 0, 0, 0.14);
  --pa2-surface: #ffffff;

  /* Color — semantic */
  --pa2-accent: #0071e3;
  --pa2-success: #1a6b3c;
  --pa2-success-bg: rgba(26, 107, 60, 0.08);
  --pa2-danger: #b42318;
  --pa2-danger-bg: rgba(180, 35, 24, 0.08);
  --pa2-warning: #b45309;
  --pa2-warning-bg: rgba(180, 83, 9, 0.08);

  /* Color — inverse (footer bands) */
  --pa2-inverse-bg: #1d1d1f;
  --pa2-inverse-text: rgba(255, 255, 255, 0.92);
  --pa2-inverse-muted: rgba(255, 255, 255, 0.65);
  --pa2-inverse-hairline: rgba(255, 255, 255, 0.12);

  /* Typography scale */
  --pa2-text-display: clamp(2.125rem, 4.5vw, 3rem);
  --pa2-text-h1: clamp(1.75rem, 3.5vw, 2.25rem);
  --pa2-text-h2: clamp(1.375rem, 2.25vw, 1.75rem);
  --pa2-text-h3: 1.125rem;
  --pa2-text-body: 1.0625rem;
  --pa2-text-body-lg: 1.125rem;
  --pa2-text-body-sm: 0.9375rem;
  --pa2-text-label: 1rem;
  --pa2-text-meta: 0.8125rem;
  --pa2-text-eyebrow: 0.75rem;

  /* Typography — rhythm */
  --pa2-leading-tight: 1.12;
  --pa2-leading-snug: 1.25;
  --pa2-leading-body: 1.6;
  --pa2-leading-relaxed: 1.7;
  --pa2-tracking-tight: -0.028em;
  --pa2-tracking-normal: -0.011em;
  --pa2-measure: 38rem;
  --pa2-measure-narrow: 32rem;

  /* Spacing (8px base) */
  --pa2-space-1: 0.5rem;
  --pa2-space-2: 1rem;
  --pa2-space-3: 1.5rem;
  --pa2-space-4: 2rem;
  --pa2-space-5: 3rem;
  --pa2-space-6: 4rem;
  --pa2-space-7: 6rem;
  --pa2-space-8: 8rem;
  --pa2-gutter: clamp(1rem, 4vw, 2rem);
  --pa2-section-y: clamp(3rem, 7vw, 5.5rem);
  --pa2-section-y-tight: clamp(2rem, 5vw, 3.5rem);
  --pa2-control-height: 3rem;

  /* Radius */
  --pa2-radius-shell: 28px;
  --pa2-radius-card: 16px;
  --pa2-radius-control: 12px;
  --pa2-radius-pill: 999px;

  /* Shadows & elevation */
  --pa2-shadow-none: none;
  --pa2-shadow-shell: 0 12px 36px rgba(29, 29, 31, 0.07);
  --pa2-shadow-toast: 0 8px 24px rgba(29, 29, 31, 0.1);
  --pa2-shadow-btn: 0 6px 18px rgba(29, 29, 31, 0.14);
  --pa2-shadow-btn-hover: 0 10px 28px rgba(29, 29, 31, 0.18);
  --pa2-elev-0: 0 1px 2px rgba(29, 29, 31, 0.04);
  --pa2-elev-1: 0 4px 16px rgba(29, 29, 31, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.65);
  --pa2-elev-2: 0 12px 32px rgba(29, 29, 31, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  --pa2-elev-3: 0 20px 48px rgba(29, 29, 31, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.8);

  /* Layout */
  --pa2-max-content: 67.5rem;
  --pa2-max-narrow: 40rem;
  --pa2-hero-min-height: clamp(18rem, 50vh, 34rem);
  --pa2-section-gap-max: 1.25rem;
  /* Minimum rhythm between last main-section band and site footer */
  --pa-space-section-footer: clamp(2.5rem, 6vw, 4rem);

  /* Motion — UI micro-interactions (buttons, forms, booking steps) */
  --pa2-duration: 160ms;
  --pa2-duration-slow: 220ms;
  --pa2-ease: cubic-bezier(0.28, 0.11, 0.32, 1);
  --pa2-ease-spring: cubic-bezier(0.34, 1.2, 0.64, 1);

  /* Motion — marketing scroll reveals (see docs/DESIGN-PHILOSOPHY.md) */
  --anim-duration: 650ms;
  --anim-duration-fast: 520ms;
  --anim-duration-slow: 780ms;
  --anim-stagger: 80ms;
  --anim-ease: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* Glass — subtle; supports content (see docs/DESIGN-PHILOSOPHY.md) */
  --pa-ios-blur: blur(36px) saturate(165%);
  --pa-ios-blur-light: blur(24px) saturate(155%);
  --pa-ios-blur-heavy: blur(48px) saturate(170%);
  --pa-ios-fill: rgba(255, 255, 255, 0.72);
  --pa-ios-fill-raised: rgba(255, 255, 255, 0.82);
  --pa-ios-fill-solid: rgba(255, 255, 255, 0.94);
  --pa-ios-stroke: rgba(255, 255, 255, 0.78);
  --pa-ios-stroke-subtle: rgba(29, 29, 31, 0.08);
  --pa-ios-specular: inset 0 1px 0 rgba(255, 255, 255, 0.75);
  --pa-ios-shadow: var(--pa2-elev-2);
  --pa-ios-shadow-sm: var(--pa2-elev-1);
  --pa-ios-shadow-lg: var(--pa2-elev-3);
  --pa-ios-radius-xl: 28px;
  --pa-ios-radius-lg: 20px;
  --pa-ios-radius-md: 14px;
  --pa-ios-radius-sm: 10px;
  --pa-ios-blue: #0071e3;
  --pa-ios-blue-hover: #0077ed;
  --pa-ios-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", system-ui, sans-serif;
}