

:root {

  

  --color-neutral-50: #FBFAF6;
  --color-neutral-200: #EFEEEA;
  --color-neutral-300: #E1E0DC;
  --color-neutral-600: #767571;
  --color-neutral-700: #62615E;
  --color-neutral-800: #43423F;
  --color-neutral-900: #22211E;
  --color-neutral-fff: #FFFFFF;
  --color-brand-50: #EBE9E3;
  --color-brand-300: #837663;

  
  --color-brand-700: #42341D;
  --color-accent-400: #836663;
  --color-accent-500: #6F4C48;
  --color-accent-600: #634441;

  
  --color-red: #A13131;

  

  --color-text-heading: var(--color-neutral-900);
  --color-text-heading-brand: var(--color-brand-300);
  --color-text-heading-on-strong: var(--color-neutral-fff);
  --color-text-body: var(--color-neutral-800);
  --color-text-body-on-strong: var(--color-neutral-fff);
  --color-text-muted: var(--color-neutral-700);
  --color-text-decor: var(--color-neutral-200);
  --color-surface-page: var(--color-neutral-50);
  --color-surface-subtle: var(--color-brand-50);
  --color-surface-strong: var(--color-brand-300);
  --color-border-default: var(--color-neutral-300);
  --color-controls-links-text-on-strong: var(--color-neutral-fff);
  --color-controls-links-text-on-strong-hover: var(--color-brand-50);
  --color-controls-btn-primary-bg: var(--color-accent-500);
  --color-controls-btn-primary-bg-hover: var(--color-accent-400);
  --color-controls-btn-primary-bg-pressed: var(--color-accent-600);
  --color-controls-btn-primary-label: var(--color-neutral-fff);
  --color-controls-btn-outline-border: var(--color-accent-500);
  --color-controls-btn-outline-border-hover: var(--color-accent-400);
  --color-controls-btn-outline-border-pressed: var(--color-accent-600);
  --color-controls-btn-outline-label: var(--color-accent-500);
  --color-controls-btn-outline-label-hover: var(--color-accent-400);
  --color-controls-btn-outline-label-pressed: var(--color-accent-600);
  --color-controls-nav-text-default: var(--color-text-heading);
  --color-controls-nav-text-hover: var(--color-accent-400);
  --color-controls-nav-text-pressed: var(--color-accent-600);
  --color-controls-links-text-default: var(--color-accent-500);
  --color-controls-links-text-hover: var(--color-accent-400);
  --color-controls-links-breadcrumbs-default: var(--color-neutral-800);
  --color-controls-links-breadcrumbs-separator: var(--color-neutral-600);
  --color-controls-links-breadcrumbs-hover: var(--color-accent-400);
  --color-controls-links-breadcrumbs-current: var(--color-neutral-700);

  

  
  --size-text-lead: 1.125rem;      
  --size-text-body: 1rem;          
  --size-text-caption: 0.875rem;   
  --size-text-legal: 0.75rem;      

  
  --size-heading-h1: 2.25rem;      
  --size-heading-h2: 1.875rem;     
  --size-heading-h3: 1.625rem;     
  --size-heading-h4: 1.375rem;     
  --size-heading-h5: 1.125rem;     

  
  --size-controls-btn-label-l: 1.25rem;
  --size-controls-btn-label-md: 1rem;
  --size-controls-btn-outline: 2px;
  --size-controls-links-breadcrumbs: 0.875rem;  
  --size-controls-links-text: var(--size-text-body); 
  --size-controls-nav-l: 1.25rem;
  --size-controls-nav-md: 1rem;

  
  --spacing-text-body: 16px;

  
  --spacing-heading-h1: 24px;
  --spacing-heading-h2: 20px;
  --spacing-heading-h3: 20px;
  --spacing-heading-h4: 16px;
  --spacing-heading-h5: 12px;

  
  --spacing-section-rhythm: 64px;
  --spacing-section-edge: 64px;

  
  --spacing-block-s: 24px;
  --spacing-block-md: 32px;
  --spacing-block-lg: 40px;
  --spacing-block-xl: 64px;

  
  --spacing-inset-xs: 8px;
  --spacing-inset-s: 12px;
  --spacing-inset-md: 16px;
  --spacing-inset-lg: 24px;

  
  --spacing-gap-xs: 4px;
  --spacing-gap-s: 8px;
  --spacing-gap-md: 12px;
  --spacing-gap-lg: 16px;
  --spacing-controls-btn-x-l: 32px;
  --spacing-controls-btn-y-l: 24px;
  --spacing-controls-btn-x-md: 24px;
  --spacing-controls-btn-y-md: 16px;
  --spacing-controls-nav-x-l: 0px;
  --spacing-controls-nav-y-l: 24px;
  --spacing-controls-nav-x-md: 0px;
  --spacing-controls-nav-y-md: 16px;

  
  --radius-xs: 8px;
  --radius-s: 12px;
  --radius-md: 16px;
  --radius-l: 24px;
  --radius-pill: 999px;
  --radius-controls-btn-l: var(--radius-md);
  --radius-controls-btn-md: var(--radius-s);

  

  --font-heading: 'Prata', Georgia, serif;
  --font-body: 'Golos Text', system-ui, sans-serif;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;

  
  --line-height-heading-h1: 1.3;
  --line-height-heading-h2: 1.3;
  --line-height-heading-h3: 1.3;
  --line-height-heading-h4: 1.4;
  --line-height-heading-h5: 1.4;
  --line-height-text-lead: 1.6;
  --line-height-text-body: 1.5;
  --line-height-text-caption: 1.5;
  --line-height-text-legal: 1.5;
  --line-height-controls-l: 1.2;
  --line-height-controls-md: 1.5;

  
  --spacing-text-lead: 24px;

  
  --spacing-text-caption: 8px;

  

  --container-max: 1480px;

  
  --container: min(87.5vw, var(--container-max));

  
  --measure: min(100%, 800px);
  --col-text: min(calc(0.37 * var(--container)), 520px);

  
  --color-slider-cursor: color-mix(in srgb, var(--color-brand-700) 85%, transparent);

  
  --color-hero-ticker: var(--color-red);

  --header-height: calc(
    2 * var(--spacing-block-s)
    + 2 * var(--spacing-controls-btn-y-l)
    + var(--size-controls-btn-label-l) * var(--line-height-controls-l)
    + 1px
  );

  --order-bar-space: calc(
    2 * var(--spacing-controls-btn-y-l)
    + var(--size-controls-btn-label-l) * var(--line-height-controls-l)
    + var(--spacing-block-md)
    + env(safe-area-inset-bottom, 0px)
  );

  --transition-duration: .4s;
  --transition-easing: cubic-bezier(0.25, 0.74, 0.22, 0.99);

  

  --type-heading-h1:
    var(--font-weight-regular)
    var(--size-heading-h1) / var(--line-height-heading-h1)
    var(--font-heading);

  --type-heading-h2:
    var(--font-weight-regular)
    var(--size-heading-h2) / var(--line-height-heading-h2)
    var(--font-heading);

  --type-heading-h3:
    var(--font-weight-regular)
    var(--size-heading-h3) / var(--line-height-heading-h3)
    var(--font-heading);

  --type-heading-h4:
    var(--font-weight-regular)
    var(--size-heading-h4) / var(--line-height-heading-h4)
    var(--font-heading);

  --type-heading-h5:
    var(--font-weight-regular)
    var(--size-heading-h5) / var(--line-height-heading-h5)
    var(--font-heading);

  --type-text-lead:
    var(--font-weight-regular)
    var(--size-text-lead) / var(--line-height-text-lead)
    var(--font-body);

  --type-text-body-r:
    var(--font-weight-regular)
    var(--size-text-body) / var(--line-height-text-body)
    var(--font-body);

  --type-text-body-sb:
    var(--font-weight-semibold)
    var(--size-text-body) / var(--line-height-text-body)
    var(--font-body);

  --type-text-caption-r:
    var(--font-weight-regular)
    var(--size-text-caption) / var(--line-height-text-caption)
    var(--font-body);

  --type-text-caption-sb:
    var(--font-weight-semibold)
    var(--size-text-caption) / var(--line-height-text-caption)
    var(--font-body);

  --type-controls-btn-l:
    var(--font-weight-medium)
    var(--size-controls-btn-label-l) / var(--line-height-controls-l)
    var(--font-body);

  --type-controls-btn-md:
    var(--font-weight-medium)
    var(--size-controls-btn-label-md) / var(--line-height-controls-md)
    var(--font-body);

  --type-controls-nav-l:
    var(--font-weight-medium)
    var(--size-controls-nav-l) / var(--line-height-controls-l)
    var(--font-body);

  --type-controls-nav-md:
    var(--font-weight-medium)
    var(--size-controls-nav-md) / var(--line-height-controls-md)
    var(--font-body);

  --type-controls-link-s:
    var(--font-weight-regular)
    var(--size-controls-links-breadcrumbs) / var(--line-height-text-caption)
    var(--font-body);
}



@media (min-width: 768px) {
  :root {
    --size-text-lead: 1.25rem;     

    
    --size-heading-h1: 4rem;

    --size-heading-h2: 2.75rem;    
    --size-heading-h3: 2rem;       
    --size-heading-h4: 1.5rem;     
    --size-heading-h5: 1.25rem;    

    --spacing-heading-h1: 32px;
    --spacing-heading-h2: 24px;
    --spacing-heading-h3: 24px;

    --spacing-section-rhythm: 128px;
    --spacing-section-edge: 128px;

    --spacing-block-s: 32px;
    --spacing-block-md: 48px;
    --spacing-block-lg: 64px;
    --spacing-block-xl: 128px;
  }
}
