/*
  Pawky website design tokens
  Derived from iOS Design System (PP-DS-014 / DesignSystem.swift)
  Not an iOS runtime asset.
  Audit date: 2026-09-20
*/

:root {
  /* Brand */
  --pawky-accent-primary: #3DBE6F;
  --pawky-accent-primary-soft: #86D9AD;
  --pawky-accent-premium: #F2B705;
  --pawky-accent-premium-soft: #FFF4CC;
  --pawky-accent-destructive: #E57184;
  --pawky-accent-destructive-soft: #F2A8B3;
  --pawky-signal-green: #3FBF84;
  --pawky-signal-status-attention: #E8A317;

  --pawky-bg-primary: #FFFFFF;
  --pawky-bg-secondary: #F2F2F7;
  --pawky-bg-inverse: #000000;
  --pawky-bg-primary-elevated: #FFFFFF;
  --pawky-bg-secondary-elevated: #F2F2F7;
  --pawky-surface-primary: #FFFFFF;
  --pawky-surface-secondary: #F2F2F7;
  --pawky-surface-primary-elevated: #FFFFFF;
  --pawky-surface-secondary-elevated: #F2F2F7;
  --pawky-separator: #C6C6C8;

  --pawky-text-primary: #1C1C1E;
  --pawky-text-secondary: #6C6C70;
  --pawky-text-tertiary: #8E8E93;
  --pawky-text-on-accent: #FFFFFF;

  --pawky-button-secondary-fill: #E5E5EA;

  --pawky-entry-meal: #F97316;
  --pawky-entry-meal-soft: #FFEDD5;
  --pawky-entry-walk: #2563EB;
  --pawky-entry-walk-soft: #DBEAFE;
  --pawky-entry-medical: #DC2626;
  --pawky-entry-medical-soft: #FEE2E2;
  --pawky-entry-training: #4F46E5;
  --pawky-entry-training-soft: #E0E7FF;
  --pawky-entry-grooming: #D946EF;
  --pawky-entry-grooming-soft: #FAE8FF;
  --pawky-entry-snack: #EAB308;
  --pawky-entry-snack-soft: #FEF9C3;
  --pawky-entry-custom: #0EA5A4;
  --pawky-entry-custom-soft: #CCFBF1;

  --pawky-illustration-outline: #1C1C1E;
  --pawky-illustration-purple: #6D69A0;
  --pawky-illustration-purple-soft: #E8E6F5;
  --pawky-system-red: #FF3B30;
  --pawky-system-red-soft: #FFE5E3;
  --pawky-system-gray: #8E8E93;

  --pawky-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --pawky-font-display: ui-rounded, "SF Pro Rounded", var(--pawky-font-sans);
  --pawky-font-weight-regular: 400;
  --pawky-font-weight-medium: 500;
  --pawky-font-weight-semibold: 600;
  --pawky-font-weight-bold: 700;

  --pawky-space-1: 4px;
  --pawky-space-2: 8px;
  --pawky-space-3: 12px;
  --pawky-space-4: 16px;
  --pawky-space-5: 20px;
  --pawky-space-6: 24px;
  --pawky-space-8: 32px;
  --pawky-space-10: 40px;
  --pawky-space-12: 48px;
  --pawky-space-16: 64px;

  --pawky-touch-min: 44px;
  --pawky-button-height: 52px;
  --pawky-content-max: 1120px;
  --pawky-content-wide: 1280px;
  --pawky-gutter-mobile: 16px;
  --pawky-gutter-tablet: 24px;
  --pawky-gutter-desktop: 32px;

  --pawky-radius-sm: 8px;
  --pawky-radius-md: 12px;
  --pawky-radius-lg: 24px;
  --pawky-radius-pill: 9999px;
  --pawky-section-radius: 24px;
  --pawky-section-radius-compact: 12px;
  --pawky-section-inset: 16px;
  --pawky-section-gap: 20px;
  --pawky-section-header-gap: 8px;

  --pawky-icon-tile-size: 36px;
  --pawky-icon-tile-size-max: 40px;
  --pawky-icon-tile-radius: 10px;
  --pawky-icon-tile-glyph: 20px;

  --pawky-duration-fast: 180ms;
  --pawky-duration-standard: 300ms;
  --pawky-ease-standard: cubic-bezier(0.25, 0.1, 0.25, 1);

  --pawky-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.08);
  --pawky-text-on-bright-accent: #1C1C1E;

  --step-hero: clamp(2rem, 1.4rem + 2.5vw, 3.25rem);
  --step-h1: clamp(1.75rem, 1.3rem + 1.8vw, 2.5rem);
  --step-h2: clamp(1.35rem, 1.15rem + 1vw, 1.75rem);
  --step-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --step-small: 0.875rem;
  --pawky-text-scale: 1;
}

