/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

:root {
  /* Headings */
  --h1-fontsize: clamp(36px, 2.7vw, 52px);
  --h2-fontsize: clamp(32px, 2.5vw, 48px);
  --h3-fontsize: clamp(28px, 2.1vw, 42px);
  --h4-fontsize: clamp(24px, 1.7vw, 32px);
  --h5-fontsize: clamp(22px, 1.7vw, 32px);
  --h6-fontsize: clamp(18px, 1.3vw, 26px);
  --h7-fontsize: clamp(12px, 0.96vw, 18px); 

  /* Base Text */
  --txt-sb: clamp(22px, calc(0.6vw + 20px), 28px);
  --txt-r: clamp(18px, 1.14vw, 24px);
  --txt-body: clamp(20px, calc(0.3vw + 19px), 22px);
  --txt-small: clamp(18px, calc(0.2vw + 17px), 18px);

  /* Buttons */
  --btn-1: clamp(18px, 1vw, 20px);
  --btn-2: clamp(18px, calc(0.2vw + 17px), 20px);
  --btn-3: clamp(14px, calc(0.2vw + 13px), 18px);
  --btn-4: 16px;

  /* Menu */
  --menu: clamp(18px, calc(0.0vw + 18px), 16px);
  --menu-2: clamp(18px, calc(0.3vw + 17px), 22px);
  --submenu: clamp(16px, calc(0.2vw + 15px), 20px);
  --caption: clamp(14px, calc(0.2vw + 13px), 16px);

  /* Line heights (using ex for vertical rhythm) */
  --lh-compact: 130%;
  --lh-relaxed: 136%;
  --lh-normal: 120%;
  --lh-button: normal;

  /* Letter spacing */
  --ls-tight: 0.3ex;
  --ls-wide: 0.5ex;
}

h1 {
  font: normal 500 var(--h1-fontsize) / var(--lh-compact) "Bricolage Grotesque", sans-serif!important;
}

h2 {
  font: normal 500 var(--h2-fontsize) / var(--lh-compact) "Bricolage Grotesque", sans-serif!important;
}

h3 {
  font: normal 500 var(--h3-fontsize) / var(--lh-compact) "Bricolage Grotesque", sans-serif!important;
}

h4 {
  font: normal 500 var(--h4-fontsize) / var(--lh-relaxed) "Bricolage Grotesque", sans-serif!important;
}

h5 {
  font: normal 500 var(--h5-fontsize) / var(--lh-relaxed) "Bricolage Grotesque", sans-serif!important;
}

h6 {
  font: normal 500 var(--h6-fontsize) / var(--lh-relaxed) "Bricolage Grotesque", sans-serif!important;
}
.h7 {
  font: normal 500 clamp(14px, 0.95vw, 18px) / 120% "Bricolage Grotesque", sans-serif !important;
}

/* Text Styles - SemiBold */
.txt-sb28 {
  font: normal 600 clamp(22px, 1.5vw, 28px) / var(--lh-compact) "Syne", sans-serif;
}

.txt-sb22 h6{
  font: normal 600 clamp(22px, 1.4vw, 22px) / var(--lh-compact) "Noto Sans", sans-serif!important;
}
.txt-sb22 p{
	font: normal 400 clamp(18px, 1.4vw, 22px) / var(--lh-compact) "Noto Sans", sans-serif!important;
}
/* Text Styles - Regular */
.txt-r28, .txt-r28 .testimonials-text {
  font: normal 400 clamp(20px, 1.2vw, 28px) / var(--lh-compact) "Syne", sans-serif!important;
}

.txt-r24 {
  font: normal 400 clamp(20px, 1.2vw, 24px) / var(--lh-compact) "Syne", sans-serif;
}
/*
.txt-r22 {
  font: normal 400 clamp(18px, 1.4vw, 22px) / var(--lh-compact) "Syne", sans-serif!important;
}
*/
.txt-r22 {
  font: normal 400 clamp(18px, 1.2vw, 22px) / var(--lh-compact) "Noto Sans", sans-serif;
}

/* Text Styles - Medium */
.txt-m24 {
  font: normal 500 clamp(20px, 1.3vw, 24px) / var(--lh-normal) "Bricolage Grotesque", sans-serif;
}

/* Body Text */
.txt-body {
  font: normal 400 clamp(18px, 1.1vw, 20px) / var(--lh-compact) "Noto Sans", sans-serif;
}


/* Regular Text - 18px */
.txt-r18 {
  font: normal 400 clamp(16px, 0.93vw, 18px) / var(--lh-compact) "Noto Sans", sans-serif!important;
}

