/*
Theme Name:     Kadence Pro Child
Theme URI:      n/a
Template:       kadence
Author:         Robin Bastian
Author URI:     https://webgeneral.de
Description:    Child Theme Description
Version:        1.0
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/

/* ========================================================
 * TYPOGRAPHY
 * Define global font sizes using clamp() for a fluid effect.
 * Adjust line-height with ex values for consistent vertical spacing.
 ========================================================= */
  /* Define clamp value for body text */

:root {
  /* Body text */
  --global-font-size-body: clamp(1rem, 0.227vw + 0.955rem, 1.125rem);

  /* T-shirt scale (sm → xxxl) */
  --global-kb-font-size-sm:   clamp(0.85rem, 0.78rem + 0.2vw, 0.95rem);
  --global-kb-font-size-md:   clamp(1.15rem, 0.5vw + 1.05rem, 1.4rem);
  --global-kb-font-size-lg:   clamp(1.35rem, 0.75vw + 1.2rem, 1.7rem);
  --global-kb-font-size-xl:   clamp(1.7rem, 1.2vw + 1.4rem, 2.3rem);
  --global-kb-font-size-xxl:  clamp(2rem, 1.6vw + 1.7rem, 3rem);
  --global-kb-font-size-xxxl: clamp(2.5rem, 2vw + 2rem, 4rem);

}

/* =============================
 * TYPOGRAPHY — HEADINGS
 * Apply t-shirt size clamp values to headings.
 * Define line-height using ex units for proportional spacing.
============================= */

h1,
.wpt-h1 {
  font-size: var(--global-kb-font-size-xxl);
  line-height: 2ex;
  font-weight: bold;
  text-wrap: pretty;
}

h2,
.wpt-h2 {
  font-size: var(--global-kb-font-size-xl);
  line-height: 2.1ex;
  font-weight: bold;
  text-wrap: pretty;
}

h3,
.wpt-h3 {
  font-size: var(--global-kb-font-size-lg);
  line-height: 2.2ex;
  font-weight: bold;
  text-wrap: pretty;
}

h4,
.wpt-h4 {
  font-size: var(--global-kb-font-size-md);
  line-height: 2.2ex;
  font-weight: bold;
  text-wrap: pretty;
}

h5,
.wpt-h5 {
  font-size: var(--global-font-size-body);
  line-height: 2.3ex;
  font-weight: bold;
  text-wrap: pretty;
}

h6,
.wpt-h6 {
  font-size: var(--global-font-size-body);
  line-height: 2.3ex;
  font-weight: bold;
  text-wrap: pretty;
}

/* =============================
 * TYPOGRAPHY — BODY TEXT & ICON LIST
============================= */

body,
p,
.wpt-p,
.wp-block-kadence-iconlist {
  font-size: var(--global-font-size-body);
  line-height: 2.9ex;
  font-weight: inherit;
  text-wrap: pretty;
}

/* =============================
 * TYPOGRAPHY — EYEBROW HEADING
============================= */

.wpt-eyebrow.wp-block-kadence-advancedheading {
  color: var(--global-palette2);
  font-weight: bold;
  line-height: 1rem;
  letter-spacing: 0.1px;
  text-transform: uppercase;
}

/* ========================================================
 * TYPOGRAPHY - CUSTOM INTRO HEADING
 ========================================================= */

.wpt-intro-title.wp-block-kadence-advancedheading {
  max-width: 30ch;
  margin-left: auto;
  margin-right: auto;
}

.wpt-intro-text.wp-block-kadence-advancedheading {
  max-width: 60ch;
  margin-left: auto;
  margin-right: auto;
  text-wrap: pretty;

}

/* =============================
 * GLOBAL BORDER STYLES
 * Define border-radius values
=============================*/

:root {
  --wpt-border-radius-sm: 4px; /* Same as global button border-radius */
  --wpt-border-radius-md: 8px; /* Same as global image border-radius */
  --wpt-border-radius-lg: 12px; /* For elements requiring more rounded corners */
}

/* =============================
 * SPACING - TOKENS
 * Define global spacing tokens using clamp() for fluid scaling.
 * Used for padding, margins, gaps, and section spacing site-wide.
============================= */

:root {
  /* Fluid horizontal padding for content edges (mobile → desktop) */
  --global-content-edge-padding: clamp(1rem, 2.927vw + 0.305rem, 2.5rem);

  /* Default vertical spacing for sections (mobile → desktop) */
  --global-section-padding-y: clamp(2.5rem, 4.878vw + 1.341rem, 5rem);

  /* Row gutter (tablet → desktop) */
  --global-row-gutter-sm: clamp(0.5rem, 1.852vw + -0.389rem, 1rem);
  --global-row-gutter-md: clamp(1rem, 3.704vw + -0.778rem, 2rem);
  --global-row-gutter-lg: clamp(2rem, 7.407vw + -1.556rem, 4rem);

  /* Row gutter mobile */
  --global-row-gutter-mobile: clamp(2rem, 2.787vw + 1.338rem, 2.5rem);
}
  
 @media (max-width: 767px) {
  .kt-row-column-wrap {
    row-gap: var(--global-row-gutter-mobile);
  }
}

  /* Column gap scale. (tablet → desktop) */
  --global-kb-gap-sm: clamp(0.5rem, 1.852vw + -0.389rem, 1rem);
  --global-kb-gap-md: clamp(1rem, 3.704vw + -0.778rem, 2rem);
  --global-kb-gap-lg: clamp(2rem, 7.407vw + -1.556rem, 4rem);

  /* Global fluid spacing scale (Kadence spacing tokens) */
  --global-kb-spacing-xxs: clamp(0.25rem, 0.488vw + 0.134rem, 0.5rem);
  --global-kb-spacing-xs:  clamp(0.5rem, 0.976vw + 0.268rem, 1rem);
  --global-kb-spacing-sm:  clamp(1rem, 1.463vw + 0.652rem, 1.75rem);
  --global-kb-spacing-md:  clamp(1.25rem, 1.951vw + 0.787rem, 2.25rem);
  --global-kb-spacing-lg:  clamp(1.5rem, 2.439vw + 0.921rem, 2.75rem);
  --global-kb-spacing-xl:  clamp(2rem, 3.415vw + 1.189rem, 3.75rem);
  --global-kb-spacing-xxl: clamp(3rem, 3.902vw + 2.073rem, 5rem);
  --global-kb-spacing-3xl: clamp(4rem, 4.878vw + 2.841rem, 6.5rem);
  --global-kb-spacing-4xl: clamp(5rem, 5.854vw + 3.61rem, 8rem);
  --global-kb-spacing-5xl: clamp(7rem, 5.854vw + 5.61rem, 10rem);     
}

/* =============================
 * SPACING — SECTION (opt-in)
============================= */

section.wpt-section {
  padding-block: var(--global-section-padding-y);
}


/* =============================
 * CARDS CONTAINER STYLES
 * Placeholder for card styles. Uncomment as needed.
=============================*/

.wpt-card > .kt-inside-inner-col {
  /* border: 2px solid var(--global-palette5); */
  border-radius: var(--wpt-border-radius-md);
  box-shadow: -1px 7px 20px 0px var(--global-palette6);
}