@media (prefers-color-scheme: dark) {
  :root {
    --pawky-accent-primary: #33CD6D;
    --pawky-accent-primary-soft: #6FCF9A;
    --pawky-accent-premium: #FFD60A;
    --pawky-accent-premium-soft: #3A2E00;
    --pawky-accent-destructive: #E9788A;
    --pawky-accent-destructive-soft: #4E2730;
    --pawky-signal-green: #6FE3B1;
    --pawky-signal-status-attention: #FFC233;

    --pawky-bg-primary: #000000;
    --pawky-bg-secondary: #000000;
    --pawky-bg-inverse: #FFFFFF;
    --pawky-bg-primary-elevated: #1C1C1E;
    --pawky-bg-secondary-elevated: #1C1C1E;
    --pawky-surface-primary: #1C1C1E;
    --pawky-surface-secondary: #2C2C2E;
    --pawky-surface-primary-elevated: #2C2C2E;
    --pawky-surface-secondary-elevated: #3A3A3C;
    --pawky-separator: #3A3A3C;

    --pawky-text-primary: #FFFFFF;
    --pawky-text-secondary: #AEAEB2;
    --pawky-text-tertiary: #8E8E93;

    --pawky-button-secondary-fill: #3A3A3C;

    --pawky-entry-meal: #FB923C;
    --pawky-entry-meal-soft: #2A1308;
    --pawky-entry-walk: #60A5FA;
    --pawky-entry-walk-soft: #1A2A4A;
    --pawky-entry-medical: #F87171;
    --pawky-entry-medical-soft: #3A1114;
    --pawky-entry-training: #818CF8;
    --pawky-entry-training-soft: #1F1F4A;
    --pawky-entry-grooming: #E879F9;
    --pawky-entry-grooming-soft: #331042;
    --pawky-entry-snack: #FACC15;
    --pawky-entry-snack-soft: #261C0A;
    --pawky-entry-custom: #2DD4BF;
    --pawky-entry-custom-soft: #0F2F2F;

    --pawky-illustration-purple: #9691C7;
    --pawky-illustration-purple-soft: #241F3D;
    --pawky-system-red: #FF453A;
    --pawky-system-red-soft: #3A1513;
    --pawky-system-gray: #AEAEB2;

    --pawky-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 28px rgba(0, 0, 0, 0.45);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --pawky-duration-fast: 0ms;
    --pawky-duration-standard: 0ms;
  }
}

