/*
Theme Name: Nele Tasane koolitused
Description: nele_tasane_koolitused_child
Version: 1.0.0
Author: Urho Rättel
Author URI: https://www.facebook.com/urho.rattel
Theme URI: koolitused.neletasane.ee
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: Divi
*/

/* ==========================================================================
   koolitused.neletasane.ee
   Divi 5 Child Theme — style.css
   Fondid: Clash Display Variable (pealkirjad/nupud/menüü) + Satoshi Variable (body)
   Fluid typography: clamp(SM 320px, ... , 2XL 2560px)
   ========================================================================== */

/*--------------------------------------------------------------
1. FONDID (@font-face)
--------------------------------------------------------------*/
@font-face {
  font-family: "Clash Display Variable";
  src: url("fonts/ClashDisplay-Variable.woff2") format("woff2-variations"),
       url("fonts/ClashDisplay-Variable.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Satoshi Variable";
  src: url("fonts/Satoshi-Variable.woff2") format("woff2-variations"),
       url("fonts/Satoshi-Variable.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}

/*--------------------------------------------------------------
2. FLUID TYPOGRAPHY TOKENID
   Arvutatud: clamp(SM väärtus, intercept + vw-koefitsient, 2XL väärtus)
   Baas: 320px (SM) → 2560px (2XL), 1rem = 16px
   NB: kuna kasutasid lihtsustatud 2-punkti meetodit (SM min / 2XL max),
   siis MD/LG/XL vahepealsed suurused Figmast on lineaarse kõvera
   lähendus — need EI taba täpselt Figma vahepunkte, vaid liiguvad
   sujuvalt SM ja 2XL väärtuse vahel. Kui soovid hiljem täpsemat
   (piecewise) versiooni, anna märku.
--------------------------------------------------------------*/
:root {
  --font-body: "Satoshi Variable", sans-serif;
  --font-display: "Clash Display Variable", sans-serif;

  /* --fs-body: piecewise clamp, 320→744→1366→1920→2560px täpsetes punktides
     (vt media query üleminekud allpool). Peale 2560px jääb fikseerituks 1.5rem. */
  --fs-body:        clamp(0.844rem, 0.8192rem + 0.124vw, 0.875rem);
  --fs-nav-link:    clamp(0.6875rem, 0.6633rem + 0.0076vw, 0.857rem);
  --fs-h1:          clamp(0.875rem, 0.8393rem + 0.1786vw, 1.125rem);
  --fs-h2:          clamp(1.75rem,  1.5357rem + 1.0714vw, 3.25rem);
  --fs-h3:          clamp(1.5rem,   1.3393rem + 0.8036vw, 2.625rem);
  --fs-h4:          clamp(1.25rem,  1.1429rem + 0.5357vw, 2rem);
  --fs-display-lg:  clamp(2.625rem, 2.2143rem + 2.0536vw, 5.5rem);
  --fs-button-md:   clamp(0.938rem, 0.9113rem + 0.1336vw, 1.125rem);
  --fs-button-sm:   clamp(0.75rem,  0.7143rem + 0.1786vw, 1rem);
  --fs-footer-link: clamp(1rem,     0.9643rem + 0.1786vw, 1.25rem);
}

/* --fs-body piecewise segmendid */
@media (min-width: 744px) {
  :root {
    --fs-body: clamp(0.875rem, 0.7996rem + 0.1621vw, 0.938rem);
  }
}
@media (min-width: 1366px) {
  :root {
    --fs-body: clamp(0.938rem, 0.1687rem + 0.9011vw, 1.25rem);
  }
}
@media (min-width: 1920px) {
  :root {
    --fs-body: clamp(1.25rem, 0.5rem + 0.625vw, 1.5rem);
  }
}
@media (min-width: 2560px) {
  :root {
    --fs-body: 1.5rem;
  }
}

/*--------------------------------------------------------------
3. BODY / PÕHITEKST
   UL ja OL on lisatud, et nad päriksid täpselt samad
   parameetrid nagu body/p/li (font, suurus, line-height,
   letter-spacing). Nii ei sõltu listid ainult li reeglist,
   vaid ka UL/OL konteiner ise järgib sama skaalat.
--------------------------------------------------------------*/
body,
p,
li,
ul,
ol,
.et_pb_module {
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: var(--fs-body) !important;
  line-height: 130% !important;
  letter-spacing: 0.04rem !important;
}

/*--------------------------------------------------------------
4. PEALKIRJAD H1–H4
--------------------------------------------------------------*/
h1,
.h1,
.et_pb_heading_container h1,
.et_pb_column h1 {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: var(--fs-h1) !important;
  line-height: 100% !important;
  letter-spacing: 0.1rem !important;
  text-transform: uppercase !important;
}

h2,
.h2,
.et_pb_heading_container h2,
.et_pb_column h2 {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: var(--fs-h2) !important;
  line-height: 100% !important;
  letter-spacing: 0.055rem !important;
}

h3,
.h3,
.et_pb_heading_container h3,
.et_pb_column h3 {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: var(--fs-h3) !important;
  line-height: 120% !important;
  letter-spacing: 0.085rem !important;
}

h4,
.h4,
.et_pb_heading_container h4,
.et_pb_column h4 {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: var(--fs-h4) !important;
  line-height: 100% !important;
}

/*--------------------------------------------------------------
5. H5 — DISPLAY LARGE
   H5 kasutab display-lg suurust/parameetreid (varasem eraldi
   .display-lg klass on nüüd asendatud otse h5 tag'iga)
--------------------------------------------------------------*/
h5,
.h5,
.et_pb_heading_container h5,
.et_pb_column h5,
.et_pb_text_inner h5 {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: var(--fs-display-lg) !important;
  line-height: 100% !important;
}

/*--------------------------------------------------------------
6. NUPUD (Divi 5)
   Kohanda selectoreid, kui Divi 5 genereerib teistsuguseid klasse
   (nt Theme Builderi moodulite puhul võib olla vaja
   [class*="et_pb_button"] tüüpi attribute selectorit)
--------------------------------------------------------------*/
button,
.et_pb_button,
.et_pb_module .et_pb_button,
input[type="submit"],
input[type="button"],
.wp-block-button__link {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 100% !important;
  letter-spacing: 0.04rem !important;
}

/* Nupu suurused — vaikimisi md, väiksema variandi jaoks lisa klass .button-sm */
button,
.et_pb_button,
input[type="submit"],
input[type="button"] {
  font-size: var(--fs-button-md) !important;
}

.button-sm,
.et_pb_button.button-sm {
  font-size: var(--fs-button-sm) !important;
}

/*--------------------------------------------------------------
7. MENÜÜ / NAVIGATSIOON
--------------------------------------------------------------*/

/* Täpsemad selektorid, mis targetivad sinu menüüd */
.et_pb_menu__menu .et-menu.nav > li > a,
#menu-first > li > a,
.et_pb_menu__menu .et-menu.nav li a,
.et_pb_menu .et-menu-nav li a,
.et-menu-nav .et-menu li a,
nav.et-menu-nav ul li a {
    font-family: var(--font-display) !important;
    font-style: normal !important;
    font-weight: 400 !important;  /* ← 400, mitte 500 */
    font-size: var(--fs-button-md) !important;
    line-height: 100% !important;
    letter-spacing: 0.04rem !important;
    text-transform: none !important;
}

/* Nav link allajoon — default transparent, hover + aktiivne leht #FD5C01 */
/* Ainult peamenüü esimese taseme lingid, sub-menu välja jäetud */
.et_pb_menu__menu .et-menu.nav > li > a,
#menu-first > li > a {
    display: inline-flex !important;
    padding: 0.25rem !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0.625rem !important;
    border-bottom: 2px solid transparent !important;
    transition: border-color 0.2s ease, color 0.2s ease !important;
}

/* Alam-menüü (sub-menu) — joondus vasakule, border puudub */
.et_pb_menu__menu .sub-menu li a,
#menu-first .sub-menu li a {
    font-family: var(--font-display) !important;
    font-weight: 400 !important;
    font-size: var(--fs-button-sm) !important;
    display: block !important;
    text-align: left !important;
    border-bottom: none !important;
}

.et_pb_menu__menu .et-menu.nav > li > a:hover,
#menu-first > li > a:hover,
.et-menu-nav .et-menu li a:hover {
    border-bottom-color: #FD5C01 !important;
    color: #FD5C01 !important;
}

.et_pb_menu__menu .et-menu.nav > li.current-menu-item > a,
#menu-first > li.current-menu-item > a,
.et-menu-nav .et-menu li.current-menu-item > a,
.et_pb_menu__menu .et-menu.nav > li.current_page_item > a,
.et-menu-nav .et-menu li.current_page_item > a {
    border-bottom-color: #FD5C01 !important;
    color: #FD5C01 !important;
}

/*--------------------------------------------------------------
8. DIVI LINGI TEKSTIELEMENT (.et_pb_link_text)
   Ei sõltu preset-klassist — .et_pb_link_text p võidab
   sektsiooni 3 üldise "p { font-weight: 400 !important }" reegli
   kõrgema spetsiifilisuse tõttu (0-0-1-1 vs 0-0-0-1).
   Menüü nav lingid ei ole mõjutatud, sest need kasutavad
   .et-menu-nav / #menu-first struktuuri.
--------------------------------------------------------------*/
.et_pb_link_text,
.et_pb_link_text p {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: var(--fs-button-md) !important;
  line-height: 100% !important;
  letter-spacing: 0.04rem !important;
}

/*--------------------------------------------------------------
9. FOOTER LINGID
   Font family/weight pole eraldi spetsifitseeritud — pärib
   body stiili (Satoshi, 400). Kohanda vajadusel.
--------------------------------------------------------------*/
footer a,
a[class*="tb_footer"],
[class*="tb_footer"] a,
.footer-link {
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: var(--fs-footer-link) !important;
  line-height: 130% !important;
}

/*--------------------------------------------------------------
10. BACK TO TOP BUTTON
--------------------------------------------------------------*/
.et_pb_scroll_top.et-pb-icon {
background: #fd5c01;
}
/* Back-to-top button hover background color*/
.et_pb_scroll_top.et-pb-icon:hover {
background: #A1330B;
}
/* Back-to-top button border radius*/
.et_pb_scroll_top.et-pb-icon {
border-radius:100px;
}

/*--------------------------------------------------------------
11. EEMALDAB DROPDOWN IKOONI
--------------------------------------------------------------*/
#top-menu .menu-item-has-children > a:first-child:after,
.et_pb_menu .menu-item-has-children > a:first-child:after {
  content: "" !important;
  display: none !important;
}

/* Fix extra padding left behind after removing the icon */
#top-menu .menu-item-has-children > a:first-child,
.et_pb_menu .menu-item-has-children > a:first-child {
  padding-right: 0px !important;
}