//
// Component: Heading
//
// ========================================================================


// Variables
// ========================================================================

@heading-medium-font-size-m:                    @heading-medium-font-size-l * 0.91;    // 58px 

@heading-medium-font-size-l:                    64px;
@heading-xlarge-font-size-l:                    120px;

@heading-divider-padding-bottom:                2px;
@heading-divider-border-width:                  ~'calc(0.5px + 0.02em)';
@heading-divider-border:                        fade(@global-emphasis-color, 70%);

@heading-bullet-border-width:                   ~'calc(2px + 0.02em)';
@heading-bullet-border:                         @global-primary-background;

@heading-line-border-width:                     ~'calc(0.5px + 0.02em)';

//
// Master
//

@heading-small-letter-spacing:                  4px;
@heading-medium-letter-spacing:                 4px;
@heading-large-letter-spacing:                  6px;

@heading-xlarge-font-family:                    @global-secondary-font-family;
@heading-xlarge-font-weight:                    500;
@heading-xlarge-letter-spacing:                 12px;

@heading-2xlarge-font-family:                   @global-secondary-font-family;
@heading-2xlarge-font-weight:                   500;
@heading-2xlarge-letter-spacing:                12px;


// Component
// ========================================================================

.hook-heading-small() {}

.hook-heading-medium() {}

.hook-heading-large() {}

.hook-heading-xlarge() {}

.hook-heading-2xlarge() {}


// Divider
// ========================================================================

.hook-heading-divider() {}


// Bullet
// ========================================================================

.hook-heading-bullet() {}


// Line
// ========================================================================

.hook-heading-line() {}



// Miscellaneous
// ========================================================================

.hook-heading-misc() {}


// Inverse
// ========================================================================

.hook-inverse-heading-small() {}

.hook-inverse-heading-medium() {}

.hook-inverse-heading-large() {}

.hook-inverse-heading-xlarge() {}

.hook-inverse-heading-2xlarge() {}

.hook-inverse-heading-divider() {}

.hook-inverse-heading-bullet() {}

.hook-inverse-heading-line() {}
