

@font-face { font-family: "Archivo"; src: url("fonts/archivo.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Supreme"; src: url("fonts/supreme.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Tanker"; src: url("fonts/tanker.woff2") format("woff2"); font-weight: 400; font-display: swap; }


:root {
  
  --c-bg: #ecebe8;          
  --c-bg-dark: #000000;     
  --c-card: #f7f6f3;        
  --c-card-dark: #1d1d1f;   

  
  --c-ink: #141414;         
  --c-ink-dark: #f1f0ec;    
  --c-muted: #6b6b6b;       
  --c-muted-dark: #9b9a96;  

  
  --c-accent: var(--c-ink);
  --c-accent-ink: var(--c-bg);          
  --c-accent-dark: var(--c-ink-dark);   
  --c-accent-ink-dark: var(--c-bg-dark);
  --c-num: inherit;                     

  
  --c-line: rgba(0, 0, 0, .13);
  --c-line-dark: rgba(255, 255, 255, .15);
  --c-ph: #d5d4d0;
  --c-ph-dark: #2c2c2b;

  
  --img-tint: transparent;
  --img-filter: none;

  
  --f-head: -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, "Helvetica Neue", Arial, sans-serif;
  --f-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Helvetica Neue", Arial, sans-serif;
  --w-head: 600;            
  --ls-head: -.015em;       
  --lh-head: 1.07;
  --tt-head: none;          
  --stretch-head: 100%;     
  --size-body: var(--t-body);

  
  --r-card: 18px;
  --c-blau: #4A7DFF;  --c-blau-tief: #0036F7;   
  --r-img: 12px;
  --r-box: 24px;    
  --r-btn: 999px;

  
  --ease: cubic-bezier(.6, .08, .02, .99);
}


:root {
  
  --t-hero: 80px;   --lh-hero: 1.05;   
  --t-1: 56px;      --lh-1: 1.07;      
  --t-2: 40px;      --lh-2: 1.1;       
  --t-3: 28px;      --lh-3: 1.14;      
  --t-eyebrow: 21px;--lh-eyebrow: 1.19;
  --t-lead: 21px;   --lh-lead: 1.38;   
  --t-body: 17px;   --lh-body: 1.47;   
  --t-small: 14px;  --lh-small: 1.43;  
  --t-micro: 12px;                     
  --w-strong: 600;
  --ls-tight: -.015em;                 

  
  --s-1: 8px;    
  --s-2: 14px;   
  --s-3: 18px;   
  --s-4: 24px;   
  --s-5: 40px;   
  --s-6: 64px;   
  --s-7: 96px;   
  --s-section: 160px; 

  
  --w-text: 692px;     
  --w-content: 980px;  
  --w-stage: 1280px;   
  --w-wide: 1440px;    
  --gut: 4vw;          
}
@media (max-width: 1068px) {
  :root { --t-hero: 64px; --t-1: 48px; --t-2: 32px; --t-3: 24px; --t-eyebrow: 19px; --t-lead: 19px;
    --s-6: 48px; --s-7: 72px; --s-section: 120px; --w-content: 692px; }
}
@media (max-width: 734px) {
  :root { --t-hero: 48px; --t-1: 40px; --t-2: 28px; --t-3: 21px; --t-eyebrow: 17px; --t-lead: 17px; --t-body: 17px;
    --s-5: 32px; --s-6: 40px; --s-7: 56px; --s-section: 88px; --w-text: 100%; --w-content: 100%; --gut: 6vw; }
}

@media (max-width: 480px) {
  :root { --t-hero: 32px; --t-1: 32px; --t-2: 28px; --t-3: 21px; --t-btn: 15px; }  
}
