/* Theme Information */
/*--------------------------------------*/


/*
Theme Name: Financial Cents
Theme URI: https://generatepress.com
Template: generatepress
Author: Caio Ferreira
Author URI: https://caiohferreira.com.br/
Description: Financial Cents is a child theme of GeneratePress, a lightweight WordPress theme. It is designed to be fast, easy to use, and highly customizable. The theme is perfect for personal finance blogs, investment websites, and any other site that focuses on financial topics. With its clean design and user-friendly interface, Financial Cents makes it easy to create a professional-looking website that stands out from the competition.
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 1.0.0

*/

/* Typography system based on Utopia: https://utopia.fyi/type/calculator?c=479,20,1.2,1514,20,1.25,8,2,1280-5-0-0-0 */

:root {
    /* Fonts */
    --font-primary: 'Sora', sans-serif;
    --font-secondary: 'Inter', serif;
  
    /* Font sizes and line heights (fluid via clamp + em-based line-height) */
  
    --fs-h1: clamp(3.202rem, 1.373rem + 3.808vw, 4.313rem); /* 51.23–69px */
    --lh-h1: 1.04em;
  
    --fs-h2: clamp(2.25rem, 1.772rem + 1.257vw, 2.375rem); /* 36px - 38px */
    --lh-h2: 1.18em;
  
    --fs-h3: clamp(1.875rem, 1.581rem + 0.615vw, 2rem); /* 30px - 32px */
    --lh-h3: 1.33em;
  
    --fs-h4: clamp(1.313rem, 1.171rem + 0.296vw, 1.313rem); /* 21px fixed */
    --lh-h4: 1.38em;
  
    --fs-h5: clamp(1.313rem, 1.171rem + 0.296vw, 1.313rem); /* 21px fixed */
    --lh-h5: 1.52em;
  
    --fs-body: clamp(1.25rem, 1.171rem + 0.148vw, 1.313rem); /* 20px - 21px */
    --lh-body: 1.52em;

    /* Spacing across sections */

  --s-5: clamp(0.188rem, 0.143rem + 0.095vw, 0.313rem);     /* 3px → 5px */
  --s-10: clamp(0.375rem, 0.286rem + 0.191vw, 0.625rem);    /* 6px → 10px */
  --s-15: clamp(0.563rem, 0.429rem + 0.286vw, 0.938rem);    /* 10px → 15px */
  --s-25: clamp(0.938rem, 0.753rem + 0.477vw, 1.563rem);    /* 15px → 25px */
  --s-30: clamp(1.125rem, 0.902rem + 0.573vw, 1.875rem);    /* 18px → 30px */
  --s-40: clamp(1.25rem, 1.002rem + 0.616vw, 2.5rem);       /* 20px → 40px */
  --s-50: clamp(1.563rem, 1.253rem + 0.785vw, 3.125rem);    /* 25px → 50px */
  --s-55: clamp(1.75rem, 1.402rem + 0.858vw, 3.438rem);     /* 28px → 55px */
  --s-60: clamp(1.875rem, 1.502rem + 0.916vw, 3.75rem);     /* 30px → 60px */
  --s-75: clamp(2.188rem, 1.752rem + 1.074vw, 4.688rem);     /* 35px → 75px */
  --s-84: clamp(2.625rem, 2.102rem + 1.288vw, 5.25rem);     /* 42px → 84px */
  --s-90: clamp(2.813rem, 2.254rem + 1.38vw, 5.625rem);     /* 45px → 90px */
  --s-100: clamp(3.125rem, 2.503rem + 1.532vw, 6.25rem);    /* 50px → 100px */
  --s-120: clamp(3.75rem, 3.003rem + 1.84vw, 7.5rem);       /* 60px → 120px */
  --s-140: clamp(4.375rem, 3.502rem + 2.148vw, 8.75rem);    /* 70px → 140px */
  }

  html{
    overflow-x: hidden !important;
  }
  
  /* Heading Styles */
  h1 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: var(--fs-h1);
    line-height: var(--lh-h1);
    letter-spacing: 0;
    margin-bottom: 0;
  }
  
  h2 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: var(--fs-h2);
    line-height: var(--lh-h2);
    letter-spacing: 0;
    margin-bottom: 0;
  }
  
  h3 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: var(--fs-h3);
    line-height: var(--lh-h3);
    letter-spacing: 0;
    margin-bottom: 0;
  }
  
  h4 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: var(--fs-h4);
    line-height: var(--lh-h4);
    letter-spacing: 0;
    margin-bottom: 0;
  }
  
  h5 {
    font-family: var(--font-secondary);
    font-weight: 700;
    font-size: var(--fs-h5);
    line-height: var(--lh-h5);
    letter-spacing: 0;
    margin-bottom: 0;
  }
  
  /* Paragraph */
  p {
    font-family: var(--font-secondary);
    font-weight: 400;
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    letter-spacing: 0;
    margin-bottom: 0;
  }

