/*
Theme Name: Jivisha Clinic Pro
Theme URI: https://jivishaclinic.com/
Author: Jivisha Clinic
Author URI: https://jivishaclinic.com/
Description: Premium custom WordPress theme for Jivisha Dermatology, Aesthetic & Pediatric Clinic, Delhi. Built for performance, accessibility and conversion.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 8.0
License: Proprietary
License URI: https://jivishaclinic.com/
Text Domain: jivisha-clinic-pro
Tags: healthcare, dermatology, premium, mobile-first, custom-theme
*/

/* ============================================================
   JIVISHA CLINIC PRO — CSS DESIGN TOKEN SYSTEM
   ============================================================ */
:root {
  /* Brand Colors */
  --c-navy:    #0F172A;
  --c-ink:     #1E293B;
  --c-muted:   #64748B;
  --c-border:  #E2E8F0;
  --c-cyan:    #0284C7;
  --c-cyan-d:  #0369A1;
  --c-teal:    #0D9488;
  --c-teal-d:  #0F766E;
  --c-bg:      #F8FAFC;
  --c-bg2:     #F1F5F9;
  --c-white:   #FFFFFF;
  --c-gold:    #D97706;
  --c-gold-l:  #FEF3C7;
  --c-rose:    #F43F5E;
  --c-success: #10B981;

  /* Gradients */
  --g-primary: linear-gradient(135deg, #0284C7 0%, #0D9488 100%);
  --g-dark:    linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
  --g-gold:    linear-gradient(135deg, #D97706 0%, #F59E0B 100%);
  --g-hero:    linear-gradient(135deg, rgba(2,132,199,0.08) 0%, rgba(13,148,136,0.06) 100%);

  /* Typography */
  --font-display: 'Outfit', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;

  /* Type Scale */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  clamp(1.5rem, 3.5vw, 2rem);
  --text-4xl:  clamp(1.75rem, 4vw, 2.5rem);
  --text-5xl:  clamp(2rem, 5vw, 3.5rem);
  --text-6xl:  clamp(2.5rem, 6vw, 4.5rem);

  /* Spacing */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 80px;
  --space-5xl: 120px;

  /* Section Rhythm */
  --section-pad: clamp(60px, 8vw, 120px);

  /* Radius */
  --r-sm:  8px;
  --r-md:  16px;
  --r-lg:  24px;
  --r-xl:  32px;
  --r-pill: 999px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.04);
  --shadow-lg:  0 10px 40px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.06);
  --shadow-xl:  0 20px 60px rgba(0,0,0,0.12), 0 8px 20px rgba(0,0,0,0.07);
  --shadow-cyan: 0 8px 30px rgba(2,132,199,0.25);

  /* Transitions */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast: 150ms var(--ease);
  --t-base: 250ms var(--ease);
  --t-slow: 350ms var(--ease);

  /* Layout */
  --container: 1200px;
  --container-sm: 760px;
  --gutter: clamp(16px, 4vw, 32px);
}