/**
 * Typography — Archetipa Child Theme
 *
 * Headings: Larken (Adobe Typekit)
 * Body/UI:  Brandon Grotesque (Adobe Typekit)
 * Fonts loaded via Typekit: https://use.typekit.net/kve8wnk.css
 */

/* ==========================================================================
   1. Base Typography (from qwery craftsman customizer)
   ========================================================================== */

body {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.62em;
    letter-spacing: 0px;
    text-transform: none;
    color: #63656A;
}

input,
select,
textarea {
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5em;
    letter-spacing: 0px;
    text-transform: none;
}

button {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

h1 {
    font-family: "larken", serif;
    font-size: 3.353em;
    font-weight: 300;
    line-height: 1em;
    letter-spacing: -1.1px;
    text-transform: none;
    color: #63656A;
    margin: 0;
}

h2 {
    font-family: "larken", serif;
    font-size: 2.765em;
    font-weight: 300;
    line-height: 1.021em;
    letter-spacing: 0px;
    text-transform: none;
    color: #63656A;
    margin: 0;
}

h3 {
    font-family: "larken", serif;
    font-size: 2.059em;
    font-weight: 300;
    line-height: 1.086em;
    letter-spacing: 0px;
    text-transform: none;
    color: #63656A;
    margin: 0;
}

h4 {
    font-family: "larken", serif;
    font-size: 1.647em;
    font-weight: 300;
    line-height: 1.143em;
    letter-spacing: 0px;
    text-transform: none;
    color: #63656A;
    margin: 0;
}

h5 {
    font-family: "larken", serif;
    font-size: 1.412em;
    font-weight: 300;
    line-height: 1.417em;
    letter-spacing: 0px;
    text-transform: none;
    color: #63656A;
    margin: 0;
}

h6 {
    font-family: "larken", serif;
    font-size: 1.118em;
    font-weight: 300;
    line-height: 1.474em;
    letter-spacing: 0px;
    text-transform: none;
    color: #63656A;
    margin: 0;
}

p {
    margin-bottom: 1.5rem;
}

a {
    color: inherit;
}

/* ==========================================================================
   2b. Qwery Theme Font Variables (for compatibility with skin CSS)
   ========================================================================== */

:root {
    --theme-font-p_font-family: brandon-grotesque, sans-serif;
    --theme-font-p_font-size: 1rem;
    --theme-font-p_line-height: 1.62em;
    --theme-font-p_font-weight: 400;
    --theme-font-p_font-style: normal;
    --theme-font-p_text-decoration: inherit;
    --theme-font-p_text-transform: none;
    --theme-font-p_letter-spacing: 0px;
    --theme-font-p_margin-top: 0em;
    --theme-font-p_margin-bottom: 1.57em;

    --theme-font-post_font-family: brandon-grotesque, sans-serif;
    --theme-font-post_font-size: inherit;
    --theme-font-post_line-height: 32px;
    --theme-font-post_font-weight: 400;
    --theme-font-post_font-style: inherit;
    --theme-font-post_text-decoration: inherit;
    --theme-font-post_text-transform: inherit;
    --theme-font-post_letter-spacing: inherit;

    --theme-font-h1_font-family: larken, serif;
    --theme-font-h1_font-size: 3.353em;
    --theme-font-h1_line-height: 1em;
    --theme-font-h1_font-weight: 300;
    --theme-font-h1_font-style: normal;
    --theme-font-h1_text-decoration: none;
    --theme-font-h1_text-transform: none;
    --theme-font-h1_letter-spacing: -1.1px;
    --theme-font-h1_margin-top: 1.12em;
    --theme-font-h1_margin-bottom: 0.36em;

    --theme-font-h2_font-family: larken, serif;
    --theme-font-h2_font-size: 2.765em;
    --theme-font-h2_line-height: 1.021em;
    --theme-font-h2_font-weight: 300;
    --theme-font-h2_font-style: normal;
    --theme-font-h2_text-decoration: none;
    --theme-font-h2_text-transform: none;
    --theme-font-h2_letter-spacing: 0px;
    --theme-font-h2_margin-top: 0.82em;
    --theme-font-h2_margin-bottom: 0.4em;

    --theme-font-h3_font-family: larken, serif;
    --theme-font-h3_font-size: 2.059em;
    --theme-font-h3_line-height: 1.086em;
    --theme-font-h3_font-weight: 300;
    --theme-font-h3_font-style: normal;
    --theme-font-h3_text-decoration: none;
    --theme-font-h3_text-transform: none;
    --theme-font-h3_letter-spacing: 0px;

    --theme-font-h4_font-family: larken, serif;
    --theme-font-h4_font-size: 1.647em;
    --theme-font-h4_line-height: 1.143em;
    --theme-font-h4_font-weight: 300;
    --theme-font-h4_font-style: normal;
    --theme-font-h4_text-decoration: none;
    --theme-font-h4_text-transform: none;
    --theme-font-h4_letter-spacing: 0px;

    --theme-font-h5_font-family: larken, serif;
    --theme-font-h5_font-size: 1.412em;
    --theme-font-h5_line-height: 1.417em;
    --theme-font-h5_font-weight: 300;
    --theme-font-h5_font-style: normal;
    --theme-font-h5_text-decoration: none;
    --theme-font-h5_text-transform: none;
    --theme-font-h5_letter-spacing: 0px;

    --theme-font-h6_font-family: larken, serif;
    --theme-font-h6_font-size: 1.118em;
    --theme-font-h6_line-height: 1.474em;
    --theme-font-h6_font-weight: 300;
    --theme-font-h6_font-style: normal;
    --theme-font-h6_text-decoration: none;
    --theme-font-h6_text-transform: none;
    --theme-font-h6_letter-spacing: 0px;

    --theme-font-button_font-family: brandon-grotesque, sans-serif;
    --theme-font-button_font-size: 13px;
    --theme-font-button_line-height: 20px;
    --theme-font-button_font-weight: 700;
    --theme-font-button_font-style: normal;
    --theme-font-button_text-decoration: none;
    --theme-font-button_text-transform: uppercase;
    --theme-font-button_letter-spacing: 0.8px;

    --theme-font-input_font-family: inherit;
    --theme-font-input_font-size: 16px;
    --theme-font-input_line-height: 1.5em;
    --theme-font-input_font-weight: 400;
    --theme-font-input_font-style: normal;
    --theme-font-input_text-decoration: inherit;
    --theme-font-input_text-transform: none;
    --theme-font-input_letter-spacing: 0px;

    --theme-font-info_font-family: brandon-grotesque, sans-serif;
    --theme-font-info_font-size: 14px;
    --theme-font-info_line-height: 1.5em;
    --theme-font-info_font-weight: 400;
    --theme-font-info_font-style: normal;
    --theme-font-info_text-decoration: inherit;
    --theme-font-info_text-transform: none;
    --theme-font-info_letter-spacing: 0px;

    --theme-font-menu_font-family: inherit;
    --theme-font-menu_font-size: 17px;
    --theme-font-menu_line-height: 1.5em;
    --theme-font-menu_font-weight: 500;
    --theme-font-menu_font-style: normal;
    --theme-font-menu_text-decoration: none;
    --theme-font-menu_text-transform: none;
    --theme-font-menu_letter-spacing: 0px;

    --theme-font-submenu_font-family: brandon-grotesque, sans-serif;
    --theme-font-submenu_font-size: 15px;
    --theme-font-submenu_line-height: 1.5em;
    --theme-font-submenu_font-weight: 400;
    --theme-font-submenu_font-style: normal;
    --theme-font-submenu_text-decoration: inherit;
    --theme-font-submenu_text-transform: none;
    --theme-font-submenu_letter-spacing: 0px;

    --theme-font-logo_font-family: inherit;
    --theme-font-logo_font-size: 1.7em;
    --theme-font-logo_line-height: 1.25em;
    --theme-font-logo_font-weight: 700;
    --theme-font-logo_font-style: normal;
    --theme-font-logo_text-decoration: none;
    --theme-font-logo_text-transform: none;
    --theme-font-logo_letter-spacing: 0px;

    --theme-font-other_font-family: brandon-grotesque, sans-serif;
    --theme-font-other_font-size: inherit;
    --theme-font-other_line-height: inherit;
    --theme-font-other_font-weight: inherit;
    --theme-font-other_font-style: inherit;
    --theme-font-other_text-decoration: inherit;
    --theme-font-other_text-transform: inherit;
    --theme-font-other_letter-spacing: inherit;
}

/* ==========================================================================
   2c. Menu & Navigation Typography
   ========================================================================== */

.menu-item > a,
.elementor-nav-menu .elementor-item {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.5em;
}

.sub-menu .menu-item > a,
.elementor-nav-menu .elementor-sub-item {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5em;
}

/* ==========================================================================
   3. Utility Classes
   ========================================================================== */

.font-headings {
    font-family: "larken", serif;
}

.font-body {
    font-family: "brandon-grotesque", sans-serif;
}

/* ==========================================================================
   4. Elementor Overrides
   ========================================================================== */

/* Slider headings use a div instead of a heading tag */
.elementor-slide-heading {
    font-family: "larken", serif;
}

/* ==========================================================================
   5. SK Component Typography
   ========================================================================== */

/* Headings component */
.sk-headings__title {
    font-size: 3rem;
    line-height: 3.125rem;
    color: #63656A;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 10px;
}

.sk-headings__description {
    margin-top: 0.9375rem;
}

/* Testimonials & Box Media */
.sk-carousel-testimonials .testimonials__title,
.sk-box-media .box-media__text {
    font-size: 2.625rem;
    font-weight: 700;
    line-height: 1;
}

.sk-carousel-testimonials .testimonials__text {
    font-size: 1.25rem;
}

/* Box Icons */
.sk-box-icons .boxicons__title {
    font-size: 1.625rem;
}

/* Buttons */
.sk-btn__label {
    font-size: 1.125rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.8px;
}

/* Modal titles */
.modal-title,
.modal .response__title {
    font-size: 1.875rem;
    line-height: 1.1;
    margin-bottom: 1.25rem;
}

/* Tooltip */
.tooltip-inner {
    font-family: "brandon_grotesque", sans-serif;
    font-weight: 700;
    line-height: 1.2;
}

/* Info text (captions, meta, small labels) */
.post_info,
.post_meta,
.widget_title {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5em;
}

/* ==========================================================================
   5. Responsive Typography
   ========================================================================== */

/* Tablet: max 64em (1024px) */
@media (max-width: 64em) {
    .sk-box-icons .boxicons__title {
        font-size: 1.375rem;
    }

    .sk-carousel-testimonials .testimonials__title,
    .sk-box-media .box-media__text {
        font-size: 2rem;
    }

    .sk-carousel-testimonials .testimonials__text {
        font-size: 1rem;
    }
}

/* Mobile: max 47.9375em (767px) */
@media (max-width: 47.9375em) {
    .sk-headings__title {
        font-size: 1.75rem;
        line-height: 1.875rem;
    }
}

/* Small mobile: max 36em (576px) */
@media (max-width: 36em) {
    .sk-headings h2 {
        font-size: 1.625rem;
    }

    .sk-headings p {
        font-size: 1.125rem;
    }

    .sk-carousel-testimonials .testimonials__title,
    .sk-box-media .box-media__text {
        font-size: 1.625rem;
    }
}
