/* Instagram 营销页面变量 */

:root {
    /* Instagram主题色 */
    --instagram-purple: #8a3ab9;
    --instagram-purple-light: #bc2a8d;
    --instagram-purple-dark: #4c68d7;
    --instagram-yellow: #fccc63;
    --instagram-orange: #fbad50;
    --instagram-red: #cd486b;
    --instagram-red-dark: #c13584;
    
    /* 基础颜色 */
    --instagram-white: #ffffff;
    --instagram-black: #262626;
    --instagram-gray: #999999;
    --instagram-gray-light: #e6e6e6;
    --instagram-gray-dark: #444444;
    
    /* 字体 */
    --instagram-font-primary: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --instagram-font-secondary: 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif;
    
    /* 间距 */
    --instagram-space-xs: 0.5rem;
    --instagram-space-sm: 1rem;
    --instagram-space-md: 2rem;
    --instagram-space-lg: 3rem;
    --instagram-space-xl: 5rem;
    
    /* 圆角 */
    --instagram-radius-sm: 4px;
    --instagram-radius-md: 8px;
    --instagram-radius-lg: 16px;
    --instagram-radius-full: 9999px;
    
    /* 过渡 */
    --instagram-transition: all 0.3s ease;
    
    /* 阴影 */
    --instagram-shadow-sm: 0 2px 5px rgba(0, 0, 0, 0.1);
    --instagram-shadow-md: 0 5px 15px rgba(0, 0, 0, 0.1);
    --instagram-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.1);
    
    /* 渐变背景 */
    --instagram-gradient-primary: linear-gradient(45deg, var(--instagram-purple), var(--instagram-red), var(--instagram-orange), var(--instagram-yellow));
    --instagram-gradient-secondary: linear-gradient(45deg, var(--instagram-purple-dark), var(--instagram-purple), var(--instagram-red-dark));
    
    /* 主色调 - Instagram渐变色 */
    --instagram-primary: #405DE6;
    --instagram-secondary: #5851DB;
    --instagram-gradient-start: #833AB4;
    --instagram-gradient-middle: #C13584;
    --instagram-gradient-end: #E1306C;
    --instagram-accent1: #FD1D1D;
    --instagram-accent2: #F56040;
    --instagram-accent3: #F77737;
    --instagram-accent4: #FCAF45;
    --instagram-accent5: #FFDC80;
    
    /* 标准渐变 */
    --instagram-gradient: linear-gradient(45deg, var(--instagram-gradient-start), var(--instagram-gradient-end));
    --instagram-button-gradient: linear-gradient(45deg, var(--instagram-gradient-middle), var(--instagram-accent1));
    --instagram-hover-gradient: linear-gradient(45deg, var(--instagram-accent1), var(--instagram-gradient-middle));
    
    /* 辅助色 */
    --instagram-dark: #262626;
    --instagram-medium: #8E8E8E;
    --instagram-light: #F9F9F9;
    
    /* 文本颜色 */
    --instagram-text-primary: #262626;
    --instagram-text-secondary: #8E8E8E;
    --instagram-text-white: #FFFFFF;
    
    /* 背景颜色 */
    --instagram-bg-white: #FFFFFF;
    --instagram-bg-light: #F9F9F9;
    --instagram-bg-dark: #262626;
    
    /* 边框和阴影 */
    --instagram-border: #DBDBDB;
    --instagram-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    --instagram-hover-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    
    /* 字体大小 */
    --instagram-font-xs: 12px;
    --instagram-font-sm: 14px;
    --instagram-font-md: 16px;
    --instagram-font-lg: 20px;
    --instagram-font-xl: 24px;
    --instagram-font-xxl: 32px;
    --instagram-font-hero: 48px;
    
    /* 动效速度 */
    --instagram-transition-fast: 0.2s;
    --instagram-transition-normal: 0.3s;
    --instagram-transition-slow: 0.5s;
    
    /* 间距 */
    --instagram-spacing-xs: 4px;
    --instagram-spacing-sm: 8px;
    --instagram-spacing-md: 16px;
    --instagram-spacing-lg: 24px;
    --instagram-spacing-xl: 32px;
    --instagram-spacing-xxl: 48px;
    
    /* 容器宽度 */
    --instagram-container-width: 1200px;
    --instagram-container-sm: 540px;
    --instagram-container-md: 720px;
    --instagram-container-lg: 960px;
    --instagram-container-xl: 1140px;
    
    /* 文字颜色 */
    --text-dark: #262626;
    --text-medium: #666666;
    --text-light: #999999;
    --text-white: #ffffff;
    
    /* 背景颜色 */
    --bg-light: #fafafa;
    --bg-white: #ffffff;
    --bg-dark: #121212;
    
    /* 边框和阴影 */
    --border-color: #dbdbdb;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
    
    /* 间距 */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-xxl: 3rem;
    
    /* 字体大小 */
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.25rem;
    --font-size-xl: 1.5rem;
    --font-size-xxl: 2rem;
    --font-size-display: 3rem;
    
    /* 圆角 */
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 16px;
    --border-radius-full: 9999px;
    
    /* 动画时间 */
    --transition-fast: 0.2s;
    --transition-normal: 0.3s;
    --transition-slow: 0.5s;
}