/*!
Theme Name: TradeScale
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: tradescale
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

TradeScale is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/

 */


.yellow-txt {
	background: -webkit-linear-gradient(-67deg, #F3981F, #E57625);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.prop-hero {
	position: relative;
	padding: 170px 0 130px 0;
	overflow: hidden;
	position: relative;
	background: url(/wp-content/uploads/2025/10/hero-bg.png) center -30px no-repeat;
}

.prop-hero:before {
   content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 170px; 
    background: url(/wp-content/uploads/2025/10/hero-prop-bg.png) bottom left repeat-x;
}


.prop-hero h1 {
	max-width: 1060px; 
	margin-left: auto;
	margin-right: auto;
}

.prop-hero p {
	max-width: 805px; 
	margin-left: auto;
	margin-right: auto;
}

.prop-hero button {
	padding: 0 40px!important;
	margin-top: 20px!important;
}



.prop-hero .col-content {
	position: relative; 
}

.prop-img {
	position: absolute;
	bottom: 0;
	left: calc(50% - 74px);
	z-index: -10;
}

.prop-hero-item {
	display: flex; 
	align-items: center; 
	gap: 12px; 
}

img.img-glow {
    box-shadow: 0px 2px 21px 0px rgba(243, 152, 31, 0.19);
    border-radius: 100%;
}


img.img-glow-green {
    box-shadow: 0px 2px 21px 0px rgba(88, 198, 58, 0.19);
    border-radius: 100%;
}

.prop-hero h1 {
	font-weight: 600;
	font-size: 70px; 
}

.prop-hero .col-2-ts:last-child {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.prop-logos {
	margin-top:-37px; 
}

.prop-logos .col-content {
	display: flex;
	gap: 24px; 
}

.prop-logos-item {
	width: calc(50% - 12px);
	padding: 20px; 
	border-radius: 10px;
	background: rgba(25,24,23,0.6);
    backdrop-filter: blur(7.9px);
    -webkit-backdrop-filter: blur(7.9px);
    border: 1px solid rgba(116,116,116, 0.4);
}

.prop-logos-item {
	display: flex; 
	align-items: center;
}

.prop-logos-item:first-child > div:nth-child(2) {
	border-left: 1px solid rgba(116,116,116, 0.4); 
	border-right: 1px solid rgba(116,116,116, 0.4); 
}

.prop-logos-item:first-child > div {
	text-align: center;
	width: 33.33%;
	padding: 16px 10px;
}

.prop-logos-item:last-child > div {
	display: flex;
	flex-direction: column;
	gap: 16px; 
}

.prop-logos-item:last-child p {
	border-bottom:  1px solid rgba(116,116,116, 0.4); 
	width: 100%;
	padding-bottom: 8px; 
	text-align: center;
}

.prop-logos-item:last-child div > div {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 20px 37px; 
}

.deal-holder {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.deal-box {
	padding: 17px 16px; 
	display: flex; 
	align-items: center;
	gap: 20px;
	width: 100%;
	border-radius: 12px;
    border-width: 1px;
    border-style: solid;
    background: linear-gradient(#161514, #161514) padding-box, linear-gradient(124deg, #F3981F 0%, rgba(116, 116, 116, 0.2) 49%, rgba(255, 255, 255, 0.2) 100%) border-box;
    border: 1px solid transparent;
}

.shorter-grid {
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
}

.stripe-line {
	height: 330px;
	width: 100%;
	background: url(/wp-content/uploads/2025/03/line-bg.png) center center no-repeat;
}

.prop-lp .swiper-slide.swiper-slide-active .testimonial-card .int-title {
	font-size: 20px;
}

.prop-how .col-content {
    padding: 60px 48px 80px 48px;
    position: relative;
    border-radius: 50px;
    border-width: 1px;
    border-style: solid;
    background: linear-gradient(#161514, #161514) padding-box, linear-gradient(0deg, #58C63A 0%, rgba(116, 116, 116, 0.2) 49%, rgba(255, 255, 255, 0.2) 100%) border-box;
    border: 1px solid transparent;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}

.prop-how .col-content:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 400px;
    background: linear-gradient(180deg, rgba(88, 198, 58, 0), rgba(88, 198, 58, 0.2));
	border-radius: 0 0 50px 50px;
}

.prop-how .col-content div:last-child {
	position: relative;
	z-index: 10;
}

.prop-how-item {
	position: relative; 
	padding-left: 46px; 
	border-left:  1px solid rgba(116,116,116, 0.4); 
	padding-bottom: 70px; 
	margin-left: 30px; 
}


.prop-how-item:last-child {
	border-left: none; 
	padding-bottom: 0;
}

.prop-how-item img {
	position: absolute;
	top: -11px;
	left:-30px; 
} 


.prop-table {
	padding-top: 100px; 
	border-radius: 50px 50px 0 0;
	background: url(/wp-content/uploads/2025/10/prop-bg.png) top left repeat-x;
}

.table-bottom {
	text-align: center;
}

.prop-pricing-table {
  overflow-x: auto;
}

.prop-pricing-table table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  color: #fff;
  font-family: 'Arial', sans-serif;
}

.prop-pricing-table th,
.prop-pricing-table td {
  padding: 19px 16px;
	font-size: 16px;
  border: 1px solid rgba(255,255,255,0.1);
	    font-family: "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-weight: 400;
}

.prop-pricing-table thead th {
  font-weight: 600;
  border: none;
	 padding-top: 8px;
    padding-bottom: 16px;
}

.prop-pricing-table table {
  border-collapse: separate;
  border-spacing: 0; /* removes the gaps */
}

.prop-pricing-table thead .logo-col {
  background: rgba(229,118,37, 0.1);
  color: #ff9900;
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
	 border-left: 1px solid #F3981F;
	 border-right: 1px solid #F3981F;  
	 border-top: 1px solid #F3981F; 
}

.prop-pricing-table tbody td:first-child {
  text-align: left;
  font-weight: 500;
	padding-left: 32px;
}

.prop-pricing-table tbody td:nth-child(2) {
  border-left: 1px solid #F3981F; 
	border-right: 1px solid #F3981F; 
	background: rgba(229,118,37, 0.1);
	font-weight: 600;
}


.prop-pricing-table table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

/* wrap tbody with a gradient border */
.prop-pricing-table tbody {
  position: relative;
  border-radius: 24px;
  overflow: hidden; /* clip rows inside */
  margin-top: 0; /* sit just under thead */
}

.prop-pricing-table tbody::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  padding: 2px; /* border thickness */
  background: linear-gradient(180deg, rgba(255,255,255, 0.2), rgba(116,116,116, 0.2), #F3981F);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  z-index: -1;
}

.limited {
	margin-top: 164px;
}

.limited .col-content {
	padding: 120px 40px 80px 40px;
	position: relative;
	border-radius: 50px; 
	border: 1px solid rgba(255,255,255,0.4);
}

.limited img {
	position: absolute;
	left: calc(50% - 91px);
	top: -91px;
}

.avl-cp {
	display: inline-block;
	font-size: 120px;
	padding: 32px 48px;
	border: 1px solid rgba(255,255,255,0.4); 
	border-radius: 24px;
	font-weight: 500;
}

#claim {
	padding: 170px 0 160px 0;
	background: url(/wp-content/uploads/2025/10/claim-bg.png) center center no-repeat;
}



.prop-pricing-table tbody tr:last-child td:nth-child(2) {
	border-bottom: 1px solid #F3981F; 
}

.prop-pricing-table tbody tr:first-child td:first-child {
  border-top-left-radius: 24px;
}

.prop-pricing-table tbody tr:first-child td:last-child {
  border-top-right-radius: 24px;
}

.prop-pricing-table tbody tr:last-child td:first-child {
  border-bottom-left-radius: 24px;
}

.prop-pricing-table tbody tr:last-child td:last-child {
  border-bottom-right-radius: 24px;
}


.prop-faq {
	background: linear-gradient(90deg, rgba(36,36,36, 1), rgba(32,37,26, 1));
	border-radius: 50px 50px 0 0;
	padding-top: 100px;
}

.accordion {
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  transition: 0.4s;
}

.prop-acc-item {
	padding: 20px 24px;
	border: 1px solid #8B827C; 
	border-radius: 12px; 
	background: rgba(25,24,23,0.4);
}

.prop-acc-item button, .prop-acc-item button:hover {
	position: relative;
	width:100%;
	font-size: 18px; 
	color: #E3E0E0; 
	font-weight: 500;
	padding-top: 0;
	padding-bottom: 0; 
	padding-left: 0;
	background: transparent;
	border-bottom: 1px solid transparent!important;
}

.prop-acc-item button img {
	position: absolute;
	right: 0;
	top: 7px; 
	transition: 0.3s;
	transform: rotate(180deg);
}


.prop-acc-item button.active img {
	transform: rotate(0deg);
}

.prop-accordion  button.active {
  border-bottom: 1px solid #8B827C!important;
	padding-bottom: 19px; 
}

.panel {
  padding: 20px 0;
  display: none;
	font-size: 16px;
  color:#B3AFA9;
  overflow: hidden;
}

.prop-prefooter {
	display: flex;
	align-items: center;
	justify-content: center; 
	gap: 32px; 
	padding: 18px 16px;
	    border-top: 1px solid #747474 !important;
}


/* responsive */


@media only screen and (max-width: 992px) {

	.prop-topbar {
		font-size: 16px; 
	}
	
	.prop-topbar span {
		font-size: 20px; 
	}
	
	.prop-hero {
		padding-top: 140px;
		padding-bottom: 0; 
	}
	
	.prop-hero h1 {
		font-size: 40px;
	}
	
	.prop-hero .col-2-ts:last-child {
		padding: 0;
	}
	
	.prop-logos {
		margin-top: 0; 
	}
	
	.prop-logos .col-1-ts {
		padding: 0;
	}
	
	.prop-logos .col-content {
		flex-direction: column;
		gap: 0;
	}
	
	.prop-logos-item {
		width: 100%;
	}
	
	.prop-logos p {
		font-size: 13px; 
	}
	
	.interviews .row-ts:last-child {
		height: auto; 
		margin-bottom: 60px; 
	}
	
	.prop-how .col-1-ts {
		padding: 0; 
	}
	
	.prop-how .col-content {
		padding: 40px 20px 40px 40px; 
	}
	
	.prop-prefooter img {
		max-width: 100%;
	}
	
	.prop-prefooter {
		text-align: center;
		gap: 10px;
		flex-direction: column;
	}
	
	.header-cta {
		display: block;
	}
	
	.headr-cta .cta {
		min-width: 180px; 
		font-size: 16px; 
	}
	
}