/* Form Field Text */
.txt-field {
  font: normal 500 clamp(14px, 0.93vw, 18px) / var(--lh-button) Syne, sans-serif!important;
}

/* Button Styles */
.btn-1 {
  font: normal 600 clamp(14px, 1vw, 20px) / var(--lh-button) Syne, sans-serif!important;
}

.btn-2 {
  font: normal 700 clamp(18px, 1.1vw, 20px) / var(--lh-button) Syne, sans-serif;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.btn-3 {
  font: normal 600 clamp(14px, 0.9375vw, 18px) / clamp(normal, 1vw, 22px) "Syne", sans-serif;
  letter-spacing: clamp(-0.14px, 0.02vw, 0.36px);
}

.btn-4, .btn-4 a {
  font: normal 500 clamp(12px, 0.83vw, 16px) / var(--lh-button) Syne, sans-serif!important;
  text-decoration: underline!important;
  text-decoration-style: solid!important;
  text-decoration-skip-ink: none!important;
  text-underline-offset: auto!important;
  text-underline-position: from-font!important;
}

.hero-img-btn{
	transition: background 0.3s ease-in-out;
}

.hero-img-btn:hover{
	background: #E2FF3E!important;
	text-decoration: none!important;
}

/* Menu Styles */
.menu .pp-advanced-menu{
	border-radius: 50px!important;
	background: rgba(33, 34, 62, 0.05)!important;
	padding: 0.5vw 0.8vw!important;
}

.menu li a {
  font: normal 400 clamp(14px, 0.83vw, 16px) / var(--lh-button) "Noto Sans", sans-serif!important;
}

@media (max-width: 1024px) {
	.menu li a {
	  font: normal 400 18px / var(--lh-button) "Noto Sans", sans-serif!important;
	}
}

h6.menu-2 a{
  font: normal 600 clamp(14px, 1.4vw, 22px) / var(--lh-button) "Noto Sans", sans-serif;
	color: #21223E!important;
}
h6.menu-2  a:hover{
	color: #FA6233!important;
}



.submenu a, .submenu {
  font: normal 400 clamp(12px, 1.2vw, 20px) / var(--lh-button) "Mulish", sans-serif!important;
	color: #7B7A8C!important;
}
.submenu a:hover{
	color: #FA6233!important;
}

@media (min-width: 1920px) {
  .submenu {
    font-family: "Mulish", sans-serif;
    font-size: 20px;
  }
}

/* Caption */
.caption {
  font: normal 400 clamp(14px, 0.8vw, 16px) / var(--lh-button) "Mulish", sans-serif!important;
}

/* Utility Classes for Quick Access */
.text-syne { font-family: "Syne", sans-serif; }
.text-noto { font-family: "Noto Sans", sans-serif; }
.text-mulish { font-family: "Mulish", sans-serif; }
.text-bricolage { font-family: "Bricolage Grotesque", sans-serif; }

/* Font Weight Utilities */
.fw-regular { font-weight: 400; }
.fw-medium { font-weight: 500; }
.fw-semibold { font-weight: 600; }
.fw-bold { font-weight: 700; }

/* Line Height Utilities */
.lh-compact { line-height: var(--lh-compact); }
.lh-relaxed { line-height: var(--lh-relaxed); }
.lh-normal { line-height: var(--lh-normal); }
.lh-button { line-height: var(--lh-button); }

a, .fl-button-text{
	transition: all 0.3s ease-in-out!important;
}

.zempleo-btn-blue {
    border: none;
    background: none;
    text-decoration: none;
    transition: all 0.3s ease;
    
    width: 100%;
	padding: 1.2vw;
    aspect-ratio: 517 / 72;
    min-height: 48px;
    max-width: 517px;
    min-width: 200px;
	position: relative;

}
.zempleo-btn-blue:hover svg path, .zempleo-btn-green{
	transition: all 0.3s ease;
}
.zempleo-btn-blue:hover{
	text-decoration: none;
}

.btn-bg{
	position: absolute;
}
.zempleo-btn-blue .fl-module-rich-text{
	margin-left: 1.2vw;
	z-index: 10;
}
.zempleo-btn-blue:hover svg path{
	fill: #FA6233!important;
}

.zempleo-btn-green {
    background: none;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 517 72" preserveAspectRatio="xMidYMid meet" fill="none"><path fill="%23EAFF72" d="M517.04 9.4V62.6C517.04 67.79 512.83 72 507.64 72H454.04C448.85 72 444.64 67.79 444.64 62.6V54.36C444.64 49.56 441.04 45.34 436.25 45.02C431.03 44.67 426.64 48.85 426.64 54V62.6C426.64 67.79 422.43 72 417.24 72H9.4C4.21 72 0 67.79 0 62.6V9.4C0 4.21 4.21 0 9.4 0H417.24C422.43 0 426.64 4.21 426.64 9.4V17.6C426.64 22.67 430.79 27.12 435.86 27C438.25 26.94 440.41 25.95 442 24.36C443.63 22.72 444.64 20.48 444.64 18V9.4C444.64 4.21 448.85 0 454.04 0H507.64C512.83 0 517.04 4.21 517.04 9.4Z"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border: none;
    padding: clamp(0.5rem, 2vw, 1.5rem);
    display: flex;
    align-items: center !important;
    align-content: center !important;
    width: 100%;
    aspect-ratio: 517 / 72;
    min-height: 48px;
    max-width: 517px;
    min-width: 200px;
	transition: all 0.4s ease-in-out;
}
.zempleo-btn-green:hover{
	fill: #E2FF3E!important;
}


@media (max-width: 480px) {
    .zempleo-btn-blue,
    .zempleo-btn-green {
        min-width: 100%;
        padding: clamp(0.3rem, 1.5vw, 1rem);
        min-height: 40px;
    }
}

@media (max-width: 768px) {
    .zempleo-btn-blue,
    .zempleo-btn-green {
        padding: clamp(0.4rem, 1.8vw, 1.2rem);
        min-height: 44px;
    }
}







.hero-green {
  position: relative; 
}

.hero-green::after {
  content: '';
  position: absolute;
  width: 10px;
  height: 23px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="23" viewBox="0 0 10 23" fill="none"><path d="M10 22.25C10 19.4886 7.76142 17.25 5 17.25C2.23858 17.25 0 19.4886 0 22.25V0.75C0 3.51142 2.23858 5.75 5 5.75C7.76142 5.75 10 3.51142 10 0.75V22.25Z" fill="%23EAFF72"/></svg>');
  background-repeat: no-repeat;
  background-size: contain;

  bottom: -16.5px;
  left: 50%; 
  transform: translateX(-50%); 
  z-index: 1; 
}








.zempleo-btn {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 517px;
    margin: 10px 0;
    cursor: pointer;
    transition: transform 0.2s ease;
}




.zempleo-btn svg {
    width: 100%;
    height: auto;
    display: block;
    transition: all 0.3s ease;
}


.zempleo-btn .btn-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 clamp(16px, 3vw, 21px);
    color: white;
    font-weight: 600;
    pointer-events: none;
    z-index: 2;
}