html[data-theme="light"] {
  color-scheme: light;
  --pawky-accent-primary: #3DBE6F;
  --pawky-accent-primary-soft: #86D9AD;
  --pawky-accent-premium: #F2B705;
  --pawky-accent-premium-soft: #FFF4CC;
  --pawky-accent-destructive: #E57184;
  --pawky-accent-destructive-soft: #F2A8B3;
  --pawky-signal-green: #3FBF84;
  --pawky-signal-status-attention: #E8A317;
  --pawky-bg-primary: #FFFFFF;
  --pawky-bg-secondary: #F2F2F7;
  --pawky-bg-inverse: #000000;
  --pawky-bg-primary-elevated: #FFFFFF;
  --pawky-bg-secondary-elevated: #F2F2F7;
  --pawky-surface-primary: #FFFFFF;
  --pawky-surface-secondary: #F2F2F7;
  --pawky-surface-primary-elevated: #FFFFFF;
  --pawky-surface-secondary-elevated: #F2F2F7;
  --pawky-separator: #C6C6C8;
  --pawky-text-primary: #1C1C1E;
  --pawky-text-secondary: #6C6C70;
  --pawky-text-tertiary: #8E8E93;
  --pawky-button-secondary-fill: #E5E5EA;
  --pawky-entry-meal: #F97316;
  --pawky-entry-meal-soft: #FFEDD5;
  --pawky-entry-walk: #2563EB;
  --pawky-entry-walk-soft: #DBEAFE;
  --pawky-entry-medical: #DC2626;
  --pawky-entry-medical-soft: #FEE2E2;
  --pawky-entry-training: #4F46E5;
  --pawky-entry-training-soft: #E0E7FF;
  --pawky-entry-grooming: #D946EF;
  --pawky-entry-grooming-soft: #FAE8FF;
  --pawky-entry-snack: #EAB308;
  --pawky-entry-snack-soft: #FEF9C3;
  --pawky-entry-custom: #0EA5A4;
  --pawky-entry-custom-soft: #CCFBF1;
  --pawky-illustration-purple: #6D69A0;
  --pawky-illustration-purple-soft: #E8E6F5;
  --pawky-system-red: #FF3B30;
  --pawky-system-red-soft: #FFE5E3;
  --pawky-system-gray: #8E8E93;
  --pawky-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.08);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --pawky-accent-primary: #33CD6D;
  --pawky-accent-primary-soft: #6FCF9A;
  --pawky-accent-premium: #FFD60A;
  --pawky-accent-premium-soft: #3A2E00;
  --pawky-accent-destructive: #E9788A;
  --pawky-accent-destructive-soft: #4E2730;
  --pawky-signal-green: #6FE3B1;
  --pawky-signal-status-attention: #FFC233;
  --pawky-bg-primary: #000000;
  --pawky-bg-secondary: #000000;
  --pawky-bg-inverse: #FFFFFF;
  --pawky-bg-primary-elevated: #1C1C1E;
  --pawky-bg-secondary-elevated: #1C1C1E;
  --pawky-surface-primary: #1C1C1E;
  --pawky-surface-secondary: #2C2C2E;
  --pawky-surface-primary-elevated: #2C2C2E;
  --pawky-surface-secondary-elevated: #3A3A3C;
  --pawky-separator: #3A3A3C;
  --pawky-text-primary: #FFFFFF;
  --pawky-text-secondary: #AEAEB2;
  --pawky-text-tertiary: #8E8E93;
  --pawky-button-secondary-fill: #3A3A3C;
  --pawky-entry-meal: #FB923C;
  --pawky-entry-meal-soft: #2A1308;
  --pawky-entry-walk: #60A5FA;
  --pawky-entry-walk-soft: #1A2A4A;
  --pawky-entry-medical: #F87171;
  --pawky-entry-medical-soft: #3A1114;
  --pawky-entry-training: #818CF8;
  --pawky-entry-training-soft: #1F1F4A;
  --pawky-entry-grooming: #E879F9;
  --pawky-entry-grooming-soft: #331042;
  --pawky-entry-snack: #FACC15;
  --pawky-entry-snack-soft: #261C0A;
  --pawky-entry-custom: #2DD4BF;
  --pawky-entry-custom-soft: #0F2F2F;
  --pawky-illustration-purple: #9691C7;
  --pawky-illustration-purple-soft: #241F3D;
  --pawky-system-red: #FF453A;
  --pawky-system-red-soft: #3A1513;
  --pawky-system-gray: #AEAEB2;
  --pawky-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 28px rgba(0, 0, 0, 0.45);
}

