/*
Theme Name: CT Child
Theme URI: https://www.plappermaul.at
Description: Child theme generated by Enhanced Plugin Bundle and Theme Manager.
Author: Plappermaul OG
Author URI: https://www.plappermaul.at
Template: yootheme
Version: 1.0.0
*/

:root {

	/* Breakpoints */
    --kaeser-breakpoint-s: 640;
    --kaeser-breakpoint-xl: 1600;
	
    /* Base Font Sizes */
    --html-mobile: 20;
    --html-desktop: 25;
    --kaeser-html-lh-m: 25;
    --kaeser-html-lh-d: 30;

    /* Heading Tokens (Size / Line-Height) */
    --kaeser-h1-mobile: 60; --kaeser-h1-desktop: 200; --kaeser-h1-lh-m: 70; --kaeser-h1-lh-d: 220;
    --kaeser-h2-mobile: 40; --kaeser-h2-desktop: 128; --kaeser-h2-lh-m: 40; --kaeser-h2-lh-d: 128;
    --kaeser-h3-mobile: 25; --kaeser-h3-desktop: 40; --kaeser-h3-lh-m: 30; --kaeser-h3-lh-d: 45;
    --kaeser-h4-mobile: 25; --kaeser-h4-desktop: 35; --kaeser-h4-lh-m: 30; --kaeser-h4-lh-d: 40;
    --kaeser-h5-mobile: 20; --kaeser-h5-desktop: 25; --kaeser-h5-lh-m: 25; --kaeser-h5-lh-d: 30;
    --kaeser-h6-mobile: 18; --kaeser-h6-desktop: 20; --kaeser-h6-lh-m: 18; --kaeser-h6-lh-d: 20;
	
	--kaeser-heading-medium-mobile: 30;
	--kaeser-heading-medium-desktop: 50;
	--kaeser-heading-medium-lh-m: 34;
	--kaeser-heading-medium-lh-d: 54;

    /* UIkit Specific Components */
    --kaeser-button-mobile: 16;
    --kaeser-button-desktop: 25;
    --kaeser-button-lh-m: 36;
    --kaeser-button-lh-d: 60;
	--kaeser-button-small-mobile: 15;
    --kaeser-button-small-desktop: 20;
    --kaeser-button-small-lh-m: 30;
    --kaeser-button-small-lh-d: 50;
	
	/* UIkit Text Components */
	--kaeser-small-mobile: 14;
	--kaeser-small-desktop: 16;
	--kaeser-small-lh-m: 18;
	--kaeser-small-lh-d: 22;
	
	--kaeser-lead-mobile: 20;
	--kaeser-lead-desktop: 25;
	--kaeser-lead-lh-m: 25;
	--kaeser-lead-lh-d: 30;
	
	--kaeser-large-mobile: 35;
	--kaeser-large-desktop: 80;
	--kaeser-large-lh-m: 40;
	--kaeser-large-lh-d: 90;
	
	--kaeser-accordion-title-mobile: 20;
	--kaeser-accordion-title-desktop: 30;
	--kaeser-accordion-title-lh-m: 30;
	--kaeser-accordion-title-lh-d: 45;
	
	--kaeser-accordion-content-mobile: 15;
	--kaeser-accordion-content-desktop: 25;
	--kaeser-accordion-content-lh-m: 20;
	--kaeser-accordion-content-lh-d: 30;
}

/* Mapping Variables to UIkit / HTML Elements */

.uk-h1, h1 {
    --mobile-font-size: var(--kaeser-h1-mobile);
    --desktop-font-size: var(--kaeser-h1-desktop);
    --mobile-line-height: var(--kaeser-h1-lh-m);
    --desktop-line-height: var(--kaeser-h1-lh-d);
}

.uk-h2, h2 {
    --mobile-font-size: var(--kaeser-h2-mobile);
    --desktop-font-size: var(--kaeser-h2-desktop);
    --mobile-line-height: var(--kaeser-h2-lh-m);
    --desktop-line-height: var(--kaeser-h2-lh-d);
}

.uk-h3, h3 {
    --mobile-font-size: var(--kaeser-h3-mobile);
    --desktop-font-size: var(--kaeser-h3-desktop);
    --mobile-line-height: var(--kaeser-h3-lh-m);
    --desktop-line-height: var(--kaeser-h3-lh-d);
}

.uk-h4, h4,.nf-field-label label, .error404 p, .uk-modal-title{
    --mobile-font-size: var(--kaeser-h4-mobile);
    --desktop-font-size: var(--kaeser-h4-desktop);
    --mobile-line-height: var(--kaeser-h4-lh-m);
    --desktop-line-height: var(--kaeser-h4-lh-d);
}