.wp-block-post-excerpt__excerpt{
  font-size: 17px;
}

.content-page p{
  margin: 0 0 1em 0;
}

.content-page h1, .content-page h2, .content-page h3, .content-page h4, .content-page h5{
  margin: 2rem 0rem;
}

.content-page li{
  margin: 0.5rem 0 0 2rem;
  font-size: 1.125rem;
}

.primary-button-l, .primary-button-m, .primary-button-s{
  background-color: var(--green-strong) !important;
  color: var(--white-pure) !important;
}

.secondary-button-l, .secondary-button-m, .secondary-button-s {
  background-color: rgba(0, 0, 0, 0) !important;
  color: var(--black-pure) !important;
}

.tertiary-button-l, .tertiary-button-m, .tertiary-button-s{
  background-color: rgba(0, 0, 0, 0) !important;
  color: var(--white-pure) !important;
}

.secondary-button-white{
  background-color: var(--white-pure) !important;
  color: var(--black-pure) !important;
}

.primary-button-l:hover, .primary-button-m:hover, .primary-button-s:hover, .secondary-button-l:hover, .secondary-button-m:hover, .tertiary-button-s:hover, .tertiary-button-m:hover, .tertiary-button-l:hover{
  opacity: 0.75;
}

/* Header */

.site-header {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  background-color: transparent;
  transition: background-color 0.3s ease;
  z-index: 99;
}

.site-header.scrolled {
  background-color: #fff;
}

.header-inner {
  transition: box-shadow 0.7s ease;
}

.site-header.scrolled .header-inner {
  box-shadow: none !important;
}

@media screen and (max-width: 1300px) {
  .desktop-nav {
    display: none !important;
  }

  @media (min-width: 1025px) {
    #nav-mobile {
        display: unset !important
    }
}
}
@media screen and (min-width: 1300px) {
  .mobile-hamburguer {
    display: none !important;
  }
}

.megamenu :is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus){
  border-bottom: 5px solid var(--green-strong);
  margin-top: 24px;
  padding-bottom: 18px;
  display: inline-flex;
  align-items: center;
  font-weight: normal !important;
}

.megamenu {
  overflow: visible;
}

.megamenu{
  margin: 0 !important;
  list-style: none;
}

 .nav-item:hover{
  opacity: .7;
}

.nav-items-list{
  gap: 15px;
}

.nav-items-list a:hover{
  color: var(--green-strong) !important;
}

.resources-container:hover span {
  color: var(--green-strong);
}

.current-menu-item a {
  font-weight: 700 !important;
}

/* Mobile mega menu */

.wp-block-navigation__responsive-container{
  padding-right: 20px !important;
  padding-top: 25px !important
}

/* Specific Features Tab Styling GB */

.specific-features .gb-tabs__menu-item:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus){
  background-color: var(--green-strong) !important;
  color: var(--white-pure);
  border-radius: 10px;
  border: 1px solid var(--green-strong);
}

.specific-features .gb-tabs__menu-item{
  border: 1px solid var(--black-pure);
  font-size: 1rem;
  border-radius: 10px;
  padding: 9px 12px;
  word-wrap: normal;
  display: block;
  text-align: center;
  width: auto;
}

/* Details side tab styling */

.details-tab-individual{
  max-height: 35vh;
}

@media screen and (max-width: 1024px) {
  .details-tab-image-right{
    top: 20px !important;
    left: 0 !important;
  }

  .details-tab-individual{
    max-height: 100vh;
  }
}


