/*
 Theme Name:   SevenSync Child
 Theme URI:    https://7synctech.com
 Description:  Hello Elementor Child Theme for SevenSync (7 Sync)
 Author:       7 Sync Tech
 Author URI:   https://7synctech.com
 Template:     hello-elementor
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  sevensync-child
*/

/* =====================================================
   SevenSync Child Theme — Custom Styles
   All component overrides go below.
   Variables are loaded via functions.php enqueue.
   ===================================================== */
@media (max-width: 1599px) {
  :root {
    --section-padding: 75px;
    --section-title-bottom: 70px;
    --content-space: 50px;
    --h1-fs: 140px;
    --h2-fs: 100px;
    --h3-fs: 52px;
    --h4-fs: 36px;
    --h5-fs: 24px;
    --h6-fs: 18px;
    --p-fs: 18px;
    --headding-lh: 0.8em
  }
}

@media (max-width: 1399px) {
  :root {
    --section-padding: 66px;
    --section-title-bottom: 60px;
    --content-space: 40px;
    --h1-fs: 120px;
    --h2-fs: 84px;
    --h3-fs: 48px;
    --h4-fs: 30px;
    --h5-fs: 24px;
    --h6-fs: 18px;
    --p-fs: 18px;
    --headding-lh: 0.8em
  }
}

@media (max-width: 991px) {
  :root {
    --section-padding: 48px;
    --section-title-bottom: 40px;
    --content-space: 30px;
    --h1-fs: 90px;
    --h2-fs: 64px;
    --h3-fs: 36px;
    --h4-fs: 30px;
    --h5-fs: 24px;
    --h6-fs: 18px;
    --p-fs: 18px;
    --headding-lh: 0.8em
  }
}

@media (max-width: 767px) {
  :root {
    --section-padding: 40px;
    --section-title-bottom: 40px;
    --content-space: 30px;
    --h1-fs: 50px;
    --h2-fs: 36px;
    --h3-fs: 30px;
    --h4-fs: 24px;
    --h5-fs: 20px;
    --h6-fs: 16px;
    --p-fs: 16px;
    --headding-lh: 0.8em
  }

}

.footer-social-icons {
  margin-left: auto;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: auto !important;
  }
}

html {
  scroll-behavior: auto !important;
}

.site-header--glass {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}


.cms-style .h1,
.cms-style h1 {
  font-weight: 700;
  padding: 0 0 42px 0;
  margin: 0;
  text-transform: uppercase;
  line-height: 1;
  color: var(--primary-900);
}

.cms-style .h2,
.cms-style h2 {
  font-size: var(--h4-fs);
  font-weight: 700;
  padding: 0 0 20px 0;
  text-transform: uppercase;
  margin: 0;
  text-transform: none;
  line-height: 1;
  color: var(--primary-900);
}

.cms-style h1,
.cms-style .h1,
.cms-style.cms-content h1,
.cms-style.cms-content .h1 {
  font-size: var(--h3-fs)
}

.cms-style.cms-content h1,
.cms-style.cms-content .h1 {
  font-weight: 700;
  padding: 0 0 36px 0;
  text-transform: uppercase;
  margin: 0;
  line-height: normal;
  color: var(--primary-900);
}

.cms-style .h3,
.cms-style h3 {
  font-weight: 700;
  padding: 0 0 20px 0;
  margin: 0;
  line-height: normal;
  text-transform: uppercase;
  text-transform: none;
  color: var(--primary-900);
}

.cms-style h2,
.cms-style .h2,
.cms-style.cms-content h2,
.cms-style.cms-content .h2 {
  font-size: var(--h4-fs);
  text-transform: uppercase;
  color: var(--primary-900);
}

.cms-style h3,
.cms-style .h3,
.cms-style.cms-content h3,
.cms-style.cms-content .h3 {
  font-size: var(--h5-fs);
  text-transform: uppercase;
  color: var(--primary-900);
}

.cms-style .h4,
.cms-style h4 {
  font-size: var(--h6-fs);
  text-transform: uppercase;
  color: var(--primary-900);
}

.cms-style h2,
.cms-style .h2,
.cms-style.cms-content h2,
.cms-style.cms-content .h2 {
  font-weight: 700;
  padding: 0 0 20px 0;
  margin: 0;
  color: var(--primary-900);
}

.cms-style .h4,
.cms-style h4 {
  font-weight: 700;
  padding: 0 0 20px 0;
  margin: 0;
  text-transform: uppercase;
  color: var(--primary-900);
}

.cms-style .h5,
.cms-style h5 {
  font-weight: 700;
  text-transform: uppercase;
  padding: 0 0 20px 0;
  margin: 0;
  line-height: normal;
  color: var(--primary-900); 
}

.cms-style .h6,
.cms-style h6 {
  font-weight: 700;
  text-transform: uppercase;
  padding: 0 0 18px 0;
  margin: 0;
  color: var(--primary-900);
  line-height: normal; 
}
.cms-style :is(p, ul, ol):has(+:is(.h1, .h2, .h3, .h4, .h5, .h6)),
.cms-style :is(p, ul, ol):has(+:is(h1, h2, h3, h4, h5, h6)) {
  padding-bottom: 40px;
  font-size: var(--p-fs);
} 
.cms-style p{ 
  font-size: var(--p-fs);
}

.cms-style p a,
.cms-style a{
  color: var(--primary-900);
  text-decoration: underline;
}