.uk-h5, h5, .uk-button-large, .nf-field-element input, .nf-field-element .btn{
    --mobile-font-size: var(--kaeser-h5-mobile);
    --desktop-font-size: var(--kaeser-h5-desktop);
    --mobile-line-height: var(--kaeser-h5-lh-m);
    --desktop-line-height: var(--kaeser-h5-lh-d);
}

.uk-h6, h6, .karriereschritt{
    --mobile-font-size: var(--kaeser-h6-mobile);
    --desktop-font-size: var(--kaeser-h6-desktop);
    --mobile-line-height: var(--kaeser-h6-lh-m);
    --desktop-line-height: var(--kaeser-h6-lh-d);
}

.uk-heading-medium {
    --mobile-font-size: var(--kaeser-heading-medium-mobile);
    --desktop-font-size: var(--kaeser-heading-medium-desktop);
    --mobile-line-height: var(--kaeser-heading-medium-lh-m);
    --desktop-line-height: var(--kaeser-heading-medium-lh-d);
}

.uk-text-small {
    --mobile-font-size: var(--kaeser-small-mobile);
    --desktop-font-size: var(--kaeser-small-desktop);
    --mobile-line-height: var(--kaeser-small-lh-m);
    --desktop-line-height: var(--kaeser-small-lh-d);
}

.uk-text-lead {
    --mobile-font-size: var(--kaeser-lead-mobile);
    --desktop-font-size: var(--kaeser-lead-desktop);
    --mobile-line-height: var(--kaeser-lead-lh-m);
    --desktop-line-height: var(--kaeser-lead-lh-d);
}

.uk-text-large, .error404 .tm-main h1, .search .tm-main h1,.search .tm-main .uk-h3 {
    --mobile-font-size: var(--kaeser-large-mobile);
    --desktop-font-size: var(--kaeser-large-desktop);
    --mobile-line-height: var(--kaeser-large-lh-m);
    --desktop-line-height: var(--kaeser-large-lh-d);
}

.uk-button-small{
	--mobile-font-size: var(--kaeser-button-small-mobile);
    --desktop-font-size: var(--kaeser-button-small-desktop);
    --mobile-line-height: var(--kaeser-button-small-lh-m);
    --desktop-line-height: var(--kaeser-button-small-lh-d);
}
.uk-button:not(.uk-button-large):not(.uk-button-small),
.uk-subnav-pill > * > :first-child,
.uk-navbar-nav > li > a {
    --mobile-font-size: var(--kaeser-button-mobile);
    --desktop-font-size: var(--kaeser-button-desktop);
    --mobile-line-height: var(--kaeser-button-lh-m);
    --desktop-line-height: var(--kaeser-button-lh-d);
}

.uk-accordion-title{
	--mobile-font-size: var(--kaeser-accordion-title-mobile);
    --desktop-font-size: var(--kaeser-accordion-title-desktop);
    --mobile-line-height: var(--kaeser-accordion-title-lh-m);
    --desktop-line-height: var(--kaeser-accordion-title-lh-d);
}

.uk-accordion-content{
	--mobile-font-size: var(--kaeser-accordion-content-mobile);
    --desktop-font-size: var(--kaeser-accordion-content-desktop);
    --mobile-line-height: var(--kaeser-accordion-content-lh-m);
    --desktop-line-height: var(--kaeser-accordion-content-lh-d);
}

/* Global Clamp Logic */

h1, body:not(.search):not(.search-results) h2, h3, h4, h5, h6, html,
.error404 .tm-main h1,.search .tm-main h1,.search .tm-main .uk-h3,
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, .uk-heading-medium,
.uk-text-lead, .uk-text-large, .uk-text-small,
.uk-button, .uk-navbar-nav > li > a,.uk-button-small,.nf-field-label label,
.uk-accordion-title,.uk-accordion-content,.karriereschritt,.nf-field-element input,
.nf-field-element .btn, .uk-modal-title,
.uk-subnav-pill > * > :first-child {

    font-size: clamp(
        calc(var(--mobile-font-size) * 1px),  
        calc(
            (var(--mobile-font-size) * 1px) + 
            ((var(--desktop-font-size) - var(--mobile-font-size)) * ((100vw - (var(--kaeser-breakpoint-s) * 1px)) / 
            (var(--kaeser-breakpoint-xl) - var(--kaeser-breakpoint-s))))
        ),
        calc(var(--desktop-font-size) * 1px)  
    ) !important;

    line-height: clamp(
        calc(var(--mobile-line-height) * 1px),
        calc(
            (var(--mobile-line-height) * 1px) + 
            ((var(--desktop-line-height) - var(--mobile-line-height)) * ((100vw - (var(--kaeser-breakpoint-s) * 1px)) / 
            (var(--kaeser-breakpoint-xl) - var(--kaeser-breakpoint-s))))
        ),
        calc(var(--desktop-line-height) * 1px)
    ) !important;
	
	text-wrap: balance !important;
}

