:root {
--qbis-navy-900: #14296b;   
--qbis-navy-800: #1a3381;   
--qbis-navy-700: #1e3a96;
--qbis-blue-600: #2041b4;   
--qbis-indigo-500: #6161ff; 
--qbis-periwinkle-400: #879aff; 
--qbis-blue-300: #c0cfff;
--qbis-blue-200: #d6e2fb;   
--qbis-blue-100: #eaf0ff;   
--qbis-yellow-500: #fcda0c; 
--qbis-yellow-300: #ffdc70;
--qbis-cream-100: #fff1c5;  
--qbis-orange-500: #fb8500;
--qbis-coral-500: #ff6b5f;  
--qbis-purple-500: #5d2bff; 
--qbis-cyan-500: #2bc4f2;
--qbis-teal-500: #34c99a;
--qbis-ink-900: #14193a;    
--qbis-ink-700: #2f3550;    
--qbis-gray-500: #6b7280;   
--qbis-gray-300: #c9ccd6;
--qbis-surface-100: #f5f7fb;
--qbis-surface-50:  #fafbfd;
--qbis-white: #ffffff;
--qbis-gradient-orb: radial-gradient(circle at 35% 35%,
rgba(255,159,67,.9), rgba(255,107,95,.85) 35%,
rgba(167,139,250,.85) 70%, rgba(96,97,255,.8) 100%); 
--qbis-gradient-hero: linear-gradient(170deg, #1a3381 0%, #14296b 100%); 
--color-bg: var(--qbis-white);
--color-bg-alt: var(--qbis-surface-100);
--color-primary: var(--qbis-blue-600);
--color-primary-hover: var(--qbis-navy-800);
--color-accent: var(--qbis-yellow-500);
--color-accent-ink: var(--qbis-navy-900);
--text-strong: var(--qbis-ink-900);
--text-body: var(--qbis-ink-700);
--text-muted: var(--qbis-gray-500);
--text-on-dark: var(--qbis-white);
--text-link: var(--qbis-blue-600);
--surface-page: var(--qbis-white);
--surface-card: var(--qbis-white);
--surface-muted: var(--qbis-surface-100);
--surface-band-warm: var(--qbis-cream-100);
--surface-band-blue: var(--qbis-blue-200);
--surface-inverse: var(--qbis-navy-800);
--border-subtle: #e8ebf2;
--border-default: #dfe3ec;
--border-strong: var(--qbis-gray-300);
--border-focus: var(--qbis-blue-600);
--state-success: var(--qbis-teal-500);
--state-info: var(--qbis-cyan-500);
--state-warning: var(--qbis-orange-500);
--state-danger: var(--qbis-coral-500);
}
:root {
--font-sans: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
--font-display: 'Be Vietnam Pro', var(--font-sans);
--font-serif: 'Playfair Display', Georgia, serif; 
--fw-regular: 400;  
--fw-medium: 500;   
--fw-semibold: 600; 
--fw-bold: 700;     
--fw-extrabold: 800;
--fw-black: 900;    
--fs-hero: clamp(30px, 3.9vw, 46px);  --lh-hero: 1.1;     
--fs-display: clamp(28px, 3.4vw, 40px);  --lh-display: 1.15;  
--fs-h2: 28px;   --lh-h2: 1.25; 
--fs-h3: 20px;   --lh-h3: 1.3;  
--fs-h4: 17px;   --lh-h4: 1.4;  
--fs-h5: 16px;   --lh-h5: 1.5;  
--fs-stat: 34px; --lh-stat: 1;     
--fs-body: 15px; --lh-body: 1.7; 
--fs-body-sm: 13.5px; --lh-body-sm: 1.6; 
--fs-caption: 12px; --lh-caption: 1.4; 
--fs-label: 12px; --lh-label: 1.4;  
--fs-button: 15px; --lh-button: 1; 
}
.qbis-eyebrow { font-family: var(--font-sans); font-weight: var(--fw-bold); font-size: var(--fs-label);
letter-spacing: .12em; text-transform: uppercase; color: var(--qbis-orange-500); }
.qbis-display { font-family: var(--font-sans); font-weight: var(--fw-extrabold); font-size: var(--fs-display);
line-height: var(--lh-display); color: var(--text-strong); }
.qbis-hero { font-family: var(--font-sans); font-weight: var(--fw-black); font-size: var(--fs-hero);
line-height: var(--lh-hero); }
.qbis-body { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-body);
line-height: var(--lh-body); color: var(--text-body); }
.qbis-stat { font-family: var(--font-sans); font-weight: var(--fw-extrabold); font-size: var(--fs-stat);
line-height: var(--lh-stat); color: var(--qbis-yellow-500); }
:root {
--space-1: 4px;
--space-2: 8px;
--space-3: 12px;
--space-4: 16px;
--space-5: 20px;
--space-6: 24px;
--space-8: 32px;
--space-10: 40px;
--space-12: 48px;
--space-16: 64px;
--space-20: 80px;
--space-24: 96px;
--radius-xs: 6px;    
--radius-sm: 8px;    
--radius-md: 15px;   
--radius-lg: 20px;   
--radius-xl: 28px;   
--radius-2xl: 32px;
--radius-pill: 100px;
--radius-full: 999px;
--shadow-xs: 0 1px 2px rgba(20,25,58,0.06);
--shadow-sm: 0 2px 8px rgba(20,25,58,0.08);
--shadow-md: 0 10px 30px rgba(20,25,58,0.10);
--shadow-lg: 0 24px 60px rgba(20,25,58,0.14);
--shadow-card: 0 8px 28px rgba(26,51,129,0.10);
--shadow-glow-orange: 0 0 60px rgba(255,150,80,0.30);
--container-max: 1024px;
--container-pad: 32px;
--section-y: 88px;
--ease-standard: cubic-bezier(0.2, 0, 0, 1);   
--ease-emphasized: cubic-bezier(0.3, 0, 0, 1); 
--dur-fast: 120ms; 
--dur-base: 200ms; 
--dur-slow: 320ms; 
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
margin: 0;
font-family: var(--font-sans);
font-size: var(--fs-body);
line-height: var(--lh-body);
color: var(--text-body);
background: var(--surface-page);
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
a { color: var(--text-link); text-decoration: none; transition: color .2s, opacity .2s; }
a:hover { opacity: .85; }
h1, h2, h3, h4, h5 { margin: 0; color: var(--text-strong); font-family: var(--font-sans); }
::selection { background: var(--qbis-blue-200); color: var(--qbis-navy-900); }
:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 2px; }
.qbis-container { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--container-pad); }
.qbis-sec { padding: 88px 0; }