.zempleo-btn .text {
    font-size: clamp(12px, 2.5vw, 16px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.zempleo-btn button {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    opacity: 0;
    z-index: 3;
}

.zempleo-btn:hover svg path,
.zempleo-btn.hover svg path {
    fill: #ff6b47;
}

.zempleo-btn.disabled {
    cursor: not-allowed;
    opacity: 0.8;
}

.zempleo-btn.disabled svg path {
    fill: #e53e3e;
}

.zempleo-btn.disabled:hover {
    transform: none;
}

.zempleo-btn.btn-green {
    
}

.zempleo-btn.btn-green .content {
    color: #21223E; 
}

.zempleo-btn.btn-green .arrow {
    stroke: #21223E; 
}

.zempleo-btn.btn-green svg path {
    fill: #EAFF72;
}

.zempleo-btn.btn-green:hover svg path,
.zempleo-btn.btn-green.hover svg path {
    fill: #E2FF3E;
}



.zempleo-btn.disabled .arrow,
.zempleo-btn.disabled:hover .arrow {
    transform: none !important;
}


@media (max-width: 768px) {
    .zempleo-btn {
        max-width: 100%;
    }
    
    .zempleo-btn .content {
        padding: 0 clamp(12px, 4vw, 20px);
    }

    .zempleo-btn .text {
        font-size: clamp(11px, 3.5vw, 14px);
    }
}


@media (max-width: 480px) {
    .zempleo-btn .text {
        font-size: 12px;
    }
    
    .zempleo-btn .arrow {
        width: 16px;
        height: 16px;
    }
}


.zempleo-btn button:focus {
    outline: 2px solid #0ea5e9;
    outline-offset: 2px;
}

.zempleo-btn.loading {
    pointer-events: none;
}

.zempleo-btn.loading .arrow {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}


.shadow-card{
	box-shadow: 40px 60px 60px 0 rgba(100, 17, 93, 0.06)!important;
}