html[data-contrast="high"] {
  --pawky-accent-primary: #1E7F4F;
  --pawky-accent-premium: #B77900;
  --pawky-accent-premium-soft: #FFE9A3;
  --pawky-accent-destructive: #9E3C52;
  --pawky-signal-status-attention: #A66B00;
  --pawky-illustration-purple: #423D73;
  --pawky-entry-meal: #C2410C;
  --pawky-entry-walk: #1E40AF;
  --pawky-entry-medical: #991B1B;
  --pawky-entry-training: #3730A3;
  --pawky-entry-grooming: #A21CAF;
  --pawky-entry-snack: #A16207;
  --pawky-entry-custom: #115E59;
  --pawky-system-red: #D70015;
  --pawky-system-gray: #6C6C70;
  --pawky-button-secondary-fill: #D1D1D6;
}

@media (prefers-color-scheme: dark) {
  html[data-contrast="high"]:not([data-theme="light"]) {
    --pawky-accent-primary: #1B8A52;
    --pawky-accent-premium: #FFE066;
    --pawky-accent-premium-soft: #4A3A00;
    --pawky-accent-destructive: #B54861;
    --pawky-signal-status-attention: #FFD24D;
    --pawky-illustration-purple: #B6B2DE;
    --pawky-entry-meal: #FDBA74;
    --pawky-entry-walk: #93C5FD;
    --pawky-entry-medical: #FCA5A5;
    --pawky-entry-training: #A5B4FC;
    --pawky-entry-grooming: #F0ABFC;
    --pawky-entry-snack: #FDE047;
    --pawky-entry-custom: #5EEAD4;
    --pawky-system-red: #FF6961;
    --pawky-system-gray: #C7C7CC;
    --pawky-button-secondary-fill: #48484A;
  }
}

html[data-theme="dark"][data-contrast="high"] {
  --pawky-accent-primary: #1B8A52;
  --pawky-accent-premium: #FFE066;
  --pawky-accent-premium-soft: #4A3A00;
  --pawky-accent-destructive: #B54861;
  --pawky-signal-status-attention: #FFD24D;
  --pawky-illustration-purple: #B6B2DE;
  --pawky-entry-meal: #FDBA74;
  --pawky-entry-walk: #93C5FD;
  --pawky-entry-medical: #FCA5A5;
  --pawky-entry-training: #A5B4FC;
  --pawky-entry-grooming: #F0ABFC;
  --pawky-entry-snack: #FDE047;
  --pawky-entry-custom: #5EEAD4;
  --pawky-system-red: #FF6961;
  --pawky-system-gray: #C7C7CC;
  --pawky-button-secondary-fill: #48484A;
}

html[data-reduce-motion="on"] *,
html[data-reduce-motion="on"] *::before,
html[data-reduce-motion="on"] *::after {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
  scroll-behavior: auto !important;
}

html[data-reduce-motion="on"] {
  scroll-behavior: auto;
}

html {
  font-size: calc(100% * var(--pawky-text-scale));
  scroll-padding-top: 5.5rem;
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) { color-scheme: dark; }
}

html[data-embed="app"] .site-header,
html[data-embed="app"] .site-footer,
html[data-embed="app"] .a11y-fab,
html[data-embed="app"] .a11y-panel,
html[data-embed="app"] .theme-toggle,
html[data-embed="app"] .legal-back,
html[data-embed="app"] .site-nav,
html[data-embed="app"] .nav-toggle,
html[data-embed="app"] .nav-scrim,
html[data-embed="app"] .marketing-cta-band,
html[data-embed="app"] .mesh-wash,
html[data-embed="app"] .phone-frame {
  display: none !important;
}

html[data-embed="app"] body {
  background: var(--pawky-bg-primary);
  padding-bottom: var(--pawky-space-6);
}

html[data-embed="app"] .legal-doc {
  max-width: 42rem;
  margin: 0 auto;
  padding: var(--pawky-space-6) var(--pawky-gutter-mobile);
}