.details-tab-image-right{
  position: relative;
  max-width: 625px;
  height: auto;
  left: 30vw;
  top: 50vh;
}

/* 1025px to 1025px */
@media (max-width: 1165px) and (min-width: 1025px) {

  .details-image{
    width: 100% !important;
  }
}

.details-tab-image-left{
  position: relative;
  top: -52vh;
  left: -65vh;
}

/* A single source of truth tab section styling */

.single-source-tabs .gb-tabs__item.gb-tabs__item-open, .gb-tabs__menu-item-4c58ad60:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus){
  background: var(--white-pure) !important;
}

:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus) .tab-text{
  font-weight: 700;
  color: var(--black-pure);
}

.single-soruce-tabs:where(:not(button)).gb-tabs__menu-item{
  background: var(--white-base) !important;
}

.no-decoration{
  text-decoration: none !important;
}

.no-decoration:hover{
  text-decoration: none !important;
}

.underline-highlight {
  position: relative;
  display: inline-block;
}

.underline-highlight::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0em;
  width: 100%;
  height: 0.3em;
  background-color: rgba(209, 246, 223, 0.7);
}

.rating-links:hover{
  opacity: .70;
  -webkit-touch-callout: none;
  border-radius: .25rem;
  transition: opacity 125ms ease-in-out;
}

/* The Events Calendar */

.tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container{
  gap: 20px;
}

.tribe-common--breakpoint-medium .tribe-filter-bar--vertical.tribe-filter-bar{
  margin: 0;
}

.tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-calendar-day, .tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-calendar-latest-past, .tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-calendar-list, .tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-calendar-month, .tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-pro-map, .tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-pro-photo, .tribe-events--filter-bar-vertical.tribe-common--breakpoint-medium .tribe-events-l-container .tribe-filter-bar--open~.tribe-events-pro-week-grid{
  width: 100%;
}

.tribe-filter-bar .tribe-filter-bar-c-filter--open .tribe-filter-bar-c-filter__container{
  padding-top: 10px;
}

.tribe-events .tribe-events-c-search__button, .tribe-events button.tribe-events-c-search__button{
  color: var(--black-pure);
  background: var(--white-pure);
  border: 1px solid var(--black-pure);
}

.tribe-events .tribe-events-c-search__button:focus, .tribe-events .tribe-events-c-search__button:hover, .tribe-events button.tribe-events-c-search__button:focus, .tribe-events button.tribe-events-c-search__button:hover{
  color: var(--black-pure);
  background: var(--white-pure);
  border: 1px solid var(--black-pure);
  opacity:  .7;
}

/* Single source of truth tab styling */

.single-source-of-truth-tab-individual{
  border-right: 1px solid rgba(227, 227, 227, 1);
  border-bottom: 1px solid rgba(227, 227, 227, 1);
  background-color: var(--white-base);
  box-shadow: inset 4px -4px 6px 0px rgba(0,0,0,0.05);
}

.single-source-of-truth-tab-individual:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus){
  border-bottom: 0px !important;
  background-color: var(--white-pure) !important;
  display: flex;
  flex-direction: column;
  justify-items: center;
  padding: var(--s-15);
  margin-top: -10px;
  border-radius: 10px 10px 0px 0px;
  box-shadow: none;
}

@media (max-width: 1024px) {
  .single-source-of-truth-tab-individual:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus) {
    border-radius: 0;
    margin: 0;
  }

  #gb-tab-menu-item-4c58ad60{
    border-top-left-radius: 10px;
  }
}

.single-source-of-truth-tab-individual .active-icon{
  display: none;
}

.single-source-of-truth-tab-individual:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus) .default{
  display: none;
}

.single-source-of-truth-tab-individual:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus) .active-icon{
  display: block;
}

.indicator-wrapper {
  position: relative;
  bottom: 14%;
  left: -6%;
  width: 100%;
  height: 3px;
  z-index: 10;
}

.product-screen-indicator-wrapper {
  width: 108%;
  height: 5px;
  position: relative;
  overflow: hidden;
}

