/**
 * Horizon Theme — "Clean Editorial" base skin
 *
 * Pure white surfaces, near-black text, deep teal accent. Designed for
 * photographers, writers, designers, and minimalist creators who want
 * a high-contrast, magazine-clean look. All-Inter typography (sans-serif
 * for crisp editorial rhythm); zero-radius corners; featherlight shadows.
 * The per-tenant brand_primary override still layers on top.
 *
 * Contrast audit: all key pairings pass WCAG 2.1 AA.
 * Accent (#0f766e) on --hp-bg (#ffffff) ≈ 5.05:1 ✅
 * --hp-on-accent (#ffffff) on accent ≈ 5.05:1 ✅
 * --hp-text (#111827) on --hp-bg ≈ 18.4:1 ✅
 * --hp-text-muted (#4b5563) on --hp-bg ≈ 7.8:1 ✅
 * --hp-text-subtle (#6b7280) on --hp-bg ≈ 6.0:1 ✅
 */

:root {
  /* ── Surfaces — clean white ── */
  --hp-bg:           #ffffff;
  --hp-bg-surface:   #f5f7f8;
  --hp-bg-raised:    #e8ecef;
  --hp-bg-overlay:   rgba(255, 255, 255, 0.95);

  /* ── Accent — deep teal (default; overridable per-tenant) ── */
  --hp-gold:         #0f766e;
  --hp-gold-light:   #0d9488; /* hover — lighter teal on white = higher contrast ✅ */
  --hp-gold-dark:    #0a5c55; /* active */
  --hp-gold-muted:   rgba(15, 118, 110, 0.10);

  /* ── Text — near-black ink ── */
  --hp-text:         #111827;
  --hp-text-muted:   #4b5563;
  --hp-text-disabled:#d1d5db;
  /* Subtle text: ≥4.5:1 on --hp-bg (#ffffff). #6b7280 ≈ 6.0:1 ✅ */
  --hp-text-subtle:  #6b7280;

  /* ── Borders — cool grey hairline ── */
  --hp-border:       rgba(0, 0, 0, 0.10);
  --hp-border-strong:rgba(0, 0, 0, 0.26);

  /* ── Functional ── */
  --hp-locked-overlay: rgba(10, 15, 20, 0.60);
  --hp-success:      #15803d;
  --hp-success-muted:rgba(21, 128, 61, 0.12);
  --hp-error:        #b91c1c;
  --hp-error-muted:  rgba(185, 28, 28, 0.10);

  /* ── Typography — all-sans, clean precision (Inter already loaded) ── */
  --hp-font-display: 'Inter', system-ui, -apple-system, sans-serif;
  --hp-font-body:    'Inter', system-ui, -apple-system, sans-serif;

  --hp-text-xs:   0.75rem;
  --hp-text-sm:   0.875rem;
  --hp-text-base: 1rem;
  --hp-text-lg:   1.125rem;
  --hp-text-xl:   1.25rem;
  --hp-text-2xl:  1.5rem;
  --hp-text-3xl:  2rem;
  --hp-text-4xl:  2.5rem;
  --hp-text-5xl:  3.25rem;
  --hp-text-hero: clamp(2.75rem, 7vw, 5.5rem);

  /* ── Spacing (same scale) ── */
  --hp-sp-px: 1px;
  --hp-sp-1:  0.25rem;
  --hp-sp-2:  0.5rem;
  --hp-sp-3:  0.75rem;
  --hp-sp-4:  1rem;
  --hp-sp-5:  1.25rem;
  --hp-sp-6:  1.5rem;
  --hp-sp-7:  1.75rem;
  --hp-sp-8:  2rem;
  --hp-sp-10: 2.5rem;
  --hp-sp-12: 3rem;
  --hp-sp-16: 4rem;
  --hp-sp-20: 5rem;
  --hp-sp-24: 6rem;
  --hp-sp-32: 8rem;

  /* ── Radii — minimal, almost square ── */
  --hp-r-sm:   0px;
  --hp-r-md:   2px;
  --hp-r-lg:   4px;
  --hp-r-xl:   8px;
  --hp-r-full: 9999px;

  /* ── Shadows — barely-there on white (needs multi-layer to read at all) ── */
  --hp-shadow-card:       0 1px 2px rgba(0,0,0,0.07), 0 0 0 1px rgba(0,0,0,0.08);
  --hp-shadow-raised:     0 4px 16px rgba(0,0,0,0.10), 0 1px 4px rgba(0,0,0,0.06);
  --hp-shadow-gold:       0 2px 12px rgba(15,118,110,0.22);
  --hp-shadow-photo-glow: 0 0 60px rgba(15,118,110,0.14);

  /* ── Overlays & on-accent — flipped light ── */
  --hp-on-accent:          #ffffff;
  --hp-hero-overlay:       linear-gradient(to bottom, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.56) 55%, rgba(255,255,255,0.88) 82%, var(--hp-bg) 100%);
  --hp-card-veil:          linear-gradient(to top, rgba(245,247,248,0.98) 0%, rgba(245,247,248,0.88) 35%, transparent 100%);
  --hp-header-scrolled-bg: rgba(255,255,255,0.96);

  /* ── Skin-aware chrome ── */
  --hp-media-well:         #111827;
  --hp-age-gate-img-filter:brightness(0.65) saturate(0.50) grayscale(0.30);
  --hp-nav-photo-shadow:   0 1px 6px rgba(255,255,255,0.72);

  /* ── Utility ── */
  --hp-portrait-glow-bleed: -12px;
  --hp-prose-max:            36rem;

  /* ── Layout ── */
  --hp-content-max:  1280px;
  --hp-content-pad:  clamp(16px, 4vw, 24px);
  --hp-header-h:     72px;

  /* ── Motion ── */
  --hp-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --hp-dur:  0.25s;
}