.product-screen-indicator-fill {
  height: 110%;
  width: 0%;
  background: linear-gradient(270deg, #6A5BF0 0%, #FD527C 50%, #F6853C 100%);
  position: absolute;
  top: 0;
  left: 0;
  animation: fillBar 7s linear forwards !important;
}

@keyframes fillBar {
  from { width: 0%; }
  to { width: 100%; }
}

/* Success stories carousel */

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-30%);
  }
}

.slider{
  -webkit-transform: translate3d(0, 0, 0);
  will-change: transform;
  animation: scroll linear infinite 90s;
  transition: animation-play-state ease .3s;
  flex-shrink: 0;
  display: flex;
  justify-content: space-around;
  min-width: 100%;
  gap: var(--s-30);
  padding: 0;
}

.slider-team-photos-left{
  animation: scroll linear infinite 50s !important;
}

.slider-team-photos-right{
  animation: scroll-right linear infinite 50s !important;
}

@keyframes scroll-right {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(30%);
  }
}

.slider_slide{
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
}

.slider:hover {
  animation-play-state: paused !important;
}

/* Customer love slider */

.slider-customer-love {
  -webkit-transform: translate3d(0, 0, 0);
  animation: scrollVertical linear infinite 90s;
  will-change: transform;
  transition: animation-play-state ease .3s;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  min-height: 100%;
  gap: var(--s-30);
  padding: 0;
}

.slider-customer-love-down{
  -webkit-transform: translate3d(0, 0, 0);
  animation: scrollVerticalDown linear infinite 90s;
  will-change: transform;
  transition: animation-play-state ease .3s;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  min-height: 100%;
  gap: var(--s-30);
  padding: 0;
}

/* Mobile Scroll */

@media (max-width: 767px) {
  .slider-customer-love{
    animation: scrollVertical linear infinite 60s;
  }

}

@keyframes scrollVerticalDown {
  0% {
    transform: translateY(-50%);
  }
  100% {
    transform: translateY(0%);
  }
}

.customer-love-slide {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  user-select: text;
}

@keyframes scrollVertical {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}

.slider-customer-love:hover, .slider-customer-love-down:hover {
  animation-play-state: paused !important;
}

/* Read more hidden text */

.hidden-info-box p{
  padding-bottom: 20px;
}

.hidden-info-box li{
  font-size: 1.313rem;
}

#more {
  display: none;
}

/* Pricing page */

.highlighted-pricing{
  border: double 2px transparent;
  border-radius: 20px;
  background-image: linear-gradient(white, white), 
  linear-gradient(270deg, #F6843D 0%, #FD527C 49%, #6A5BF0 100%);
  background-origin: border-box;
  background-clip: content-box, border-box;
}

.transition-arrow:hover .gb-shape {
  transform: translateX(5px);
  transition: transform 0.3s ease;
}

.pricing-tabs .gb-tabs__menu-item:is(.gb-block-is-current,.gb-block-is-current:hover,.gb-block-is-current:focus){
  background-color: var(--navy-dark) !important;
  color: var(--white-pure);
}

.pricing-tabs .gb-tabs__menu-item{
  border: 1px solid var(--navy-dark);
  display: block;
  text-align: center;
}

/* Search styling */

.search-form .wp-block-search__input{
 border-radius: 20px;
}

.search-form .wp-block-search__button svg{
  fill: #000 !important;
}

.search-form .wp-block-search__button{
  background-color: transparent;
}

/* Resources styling */

.resource-topic{
  transition: transform .2s;
}

.resource-topic:hover{
  transform: scale(1.03);
}

.resource-category-button span{
  text-decoration: none !important;
  color: var(--black-pure);
}

.resource-category-button:hover span{
  color: var(--green-strong) !important;
}

.post-loop:hover .post-loop-title {
  color: var(--green-strong);
}

.post-category-label{
  color: var(--navy-dark);
  border-radius: 20px;
  background-color: #e6ecf5;
  font-size: 14px;
  font-weight: 500;
  padding: 5px 20px;
}

.post-type-label{
  text-transform: capitalize;
  color: var(--navy-dark);
  border-radius: 20px;
  background-color: #cdf1d5;
  font-size: 14px;
  font-weight: 500;
  padding: 5px 20px;
}