:root{
	--gray: #F7F7F7;
	--textColor: #64748b;
	--text: #071223;
	--white: #FFFFFF;
	--gray2: #9AA6AB;
    --accent: #2563eb;
    --accent-light: #D1FAE5;
    --border: #E2E8F0;
    --green: #10b981;
    --blue: #2563eb;
    --bg: #f8fafc;
    --grad: linear-gradient(135deg, #031B34, #062D54);
    --blue-light: #EEF5FF;
    --ink: #07162F;
    --r: 14px;
    --r2: 18px;
    --sh: 0 2px 14px rgba(7, 22, 47, .07);
    --shh: 0 8px 32px rgba(7, 22, 47, .13);
        --bgl: #EEF5FF;
        --gold: #F5A400;    
    --blue2: #0047CC;    
    --red: #EF4444;
}

/*------------------------------------*\
    MAIN
\*------------------------------------*/

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {
	font-size:62.5%;
}
body {
	font:400 16px/1.6  'Inter', sans-serif;
	background-color:#fff;
	color: var(--textColor);
}
/* clear */
.clear:before,
.clear:after {
    content:' ';
    display:table;
}

.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
a {
	color:inherit;
	text-decoration:none;
	transition:all .3s ease;
}
a:hover {
	/*text-decoration: underline;*/
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
textarea:focus,
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}
h1,h2,h3,h4,h5,h6{
	font-weight: normal;
	font-family: 'Inter', sans-serif;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/* wrapper */
.wrapper {
	max-width:100%;
	width:100%;
	margin:0 auto;
	position:relative;
}
.container{
	width: 1200px;
	max-width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding: 0 24px;
}
main{
	min-height: 100vh;
}
.blog-container{
	display: flex;
	justify-content: center;
	padding: 0 24px 36px;
	gap:16px;
}
.blog-container .col:last-child,
.blog-container .col:first-child{
	flex: 1 1 0;
}
.blog-container .col:nth-child(2){
/*	width: 688px;*/
	width: 985px;
	min-width: 688px;
}
.blog-container .col:last-child{
	display: flex;
	justify-content: flex-end;
	align-items: flex-start;
}
.blog-container .col .inner{
	position: sticky;
	top: 95px;
}
.btn{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border: none;
	background: none;
	padding:0 28px;
	border-radius: 10px;
	height: 36px;
	font-size: 15px;
	font-weight: 600;
	transition:all .3s ease;
	cursor: pointer;
	gap:8px;
	font-family: 'Inter',sans-serif;
}
.btn svg{
	margin-right: 12px;
}
.btn-black{
	background-color: #000;
	color: #fff;
}
.btn-gray{
	background-color: var(--gray2);
	color: #fff;
}
.btn-gray:hover{
	background-color: #000;
}
.btn-green{
	background-color: var(--accent);
	color: #fff;
}
.btn-green:hover{
	background: #1d4ed8;

}
.btn-white{
	background-color: #fff;
	color: var(--text);
	border: 1px solid #e2e8f0;
}
.btn-white:hover{
    border-color: #0ea5e9;
    color: #0ea5e9;
}
.d-flex{
	display: flex;
} 
.a-center{
	align-items: center;
} 
.j-between{
	justify-content: space-between;
}
/* header */
.header {
	position: sticky;
	top: 0;
	padding: 12px 0;
	border-bottom: 1px solid #e2e8f0;
	z-index: 10;
	background: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
.header .blog-container .col:last-child{
	align-items: center;
}
#searchform-wrap{
	margin-left: auto;
}
.search{
	display: flex;
	border-radius: 8px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	height: 36px;
	padding: 6px 12px;
}
.search input{
	border: none;
	background: transparent;
	width: 100%;
	display: block;
	padding: 0 12px;
}
.search button{
	border: none;
	background: transparent;
	padding: 0;
	order: -1;
}
/* logo */
.logo {
	display: flex;
	align-items: center;
}
.logo-img {
	width: 170px;
}
.header .d-flex{
	gap:32px;
}
/* nav */
.header .menu {
	list-style-type: none;
	padding: 0;
	margin: 0;
	display: flex;
	font-size: 14px;
	font-weight: 500;
	gap:28px;
	font-family: 'Inter', sans-serif;
}
.header .menu li a{
	display: flex;
	padding: 3px 0;
	text-decoration: none;
	transition: all .3s ease;
	border-bottom: 1px solid transparent;
}
.header .menu li a:hover{
	color: var(--text);
    border-bottom-color: var(--accent);
}

.outside_block {
  overflow: hidden;
  pointer-events: none;
}
.outside_block iframe{
	width: 115% !important;
}
/* sidebar */
.sidebar {

}
/* footer */
.footer {
	padding: 48px 0 24px;
	background: #031b34;
    color: rgba(255,255,255,.45);
}
.footer .box{
	background-color: rgba(255,255,255,.5);
	border-radius: 24px;
	padding: 56px 16px;
}
.footer .logo{
	align-items: flex-start;
	flex-direction: column;
	gap:12px;
}
.footer .logo p{
	font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
    line-height: 1.6;
    max-width: 430px;
}
.footer .menu{
	display: flex;
	justify-content: center;
	list-style-type: none;
	margin: 0;
	padding: 0;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 120%; /* 21.6px */
	letter-spacing: -0.54px;
}
.footer .menu>li>a{
	color: rgba(255, 255, 255, 0.65);
	text-transform: uppercase;
	font-size: 13px;
	margin-bottom: 14px;
}
.footer .menu>li+li{
	margin-left: 40px;
}
.footer .menu>li>ul{
	list-style-type: none;
	margin: 0px 0 0;
	padding: 0;
}
.footer .menu>li>ul li{
	margin-bottom: 8px;
}
.footer .menu>li>ul li span{
	display: none;
}
.footer .menu>li>ul li a{
	display: block;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.65);
    transition: color 0.2s;
}
.footer .d-flex{
	gap: 40px;
    margin-bottom: 40px;
}
.copyright{
	width: 100%;
	padding: 24px 0 0;
	margin-top: 100px;
	display: flex;
	justify-content: space-between;
	font-size: 13px;
    color: rgba(255, 255, 255, 0.4);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.copyright p{
	margin: 0;
}
.copyright p:last-child{
	max-width: 600px;
	font-size: 12px;
}
.copyright .links{
	margin: 0 auto;
}
header .links{
  margin-right: 25px;
}
/*------------------------------------*\
    FRONT PAGE
\*------------------------------------*/
.section-intro{
	/*background: linear-gradient(135deg, #F0FDF9 0%, #E0F2FE 50%, #F8FAFC 100%);*/
	background-image: url(../img/intro-bg_3.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 72px 0 64px;
}
.intro-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #EFF6FF;
    color: var(--accent);
    font-size: 13px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 100px;
    margin-bottom: 24px;
    font-family: 'Inter', sans-serif;
    border: 1px solid #BFDBFE;
}
.intro-badge::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #BFDBFE;
}
.intro-title{
	font-size: 52px;
    font-weight: 800;
    line-height: 1.15;
    color: var(--text);
    margin:0 0 16px;
    letter-spacing: -1px;
    font-family: 'Inter', sans-serif;
}
.intro-title span{
	color: var(--accent);
}
.hero-stats {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 48px;
    padding-top: 32px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    width: 520px;
    max-width: 100%;
}
.hero-stat {
    position: relative;
    padding-left: 39px;
}
.hero-stat strong {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 1px;
}
.hero-stat span {
	display: block;
    font-size: 11px;
}
.hero-stat .icon{
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
    height: 30px;
    background: #EFF6FF;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hero-stat .icon svg{
	width: 14px;
    height: 14px;
    stroke: var(--accent);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.intro-btns{
	display: flex;
	justify-content: flex-start;
	gap:12px;
	flex-wrap: wrap;
}
.section-intro p{
    font-size: 19px;
    color: #64748b;
    margin: 0 0 36px;
    line-height: 1.55;
}
.section-top-broker{
	background-color: #f8fafc;
	padding: 64px 0;
}
.brokers-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 16px;
}
.broker-card {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: box-shadow 0.2s, transform 0.2s;
    position: relative;
}
.broker-card:hover {
	box-shadow: 0 4px 24px rgba(26,26,46,0.12);
	transform: translateY(-2px);
}
.broker-card:nth-child(1){
	border: 2px dashed #e6c34d;
    background: linear-gradient(180deg, #fffdf5 0%, #fff 40%);
}
.broker-card:nth-child(2){
	border: 2px dashed #b0b8c1;
    background: linear-gradient(180deg, #f8f9fb 0%, #fff 40%);
}
.broker-card:nth-child(3){
	border: 2px dashed #d4956a;
    background: linear-gradient(180deg, #fdf8f3 0%, #fff 40%);
}
.broker-card.featured {
 border-color: var(--accent);
 box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.12);
}

.broker-head {
 display: flex;
 align-items: center;
 gap: 12px;
}

.broker-logo {
 width: 44px;
 height: 44px;
 border-radius: 10px;
 display: flex;
 align-items: center;
 justify-content: center;
 font-family: 'Inter', sans-serif;
 font-size: 14px;
 font-weight: 800;
 color: white;
 flex-shrink: 0;
 overflow: hidden;
}

.broker-name {
 font-family: 'Inter', sans-serif;
 font-weight: 700;
 font-size: 16px;
}

.broker-type {
 font-size: 13px;
 color: var(--text3);
}

.broker-badge {
 font-family: 'Inter', sans-serif;
 font-size: 11px;
 font-weight: 700;
 padding: 3px 8px;
 border-radius: 6px;
 margin-left: auto;
 flex-shrink: 0;
}

.badge-top {
 background: #FEF3C7;
 color: #92400E;
}

.badge-reg {
 background: var(--accent-light);
 color: #065F46;
}

.stars {
 display: flex;
 align-items: center;
 gap: 6px;
}

.stars-icons {
 display: flex;
 gap: 2px;
}

.star {
 width: 14px;
 height: 14px;
 fill: #E2E8F0;
}

.star.checked {
 fill: #F59E0B;
}

.stars-score {
 font-family: 'Inter', sans-serif;
 font-size: 15px;
 font-weight: 700;
 color: var(--text);
}

.stars-count {
 font-size: 12px;
 color: var(--text3);
}

.broker-desc {
 font-size: 14px;
 color: var(--text2);
 line-height: 1.5;
}

.broker-tags {
 display: flex;
 flex-wrap: wrap;
 gap: 6px;
}

.tag {
 font-size: 12px;
 background: var(--bg2);
 color: var(--text2);
 padding: 3px 8px;
 border-radius: 6px;
 border: 1px solid var(--border);
}

.broker-footer {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding-top: 10px;
 border-top: 1px solid var(--border);
}

.broker-min {
 font-size: 13px;
 color: var(--text3);
}

.broker-min strong {
 color: var(--text);
 font-weight: 600;
}

.btn-review {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 600;
	padding: 7px 14px;
	border-radius: 8px;
	background: var(--accent-light);
	color: #065F46;
	border: none;
	cursor: pointer;
	transition: all 0.2s;
	text-decoration: none !important;
}
.btn-review:before{
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
}

.btn-review:hover {
 background: var(--accent);
 color: white;
}

.broker-rank {
 font-family: 'Inter', sans-serif;
 font-size: 12px;
 color: var(--text3);
 display: flex;
 align-items: center;
 gap: 4px;
}

.rank-num {
 font-size: 16px;
 font-weight: 800;
 color: var(--text);
}
.section-header{
	position: relative;
	margin-bottom: 36px;
}
.section-header .link{
	position: absolute;
	right: 0;
	bottom: 0;
	display: flex;
	font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--accent);
    gap: 4px;
    white-space: nowrap;
}
.section-title{
	font-family: 'Inter',sans-serif;
	font-size: 28px;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}
.section-title span{
	color: var(--accent);
}
.section-subtitle{
	font-size: 14px;
	margin: 5px 0 0;
	color: #718096;
}
.section-articles{
	padding: 64px 0;
}

.about-section {
    background: linear-gradient(135deg, #F0FDF9 0%, #F8FAFC 100%);
    padding: 64px 0;
}
.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.about-text h2 {
  font-size: 34px;
  font-weight: 800;
  margin: 0 0 16px;
  color: var(--text);
}
.about-text h2 span{
	color: var(--accent);
}

.about-text p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 16px;
}

.about-authors {
  display: flex;
  gap: 20px;
  margin-top: 28px;
}

.author-card {
  background: white;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  box-shadow: 0 2px 12px rgba(26,26,46,0.08);
}

.author-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: white;
}

.author-name {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
}

.author-role {
  font-size: 12px;
  color: #718096;
}

.author-exp {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
}

.about-features {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.feature-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  background: white;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 2px 12px rgba(26,26,46,0.08);
}

.feature-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.feature-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: white;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.feature-text h4 {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 4px;
  color: var(--text);
}

.feature-text p {
  font-size: 14px;
  color: var(--text2);
  line-height: 1.5;
  margin: 0;
}


.section-main-columns{
	padding: 48px 0;
	background: var(--bg);
}
.section-main-columns .columns{
	display: grid;
    grid-template-columns: 1fr 320px;
    gap: 36px;
    align-items: start;
}

.section-main-columns .section-title{
	font-size: 20px;
	font-weight: 800;
    letter-spacing: -.4px;
    margin-bottom: 20px;
}
.section-main-columns  .link{
	font-size: 14px;
    font-weight: 600;
    color: var(--blue);
    display: flex;
    align-items: center;
    gap: 4px;
}
.section-main-columns .posts-list{
	border-top: 1px solid var(--border);
    padding-top: 40px;
}
.col-sidebar {
    position: sticky;
    top: 80px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sb-snapshot {
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 16px;
    padding: 16px 18px;
    box-shadow: 0 2px 16px rgba(7, 18, 35, .06);
}

.snap-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.snap-title {
    font-size: 13px;
    font-weight: 800;
    color: var(--text);
    text-transform: uppercase;
    letter-spacing: -.1px;
}

.snap-live {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    color: #065F46;
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
    padding: 2px 9px;
    border-radius: 20px;
}

.snap-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #10b981;
    animation: pulse_second 2s infinite;
}

.snap-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.snap-item {
    background: #f8fafc;
    border-radius: 9px;
    padding: 10px 12px;
    border: 1px solid #e2e8f0;
}

.snap-pair {
    font-size: 10px;
    font-weight: 600;
    color: var(--textColor);
    margin-bottom: 3px;
}

.snap-price {
    font-size: 15px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -.3px;
    line-height: 1;
}

.snap-change {
    font-size: 11px;
    font-weight: 600;
    margin-top: 3px;
}

.snap-up {
    color: #10B981;
}

.snap-dn {
    color: #ef4444;
}
@keyframes pulse_second{0%,100%{opacity:1}50%{opacity:.35}}

.top-brokers{
	background: #fff;
    border: 1.5px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(7, 18, 35, .06);
}
.top-brokers-header{
	position: relative;
    padding: 16px 18px 12px;
    border-bottom: 1px solid var(--border);
}
.top-brokers-header a{
	position: absolute;
	right: 18px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 12px;
	font-weight: 600;
	color: var(--accent);
}
.top-brokers-header h2{
    font-size: 13px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -.1px;
    text-transform: uppercase;
    margin: 0;
}
.top-brokers-header p{
	font-size: 11px;
    color: var(--textColor);
    margin: 1px 0 0;
    display: flex;
    gap:5px;
    align-items: center;
}
.top-brokers-header p::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--green);
    display: inline-block;
    animation: pulse 2s infinite;
}
.top-brokers-list .broker-item{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 10px 18px;
    position: relative;
    border-bottom: 1px solid var(--border);
}
.top-brokers-list .broker-item a{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
}
.top-brokers-list .broker-item .rank {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background: #f1f5f9;
    color: var(--textColor);
    font-size: 11px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.top-brokers-list .broker-item .logo {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    border: 1.5px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 800;
    flex-shrink: 0;
}
.top-brokers-list .broker-item .logo img{
	width: 100%;
	height: 100%;
	object-fit: cover;
    border-radius: 9px;
}
.top-brokers-list .broker-item .info{
	flex:1;
	min-width: 0;
}
.top-brokers-list .broker-item .info .name{
	font-size: 13px;
    font-weight: 700;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.top-brokers-list .broker-item .info .domain{
    font-size: 10px;
    color: var(--textColor);
    margin-top: 1px;
}
.top-brokers-list .broker-item .right{
	text-align: right;
    flex-shrink: 0;
}
.top-brokers-list .broker-item .right .score{
	font-size: 16px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -.5px;
    line-height: 1;
}
.top-brokers-list .broker-item .right .stars{
	font-size: 9px;
    color: #fbbf24;
    letter-spacing: .5px;
    margin-top: 2px;
}
.for-beginners{
	border-top: 1px solid var(--border);
    padding-top: 40px;
    margin-bottom: 48px;
}
.section-main-columns .faq-block{
	border-top: 1px solid var(--border);
    padding-top: 40px;
}
.section-main-columns .faq-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -.4px;
    margin-bottom: 7px;
    text-align: center;
}

.section-main-columns .faq-sub {
    font-size: 14px;
    text-align: center;
}

.section-main-columns .faq-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 32px;
}

.section-main-columns .faq-item {
    border-bottom: 1px solid var(--border);
}

.section-main-columns .faq-item:first-child {
    border-top: 1px solid var(--border);
}

.section-main-columns .faq-q {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 4px;
    background: transparent;
    border: none;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: color .15s;
}

.section-main-columns .faq-q:hover {
    color: var(--blue);
}

.section-main-columns .faq-q.open {
    color: var(--blue);
}

.section-main-columns .faq-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    transition: transform .25s ease, stroke .15s;
}

.section-main-columns .faq-q.open .faq-icon {
    transform: rotate(180deg);
    stroke: var(--blue);
}

.section-main-columns .faq-a {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .28s ease;
}

.section-main-columns .faq-a.open {
    grid-template-rows: 1fr;
}

.section-main-columns .faq-a-inner {
    overflow: hidden;
    font-size: 14px;
    line-height: 1.72;
    padding: 0 4px;
}

.section-main-columns .faq-a.open .faq-a-inner {
    padding-bottom: 18px;
}

/* FAQ CTA */
.faq-cta {
    margin-top: 36px;
    background: var(--bg);
    border: 1.5px solid var(--border);
    border-radius: 16px;
    padding: 28px 32px;
    text-align: center;
}

.faq-cta-title {
    font-size: 18px;
    font-weight: 800;
    color: var(--text);
    margin-bottom: 6px;
    letter-spacing: -.3px;
}

.faq-cta-text {
    font-size: 14px;
    margin-bottom: 20px;
}

.faq-cta-btns {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.faq-cta-btn-p {
    font-size: 14px;
    font-weight: 700;
    padding: 11px 24px;
    background: var(--blue);
    color: #fff;
    border-radius: 9px;
    border: none;
    transition: background .15s;
}


.faq-cta-btn-s {
    font-size: 14px;
    font-weight: 600;
    padding: 11px 24px;
    background: transparent;
    color: var(--text);
    border-radius: 9px;
    border: 1.5px solid var(--border);
    transition: all .15s;
}

.faq-cta-btn-s:hover {
    border-color: var(--blue);
    color: var(--blue);
}


.bft-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 28px;
}

/* Vertical card */
.bft-card {
    display: flex;
    flex-direction: column;
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: 16px;
    padding: 22px 20px 18px;
    text-decoration: none;
    transition: box-shadow .22s, transform .22s, border-color .2s;
    cursor: pointer;
    min-height: 196px;
    position: relative;
}
.bft-card a{
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.bft-card:hover {
    box-shadow: 0 10px 32px rgba(37, 99, 235, .1);
    transform: translateY(-2px);
    border-color: #BFDBFE;
}

/* Top row: icon + number */
.bft-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 14px;
}

.bft-icon-wrap {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bft-icon-wrap svg {
    width: 20px;
    height: 20px;
}

.bft-icon-blue {
    background: #EFF6FF;
}

.bft-icon-purple {
    background: #EDE9FE;
}

.bft-icon-green {
    background: #ECFDF5;
}

.bft-icon-amber {
    background: #FEF3C7;
}

.bft-icon-pink {
    background: #FCE7F3;
}

.bft-num {
    font-size: 13px;
    font-weight: 800;
    color: var(--border);
    letter-spacing: -.3px;
    line-height: 1;
    padding-top: 4px;
}

.bft-card-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 7px;
    letter-spacing: -.2px;
}

.bft-card-desc {
    font-size: 13px;
    color: var(--textColor);
    line-height: 1.55;
    flex: 1;
}

/* Footer */
.bft-card-footer {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
    font-size: 12px;
    font-weight: 600;
    color: var(--textColor);
    transition: color .2s;
}

.bft-card-footer svg {
    width: 13px;
    height: 13px;
    transition: transform .2s;
    flex-shrink: 0;
}

.bft-card:hover .bft-card-footer {
    color: var(--blue);
}

.bft-card:hover .bft-card-footer svg {
    transform: translateX(4px);
}

/* CTA card #6 */
.bft-card-cta {
    background: linear-gradient(145deg, #F0F7FF, #EEF2FF);
    border-color: #C7D2FE;
}

.bft-card-cta:hover {
    border-color: var(--blue);
}

.bft-card-cta .bft-card-title {
    color: var(--blue);
}

.bft-footer-cta {
    color: var(--blue);
    font-weight: 700;
    font-size: 13px;
}

.bft-card-cta:hover .bft-footer-cta {
    color: var(--blue2);
}

@media(max-width:900px) {
    .bft-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media(max-width:600px) {
    .bft-grid {
        grid-template-columns: 1fr;
    }
}

/*------------------------------------*\
    PAGES
\*------------------------------------*/
.posts-list{
	display: grid;
	grid-template-columns: repeat(4,1fr);
	grid-gap: 18px;
}
.posts-list.short{
    margin-bottom: 48px;
}
.posts-list+.posts-list{
	margin-top: 24px;
}
.posts-list .two-col{
	grid-column: span 2;
	font-size: 0;
}
.posts-list article + div.two-col{
	grid-column: span 3;
}
.posts-list .two-col img{
	width: 100%;
}
.posts-list .two-col a{
	display: block;
}
.posts-list .post{
	display: flex;
	flex-direction: column;
	background: white;
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    transition: box-shadow 0.2s, transform 0.2s;
}
.posts-list .post:hover{
	box-shadow: 0 4px 24px rgba(26,26,46,0.12);
    transform: translateY(-2px);

}
/*.posts-list .post:nth-child(1){
	grid-row: span 2;
	grid-column: span 2;
}
.posts-list .post:nth-child(1) img{
	height: 280px;
}
.posts-list .post:nth-child(2),
.posts-list .post:nth-child(3){
	flex-direction: row;
}
.posts-list .post:nth-child(2) .thumb span,
.posts-list .post:nth-child(3) .thumb span,
.posts-list .post:nth-child(2) p,
.posts-list .post:nth-child(3) p,
.posts-list .post:nth-child(2) .post-footer,
.posts-list .post:nth-child(3) .post-footer{
	display: none;
}
.posts-list .post:nth-child(2) .thumb,
.posts-list .post:nth-child(3) .thumb{
	width: 120px;
	min-width:120px;
	height: 100%;
}
.posts-list .post:nth-child(2) .thumb img,
.posts-list .post:nth-child(3) .thumb img{
	height: 100%;
}
*/

.post-main{
	padding: 14px 16px 16px;
	height: 100%;
	display: flex;
	flex-direction: column;
}
.post-footer{
	padding: 12px 20px;
    border-top: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.post-footer a{
	font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
}
.post-footer .views{
	font-size: 12px;
	color: #718096;
}
.posts-list .post .thumb{
	display: block;
	position: relative;
	font-size: 0;
}
.posts-list .post .thumb span{
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
	font-size: 10px;
	text-transform: uppercase;
	padding: 3px 9px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: #d1fae5;
	color: #065F46;
	border: none;
	font-weight: 700;
    letter-spacing: .05em;
    max-width: calc(100% - 20px);
}
.posts-list .post img{
	/*border-radius: 24px;*/
	width: 100%;
	height: 190px;
	/*aspect-ratio: 1;*/
	object-fit: cover;
}
.posts-list.short .post img{
  height: 140px;
}
.posts-list .post .thumb svg{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.posts-list .post h2{
	margin: 0 0 8px;
	font-family: 'Inter';
	font-size: 16px;
	line-height: 1.4;
	font-weight: 700;
	color: var(--text);
}
.posts-list.short .post h2{
	font-size: 14px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.35;
    margin-bottom: 8px;
    letter-spacing: -.1px;
}
.posts-list .post p{
	margin: 0 0 14px;
	font-size: 14px;
    line-height: 1.55;
    color: var(--textColor);
}
.posts-list.short .post p{
	display: none;
}
.posts-list .post .meta{
	margin-top: auto;
	color: #718096;
	font-size: 11px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.posts-list .post .meta .comments{
	margin-left: 24px;
	display: flex;
	align-items: center;
}
.posts-list .post .meta .comments svg{
	margin-right: 4px;
}
.posts-list .post .meta .likes{
	margin-left: 15px;
	display: flex;
	align-items: center;
	font-size: 0;
	cursor: pointer;
	display: none;
}
.posts-list .post .meta .views{
	margin-left: 15px;
}
.add-bookmark{
	display: flex;
	align-items: center;
	margin-left: 15px;
	font-size: 0;
	cursor: pointer;
}
.add-bookmark svg{
	width: 20px;
	height: auto;
	fill: var(--gray2)
}
.posts-list .post .meta .views svg,
.posts-list .post .meta .likes svg{
	width: 16px;
	height: auto;
	fill: var(--gray2)
}
.add-bookmark.active svg,
.posts-list .post .meta .likes.active svg{
	fill: var(--textColor)
}
.posts-list .post .meta .views span,
.posts-list .post .meta .likes span{
	font-size: 12px;
	margin-left: 3px;
}


#loadmore{

}
#loadmore .btn{
	width: 100%;
}
.categories{
/*	margin-bottom: 56px;*/
}
.themes ul,
.categories .menu{
	list-style-type: none;
	margin: 0;
	display: flex;
	flex-flow: column;
	padding: 0;
	min-width: 320px;
	max-width: 100%;
/*	max-height: 55vh;*/
	overflow-y: auto;
}
.themes ul li a,
.categories .menu li a{
	display: flex;
	align-items: center;
	padding: 8px;
	border-radius: 12px;
	/*font-size: 18px;*/
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 120%; /* 21.6px */
	letter-spacing: -0.54px;
}
.themes ul li a span, 
.categories .menu li a span{
	display: flex;
	/*color: var(--white);*/
	color: var(--gray2);
	min-width: 24px;
	width: 24px;
	height: 24px;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	line-height: 1;
	margin-left: auto;
	border-radius: 4px;
}
.themes ul li a:hover,
.categories .menu li a:hover{
	background-color: rgba(255, 255, 255, 1);
}
.themes ul li.active a,
.themes ul li a:hover{
	color: var(--gray2)
}
.themes h2{
	margin: 0 0 16px;
	font-weight: normal;
	line-height: 95%; /* 22.8px */
	letter-spacing: -0.72px;
	font-size: 24px;
}
.themes ul li a img,
.categories .menu li a img{
	min-width: 30px;
	margin-right: 12px;
	transform: scale(1);
}
.themes ul li a:hover img,
.categories .menu li a:hover img{
	animation: pulse2 1s ease infinite;
	transform: translatey(0px);
}
.categories .menu{
	display: flex;
	flex-flow: wrap;
	gap:4px;
	margin-bottom: 16px;
}
.categories .menu li{

}
.categories .menu li a{
	display: flex;
	padding: 0 12px;
	height: 32px;
	font-size: 12px;
	border-radius: 8px;
	background: rgba(154, 166, 171, 0.10);
	white-space: nowrap;
}
.categories .menu li a.active,
.categories .menu li a:hover{
	background: rgba(154, 166, 171, 0.40);
}
@keyframes pulse2 {
	0% {
		transform: translatey(2px);
	}

	70% {
		transform: translatey(0px);
	}

	100% {
		transform: translatey(2px);
	}
}
.blog-container .col:last-child .box, 
.blog-container .col:first-child .box{
	background-color: var(--white);
	border-radius: 12px;
	padding: 32px 24px;
	margin-bottom: 8px;
}
.blog-container .col:last-child .inner{
	width: 336px;
}
.blog-container .col:last-child .box h2{
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: 95%; /* 22.8px */
	letter-spacing: -0.72px;
	margin: 0 0 8px;	
}
.top-broker li{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.blog-container .col:last-child .box p{
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 120%; /* 16.8px */
	letter-spacing: -0.42px;
	margin: 0 0 16px;
	color: var(--gray2);
}
.blog-container .col:last-child .box ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	max-height: 300px;
}
.scrollbar-style {
  scrollbar-width: thin;
  scrollbar-color: #000 var(--gray);
}
.scrollbar-style:-webkit-scrollbar-track {
  background: var(--gray);
}
.scrollbar-style::-webkit-scrollbar {
  	background-color: var(--gray);
  	width: 4px;
  	border-radius: 4px;
}

.scrollbar-style::-webkit-scrollbar-thumb {        
  background-color: #000;
  	width: 4px;
  	border-radius: 4px;
}
.page-content{
	border-top: 1px solid var(--border);
	padding: 64px 0;
}
.page-content .inner{
	width: 720px;
	max-width: 100%;
}

.blog-container .col:last-child .box ul li+li{

}
.blog-container .col:last-child .box ul li a{
	display: flex;
	align-items: center;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 120%; /* 21.6px */
	letter-spacing: -0.54px;
	padding: 5px;
	border-radius: 12px;
}
.blog-container .col:last-child .box ul li a:hover{
	background-color: var(--gray);
}
.blog-container .col:last-child .box ul li a img{
	min-width: 40px;
	margin-right: 12px;
}

#breadcrumbs{
	font-size: 13px;
  color: var(--border);
  position: relative;
  z-index: 1;
}
#breadcrumbs a{
	color: var(--textColor);
}
#breadcrumbs .breadcrumb_last{
  color: var(--ink);
}
.single-page .box{
	background-color: var(--white);
	padding: 24px;
	border-radius: 16px;
	margin-bottom: 16px;
}
.blog-container .col:last-child .box,
.sbb{
	margin-bottom: 16px;
}
.blog-container .col:last-child .box{
	transition: .3s ease;
	/*box-shadow: 0px 5px 30px rgba(137, 158, 180, 0.3);*/
}
.single-page .post-meta{
	display: flex; 
	align-items: center;
}
.single-page .post-meta .tag{
	margin-right: 60px;
	display: flex;
	align-items: center;
}
.single-page .post-meta .author{
	margin-right: 16px;
	display: flex;
	align-items: center;
}
.single-page .post-meta .author img{
	width: 32px;
	height: 32px;
	border-radius: 16px;
	min-width: 32px;
	margin-right: 12px;
	object-fit: cover;
}
.single-page .post-meta .date{
	color: var(--gray2);
}
.single-page h1{
	margin: 0 0 32px;
	font-size: 24px;
	line-height: 95%; /* 22.8px */
	letter-spacing: -0.72px;
}
.single-page.account h1{
	margin-bottom: 0;
}
.single-page+section{
	margin-top: 40px;
}
.post-details{
	display: flex;
	align-items: flex-start;
	font-size: 12px;
	margin-top: 32px;
	flex-wrap: wrap;
}
.post-details .author{
	display: flex;
	margin-right: 40px;
}
.post-details .author div:first-child{
	min-width: 32px;
	width: 32px;
	height: 32px;
	margin-right: 12px;
}
.post-details .author div:first-child img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}
.post-details .author span{
	color: var(--gray2)
}

.share,
.comments-count{
	color: var(--gray2);
	margin-right: 24px;
	display: flex;
	align-items: center;
}
.share svg,
.comments-count svg{
	vertical-align: middle;
	margin-right: 5px;
}

.post-details .likes svg{
	width: 20px;
	height: 20px;
	fill: var(--gray2)
}
.post-details .likes.active svg{
	fill: var(--textColor)
}
.post-details .likes{
	margin-left: auto;
	cursor: pointer;
}
.post-details .likes svg,
.post-details .add-bookmark svg{
	margin-right: 7px;
}
.post-details .likes,
.post-details .add-bookmark{
	display: flex;
	align-items: center;
	color: var(--gray2);
	font-size: 12px;
}
.post-details .likes span{
	margin-left: 4px;
}

.blog-container .col:last-child .box ul.discussed{
	max-height: none;
	margin-top: 32px;
}
.blog-container .col:last-child .box ul.discussed li{
	display: flex;
	align-items: center;
	letter-spacing: -0.42px;
}
.blog-container .col:last-child .box ul.discussed li a{
	padding: 0;
}
.discussed li h3{
	margin: 0 0 0 12px;
}
.blog-container .col:last-child .box ul.discussed li h3 a{
	font-size: 14px;
}
.discussed li+li{
	margin-top: 16px;
}
.discussed li picture,
.discussed li img{
	width: 56px;
	height: 56px;
	border-radius: 28px;
	min-width: 56px
}
.blog-container .col:last-child .box ul.discussed li h3 a:hover{
	opacity: .9;
	background: none;
}

/*.single-page h1 span,
.single-page h2 span,
.single-page h3 span,
.single-page h4 span,
.single-page h5 span,
.single-page h6 span{
	display: inline-flex;
	border-radius: 6px;
	justify-content: center;
	align-items: center;
	background-color: var(--gray);
	width: 24px;
	height: 24px;
	margin-right: 11px;
	font-size: 14px;
	vertical-align: bottom;
}*/
body {
  counter-reset: section;
}

/*.single-page .box:not(.comments) h2::before {
	display: inline-flex;
	border-radius: 6px;
	justify-content: center;
	align-items: center;
	background-color: #5e696f;
	color: #fff;
	width: 24px;
	height: 24px;
	margin-right: 11px;
	font-size: 14px;
	vertical-align: bottom;
  	counter-increment: section;
  	content: counter(section); 
}*/
.single-page .box img{
	border-radius: 10px
}
.single-page .box .user-avatar img{
	border-radius: 12px;
	width: 100px;
	height: 100px;
	object-fit: cover;
}
.single-page .box blockquote{
	margin: 12px 0;
	padding: 12px 14px;
	background: #f7fafa;
    border-left: 3px solid #2ecc8b;
    border-radius: 8px;
}
.single-page table{
	width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    margin: 12px 0;
}
.single-page table th {
    background: #dff5ec;
    color: #1a2530;
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    border-bottom: 1px solid #2ecc8b;
}
.single-page table td {
    padding: 10px 12px;
    border-bottom: 0.5px solid #eef3f4;
    color: #4a5560;
}
.single-page ul{
	padding-left: 20px;
}
.single-page ul li::marker {
  color: #2ecc8b;
}

.comments h2{
	font-size: 24px;
	margin: 0 0 24px;
}
.comments>ul{
	list-style-type: none;
	margin: 34px 0 0;
	padding: 0;
}
.comments>ul ul{
	list-style-type: none;
	margin:0;
}
.post .box a {
  text-decoration: underline;
}
.post .box a:hover {
	text-decoration: none;
}
.comment-author{
	display: flex;
	align-items: center;
}
.comment-author>picture>img,
.comment-author>img{
	width: 32px;
	height: 32px;
	object-fit: cover;
	min-width: 32px;
	margin-right: 12px;
	border-radius: 16px;
}
.comment-author .date{
	font-size: 12px;
	color: var(--gray2);
}
.comment-edit-link{
	margin-left: auto;
	color: var(--gray2);
	font-size: 12px;
}
.comment-body>p {
	padding-left: 44px;
}
.reply{
	padding-left: 44px;
	font-size: 12px;
	letter-spacing: -0.36px;
	color: var(--gray2)
}
.comments ul li{
	margin-top: 26px;
}
.comments>ul>li:first-child{
	margin-top: 0;
}
#comment{
	display: block;
	width: 100%;
	background-color: var(--gray);
	border-radius: 12px;
	padding: 16px 15px;
	letter-spacing: -0.42px;
	height: 100px;
	resize: none;
	border: none;
}
.comment-form input[type=text]{
	display: block;
	width: 100%;
	background-color: var(--gray);
	border-radius: 12px;
	padding: 16px 15px;
	letter-spacing: -0.42px;
	border: none;

}
.comment-form input[type=submit]{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border: none;
	background: none;
	padding: 0 16px;
	border-radius: 12px;
	height: 46px;
	font-size: 14px;
	letter-spacing: -0.42px;
	transition:all .3s ease;
	background-color: var(--gray2);
	color:#fff;
	width: 250px;
}
.comment-form input[type=submit]:hover{
	background-color: #000;
}




.current_user{
	display: flex;
	align-items: center;
	font-size: 14px;
}
.current_user .avatar{
	font-size: 0;
	margin-right: 12px;
}
.current_user .avatar img{
	border-radius: 12px;
	width: 46px;
	height: 46px;
	object-fit: cover;
}

.profile-form{
	width: 300px;
	max-width: 100%;
	margin-top: 40px;
}
.profile-form input[type=text]{
	display: block;
	width: 100%;
	background-color: var(--gray);
	border-radius: 12px;
	padding: 16px 15px;
	letter-spacing: -0.42px;
	border: none;
}
.profile-form .user-avatar p{
	margin-left: 30px;
}
.profile-form .user-avatar input{
	visibility: hidden;
	position: absolute;
}
.profile-form .user-avatar label{

}
.profile-form .btn-black{
	width: 100%;
	margin-top: 30px;
}

/*------------------------------------*\
    Modal
\*------------------------------------*/

.modal,
.modal-box {
  z-index: 900;
}

.modal-sandbox {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: transparent;
}

.modal {
  display: none; 
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgb(0,0,0);
  background: rgba(0,0,0,.8);
  overflow: auto;
}

.modal-box {
  position: relative;
  width: 350px;
  max-width: 90%;
  margin: 100px auto;
  animation-name: modalbox;
  animation-duration: .4s;
  animation-timing-function: cubic-bezier(0,0,.3,1.6);
}

.modal-header {
  padding: 20px 40px;
  background: #546E7A;
  color: #ffffff;
}

.modal-body {
  background: #FFFFFF;
  padding: 32px;
  border-radius: 24px;
  position: relative;
}

/* Close Button */
.close-modal {
  position: absolute;
  top: 16px;
  right: 16px;
  cursor: pointer;
}
.close-modal:hover path{
	fill: #000
}
.modal-title{
	font-size: 24px;
	line-height: 95%; /* 22.8px */
	letter-spacing: -0.72px;
	margin-bottom: 12px;
}
.modal-body input[type=password],
.modal-body input[type=text]{
	display: block;
	width: 100%;
	background-color: var(--gray);
	color: var(--textColor);
	border-radius: 12px;
	padding: 16px 15px;
	letter-spacing: -0.42px;
	border: none;
}
.modal-body input.invalid{
	border: 1px solid red;
}
.modal-body .btn{
	width: 100%;
}
.modal-body p{
	color:var(--gray2);
}
.modal-body p.error{
	color: red;
}
.modal-body p a{
	color: var(--textColor);
}
.modal-body p:last-child{
	margin-top: 24px;
}

/* Animation */
@-webkit-keyframes modalbox {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes modalbox {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.content_profile.blog-page{
	position: relative;
}
.blogs-page .session .cover_block {
  display: flex;
  justify-content: space-between;
}
.blogs-page .session .cover_block .left_side_select {
  width: 120px;
}
.blogs-page .view_holder {
  color: var(--textColor);
}
.blogs-page .view_holder {
  margin-bottom: 20px;
  cursor: pointer;
  font-weight: 700;

}
.blogs-page .view_holder span{
	position: relative;
	font-weight: normal;
	text-decoration: underline;
	display: inline-block;
	margin-top: 10px;
	animation: pulse 2s ease infinite;
}


.blogs-page .list_holder {
  max-height: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
  display: none;
  scrollbar-color: var(--textColor) transparent;
  scrollbar-width: thin;
}
.blogs-page .list_holder ul {
  list-style: none;
  color: var(--textColor);
  padding-left: 10px;
}
.blogs-page .list_holder ul li {
  margin-bottom: 20px;
  cursor: pointer;
  color: var(--textColor);
  font-size: 15px;
  transition: .3s ease;
}
.blogs-page .list_holder ul li:hover{
	text-decoration: underline;
}
.blogs-page .session .cover_block .right_content {
  width: calc(100% - 150px);
  color: var(--textColor);
}
.blogs-page .session .top_block {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.blogs-page .session .top_block div:first-child {
  width: 17%;
}
.blogs-page .session .top_block div {
  width: 27%;
  padding-right: 5px;
  font-weight: 700;
  color: var(--textColor);
}
.blogs-page .session .cont_block_row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--gray);
}
.blogs-page .session .cont_block_row div:first-child {
  width: 17%;
}
.blogs-page .session .cover_block .right_content p:last-child {
  margin-bottom: 0;
}
.blogs-page .session .cont_block_row div {
  width: 27%;
  padding-right: 5px;
  white-space: nowrap;
}
.blogs-page .session .cover_block .right_content p {
  margin-bottom: 10px;
}
.blogs-page .data_block {
  display: none;
}
.blogs-page .data_block.active {
  display: block;
}

.top-block{
	font-size: 0;
}
.top-block img{
	width: 100%;
	height: auto;
}
.top-block .mob-img{
	display: none;
}
@media screen and (max-width: 1023px) {
	.top-block .desctop-img{
		display: none;
	}
	.top-block .mob-img{
		display: block;
	}
}
.lcol-inner{
	border-radius: 24px;
	background: var(--white);
	padding: 32px 13px;
}
.lcol-inner>.title{
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 24px;
	margin-bottom: 24px;
	line-height: 95%; /* 22.8px */
	letter-spacing: -0.72px;
	padding: 0 8px;
}
.lcol-inner>.title span{
	font-size: 12px;
	width: 24px;
	height: 24px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.section-news .section-title{
	margin-bottom: 0;
}
.news-categories{
	list-style-type: none;
	margin: 0 0 0 16px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}
.news-categories li{
	margin-right: 4px;
	margin-bottom: 4px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 16px;
	height: 42px;
	cursor: pointer;
	font-size: 14px;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.40);
	transition: background .3s ease;
}
.news-categories li:hover,
.news-categories li.active{
	background: var(--white);
}
.news-list{
	margin-top: 17px;
	margin-bottom: 32px;
}
.news-list article{
	margin: 0 0 16px;
}
.news-list article h3{
	margin: 0;
	font-size: 14px;
}
.tradingview-widget-container{
	margin-bottom: 32px;
}

/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/

@font-face {
	font-family:'Font-Name';
	src:url('fonts/font-name.eot');
	src:url('fonts/font-name.eot?#iefix') format('embedded-opentype'),
		url('fonts/font-name.woff') format('woff'),
		url('fonts/font-name.ttf') format('truetype'),
		url('fonts/font-name.svg#font-name') format('svg');
    font-weight:normal;
    font-style:normal;
}

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/


/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}

.header-btn{
	background: none;
	padding: 6px;
	border: none;
	font-size: 0;
}
.show-mob-menu--js{
	margin-right: -6px;
	position: relative;
	height: 25px;
	width: 36px;
}
.show-mob-menu--js span{
	position: absolute;
	background-color: #000;
	width: 24px;
	height: 2px;
	left: 6px;
	/*transform-origin: 30% 50%;*/
	transition: transform .3s ease;
}
.show-mob-menu--js span:first-child{
	top: 8px;
}
.show-mob-menu--js span:last-child{
	top: 15px;
}

.show-mob-menu--js.active span:first-child{
	top: 12px;
	transform:rotate(45deg);
}
.show-mob-menu--js.active span:last-child{
	top: 12px;
	transform:rotate(-45deg);
}
.no-scroll{
	overflow: hidden;
}
.mob-navbar{
	display: none;
	position: fixed;
	top: 65px;
	left: 0;
	width: 100%;
	height: calc(100vh - 65px);
	padding: 0 12px;
	background-color: rgba(255, 255, 255, 0.95);;
	z-index: 11;
}
.mob-navbar .inner{
	display: flex;
	align-items: center;
	justify-content: space-around;
}
.mob-navbar .menu{
	list-style-type: none;
	font-size: 24px;
}

.broker-info .d-flex{
	justify-content: space-between;
}
.broker-info .column{
	width: calc(33.333% - 20px);
}
.broker-info .column:first-child,
.broker-info .column:nth-child(3){
	padding-top: 46px;
}
.broker-info .item{
	margin: 0 0 20px;
}
.broker-info .item .progress{
	position: relative;
	overflow: hidden;
	height: 20px;
	background-color: #eee;
	margin-top: 5px;
	border-radius: 3px;
}
.broker-info .item .progress span{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: #000;
}
.broker-info .col-title{
	font-size: 22px;
	text-align: center;
}
.broker-info .rating-val{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	aspect-ratio:1;
	background-color: #eee;
	font-size: 70px;
	margin: 20px auto 0;
	border-radius: 50%;
	max-width: 300px 
}
.broker-info .btn{
	width: 100%;
}

.broker-header{
	display: flex;
	gap:20px;
	justify-content: space-between;
}
.broker-header .rating{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
    padding: 8px 16px;
    min-width: 120px;
    background: #f7fafa;
    border-radius: 14px;
}
.rating-stars{
	color: #f5b71d;
    font-size: 16px;
    line-height: 1;
}
.broker-header .rating-stars{
	margin-bottom: 6px;
}
.broker-header .r_val{
	font-size: 36px;
    font-weight: 500;
    color: #1a2530;
    line-height: 1;
}
.broker-header .r_val span{
	display: block;
	font-size: 11px;
    color: #7a8590;
    margin-top: 2px;
    font-weight: normal;
}
.broker-header .rating p{
	font-size: 9px;
    color: #9ba5af;
    line-height: 1.3;
    margin-top: 8px;
}
.broker-header .title{
	position: relative;
	padding-left: 66px;
}
.broker-header .title img{
	position: absolute;
	width: 52px;
	height: 52px;
	top: 0;
	left: 0;
	object-fit: cover;
	border: 0.5px solid #e2eaed;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    border-radius: 12px
}
.broker-header .title h1{
	font-size: 24px;
    font-weight: 500;
    color: #1a2530;
    line-height: 1.3;
    margin: 0;
}
.broker-header .title p{
	font-size: 14px;
    color: #7a8590;
    margin: 2px 0 0;
}
.broker-header .title .subtitle{
	font-size: 14px;
}

.broker-stats{
	display: grid;
	grid-template-columns: repeat(5,1fr);
	grid-gap: 10px;
	margin-bottom: 16px;
}
.broker-stats .item{
	background: #fff;
    border-radius: 14px;
    padding: 14px 10px;
    text-align: center;
}
.broker-stats .item .count{
	font-size: 24px;
    font-weight: 500;
    color: #1a2530;
}
.broker-stats .item .progress{
	position: relative;
	height: 4px;
    background: #eaf2f4;
    border-radius: 2px;
    margin: 8px 0;
    overflow: hidden;
}
.broker-stats .item .progress span{
	display: block;
	position: absolute;
	border-radius: 2px;
	height: 100%;    
	top: 0;
	left: 0;
	background-color: #2ecc8b;
}
.broker-stats .item .key{
    font-size: 14px;
    color: #7a8590;
}

.broker-features{
	display: grid;
	grid-template-columns:1fr 1fr;
	grid-gap: 10px;
	margin-bottom: 16px;
}
.broker-features>div{
	background-color: var(--white);
    padding: 24px;
    border-radius: 16px;
}
.broker-features .title{
	font-size: 16px;
    font-weight: 500;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #1a2530;
}
.broker-features .title .icon{
	width: 24px;
    height: 24px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.broker-features .list{
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.broker-features .list li:not(:last-child){
	border-bottom: 0.5px solid #eef3f4;
}
.broker-features .list li{
	font-size: 14px;
    color: #4a5560;
    padding: 7px 0;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.45;
}
.broker-features .list li span{
	flex-shrink: 0;
    font-size: 14px;
    font-weight: 500;
    width: 14px;
    text-align: center;
}
.broker-features .list li span.red{
	color: #c93838;
}
.broker-features .list li span.green{
	color: #1a8a5f;
}

.info-item{
	background-color: var(--white);
    border-radius: 16px;
    margin-bottom: 16px;
}
.ii-header{
	padding: 14px 24px;
    border-bottom: 0.5px solid #eef3f4;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ii-header .title{
    font-weight: 500;
    color: #1a2530;
}
.ii-header .rating{
    font-weight: 500;
    color: #2ecc8b;
    background: #dff5ec;
    padding: 3px 10px;
    border-radius: 12px;
}
.ii-body{
	padding: 24px;
}
.ii-body p{
	margin: 0 0 16px;
}
.ii-body ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2,1fr);
	gap: 6px;
}
.ii-body ul li{
	display: flex;
    justify-content: space-between;
    font-size: 14px;
    padding: 6px 12px;
    background: #f7fafa;
    border-radius: 8px;
}
.ii-body ul li span:first-child{
	color: #7a8590;
}
.ii-body ul li span:last-child{
	color: #1a2530;
    font-weight: 500;
}


.calltoaction{
	display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.calltoaction .title{
	margin: 0;
	font-size: 24px;
	color: #1a2530;
    font-weight: 500;
    line-height: 1.1;
}
.calltoaction p{
	margin: 10px 0 0;
    line-height: 1.1;
}

.box-header{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
}
.box-header .title{
	font-weight: 500;
	color: #1a2530;
}
.box-header .d-flex{
	gap:8px;
}
.box-header .rating-stars{
	letter-spacing: 1px;
}

.reviews .item{
	padding: 14px 0;
}
.reviews .item:not(:last-child) {
    border-bottom: 0.5px solid #eef3f4;
}
.reviews .item .item-header{
	display: flex;
    align-items: center;
    margin-bottom: 6px;
    gap:10px;
}
.reviews .item .item-header .rating-stars{
	margin-left: auto;
	letter-spacing: 1px;
}
.reviews .item .item-header .ava{
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 500;
    color: #fff;
}
.reviews .item .item-header .name{
	font-weight: 500;
    color: #1a2530;
}
.reviews .item .text{
	font-size: 14px;
}
.box.content{
	border-left: 3px solid #2ecc8b;
}

@media screen (max-width: 1600px){
	.posts-list .post h2{
		font-size: 16px;
	}
}
@media screen and (min-width:1200px) {
	.visble-mob{
		display: none;
	}	
}
@media screen and (max-width: 1441px) {
	.blog-container .col:nth-child(2){
		width: 930px;
	}
}
@media screen and (max-width: 1439px) {
	.blog-container .col:nth-child(2){
		width: 850px;
	}
	.posts-list{
	    grid-template-columns: repeat(2,1fr);
	}
	.broker-info .rating-val{
		font-size: 50px;
	}
}
@media screen and (max-width: 1350px) {
	.blog-container .col:nth-child(2){
		width: 600px;
		min-width: 600px
	}
	.themes ul, .categories .menu,
	.blog-container .col:last-child .inner{
		width: auto;
	}
}
@media screen and (max-width: 1199px) {
	.container{
		padding: 0 16px;
	}
	.posts-list article + div.two-col{
		grid-column: span 2;
	}
	header .links{
	  margin-right: 10px;
	  order: -1;
	}
	header .links a{
		display: inline-block;
		width: 26px;
		height: auto;
	}
	.broker-info .d-flex{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.broker-info .column{
		max-width: 100%;
		width: 300px;
	}
	.broker-info .column:first-child,
	.broker-info .column:nth-child(3){
		padding-top: 30px;
	}
	.broker-info .column:nth-child(2){
		order: -1
	}
	#upBtn{
		display: none;
	}
	.blog-container{
		padding: 0 12px;
	}
	.header .blog-container .col:nth-child(2){
		padding: 0 12px;
		width: 100%;
		min-width:0;
		position: absolute;
		top: 100%;
		left: 0;
		background-color: var(--gray);
		display: none;
	}
	.header .search{
		margin: 0 0 12px;
	}
	.current_user{
		order: -1;
		margin-right: 20px;
		font-size: 12px;
	}
	.current_user .avatar{
		margin-right: 6px;
	}
	.current_user .avatar img{
		width: 26px;
		min-width:26px;
		height: 26px;
		border-radius: 4px;
	}
	.header .blog-container .col:last-child .btn{
		order: -1;
		font-size: 0;
		margin-right: 20px;
		height: 34px;
	}
	.header .blog-container .col:last-child .btn svg{
		margin-right: 0;
	}
	main .blog-container{
		flex-direction: column;
	}
	main .blog-container .col:first-child{
		position: fixed;
		top: 59px;
		left: 0;
		height: 100%;
		display: none;
		width: 100%;
		background-color: var(--gray);
		z-index: 11;
		overflow: auto;
	}
	main .blog-container .col:first-child .inner{
		padding: 20px 12px 0;
		position: static;
	}
	.section-news>.d-flex{
		flex-wrap: wrap;
		margin-top: 20px;
	}
	.news-categories{
		margin: 0;
	}
	.section-news .section-title{
		width: 100%;
		margin-bottom: 15px;
	}
	main .blog-container .col:nth-child(2){
		width: 100%;
		min-width:0;
	}
	.themes ul, .categories .menu, .blog-container .col:last-child .inner{
		width: 100%;
	}
	main .blog-container .col:last-child .inner{
		display: flex;
		flex-wrap: wrap;
		gap:16px;
	}
	main .blog-container .col:last-child .box, .sbb{
		flex: auto;
	}
	.footer .blog-container .col:last-child{
		display: none;
	}
	.footer .blog-container .col:nth-child(2){
		width: auto;
		min-width:0;
	}
	.footer .menu>li+li{
		margin-left: 50px;
	}
	.brokers-grid{
		grid-template-columns: repeat(3,1fr);
	}
	#searchform-wrap{
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		display: none;
		background: #fff;
		padding: 0 16px;
	}
	.header .menu{
		display: none;
	}
	.header .logo{
		margin-right: auto;
	}
	.section-header{
		padding-right: 130px;
	}
}
@media screen and (max-width: 1023px) {
	.brokers-grid{
		grid-template-columns: repeat(2,1fr);
	}
	.about-grid{
		grid-template-columns: 1fr;
	}
	.broker-header{
		flex-direction: column;
	}
	.broker-stats{
		grid-template-columns: repeat(3,1fr);
	}
	.broker-features{
		grid-template-columns: 1fr;
	}
	.ii-body ul{
		grid-template-columns: 1fr;
	}
	.calltoaction{
		flex-direction: column;
		text-align: center;
	}
}
@media screen and (max-width: 767px) {
	.add-bookmark{
		display: none;
	}
	.posts-list .post .meta .views{
		margin-right: 10px;
	}
	.blogs-page .session .cover_block .right_content{
		width: 100%;
	}
	.left_side_select{
		position: absolute;
		right: -14px;
    top: -48px;
	}
	#upBtn{
		display: none !important;
	}
	.footer .blog-container{
		flex-direction: column;
	}
	.posts-list {
	    grid-template-columns: repeat(2,1fr);
	    grid-row-gap: 32px;
	    grid-column-gap: 10px;
	}
	.posts-list .post h2{
		font-size: 18px;
		margin: 8px 0 5px;
	}
	.posts-list .post .meta .likes{
		display: none;
	}
	.posts-list .post .meta .comments{
		margin-left: 15px;
	}
	.posts-list .post .meta{
		font-size: 12px;
	}
	.posts-list .two-col{
		grid-column: span 1;
	}
	.footer .menu{
		flex-wrap: wrap;
		justify-content: space-between;
		margin-right: -15px;
		margin-left: -15px;
	}
	.footer .menu>li{
		margin-left: 15px;
		margin-right: 15px;
	}
	.footer .menu>li+li{
		margin-left: 15px;
	}
	.copyright{
		flex-direction: column;
		margin-top: 50px;
	}
	.footer .menu>li>ul li{
		margin-bottom: 10px;
	}
	.footer .menu>li>ul{

	}
	.logo-img {
		width: 120px;
	}
	.header{
		padding: 7px 0;
	}
	.header .btn{
		padding: 0 16px;
		font-size: 12px;
		white-space: nowrap;
	}
	main .blog-container .col:first-child{
		top: 49px;
	}
	.post-details .author{
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}
	.single-page .box{
		padding: 15px;
		border-radius: 12px;
	}
	.single-page .box img{
		border-radius: 12px;
	}
	.posts-list,
	.brokers-grid{
		grid-template-columns: repeat(1,1fr);
	}
	.hero-stats{
		gap:16px;
		line-height: 1.2;
	}
	.hero-stat strong{
		font-size: 20px;
	}
	.section-intro,
	.about-section,
	.section-articles,
	.section-top-broker{
		padding: 36px 0;
	}
	.intro-title{
		font-size: 44px;
	}
	.section-intro p{
		font-size: 16px;
	}
	.section-title{
		font-size: 24px;
		line-height: 1.2;
	}
	.section-subtitle{
		font-size: 12px;
	}
	.about-authors{
		gap:8px;
	}
	.author-card{
		padding: 8px;
	}
	.mob-navbar{
		top: 49px;
		height: calc(100vh - 49px);
	}
	.footer .d-flex{
		flex-direction: column;
	}
	.box-header{
		flex-direction: column;
	}
}

.cr-exchange-rates.shortcode-exchange-rates-badge{
	display: flex;
	flex-wrap: wrap;
	margin-right: -5px;
	margin-left: -5px;
}
.cr-exchange-rates.shortcode-exchange-rates-badge .cr-exchange-rates{
	display: none;
}
.cr-exchange-rates.shortcode-exchange-rates-badge .badge-leaders{
	width: calc(20% - 10px);
	margin: 0 5px 10px;
	min-width: 120px;
}
.cr-exchange-rates.shortcode-exchange-rates-badge .badge-leaders span+span{
	text-align: left;
}
.currency-index{
	margin-bottom: 32px;
}
.currency-index .cr-exchange-rates.shortcode-exchange-rates-badge .badge-leaders span+span,
.currency-index .cr-exchange-rates.shortcode-exchange-rates-badge .badge-leaders span:first-child{
	flex:0 !important;
}
@media screen and (max-width: 767px) {
	.blogs-page .session .cover_block .left_side_select {
	  width: 95px;
	}
	.blogs-page .view_holder{
		margin-bottom: 0;
	}
	.blogs-page .list_holder{
		background-color: var(--gray);
	}

	.currency-index{
		margin-bottom: 12px;
		display:none;
	}
	.cr-exchange-rates.shortcode-exchange-rates-badge .badge-leaders{
		font-size: 11px;
		min-width:0;
		width: calc(33.333% - 10px);
	}
}
@media screen and (max-width: 500px) {
	.current_user .name{
		display: none;
	}
	.current_user{
		margin-right: 0;
	}
}
@media screen and (max-width: 480px) {
	.blogs-page .session .top_block div:nth-child(3){
		width: 17%;
	}
	.blogs-page .session .cont_block_row div:nth-child(3){
		width: 17%;
	}
	.blogs-page .session .top_block div{
		font-size: 12px;
	}
	.blogs-page .session .cover_block .right_content{
		font-size: 12px;
	}
	.blogs-page .session .cover_block .right_content p{
		margin-bottom: 10px;
	}
}


/*.currency-index{
	display: none;
}*/

.pre-img{
	max-width: 70px;
	display: block;	
}

#upBtn{
	position: fixed;
	bottom: 30px;
	left: 275px;
	margin-left: -52px;
	z-index: 10;
	width: 52px;	
	height: 52px;	
	background-color: var(--white);
	font-size: 0;	
	cursor: pointer;
	border-radius: 30px;
	border: 2px solid var(--gray2);
}
/*#upBtn.full{
	background-color: var(--textColor);
}*/
.pb {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}
/*#upBtn.full .pb svg{
	fill: var(--white)
}*/
#upBtn>svg{
	position: absolute;
	left: -2px;
	top: -2px;
	width: 52px;
	height: 52px;
	transform: rotate(-90deg);
}
#upBtn>svg>circle{
	width: 100%;
	height: 100%;
	fill: none;
	stroke: black;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-dasharray: 157px;
  	stroke-dashoffset: calc(157px - (157px * var(--percent)) / 100);
}
#upBtn.full>svg>circle{
	stroke: black
}
.cover_outside_block{
	 position: relative;
}
.cover_outside_block picture:first-child{
	position: absolute;
	left: 50%;
	top: 30px;
	transform: translate(-50%,0);
	opacity: 0;
	transition: .3s ease;
}
.cover_outside_block picture:last-child{
}
.cover_outside_block .img_ico{
	position: absolute;
	right: 15px;
  top: 30px;
	width: 40px;
	cursor: pointer;
	animation: pulse 2s infinite;
	z-index: 2;
	border-radius: 50%;
}
@keyframes pulse {
	0% {
		transform: scale(0.9);
		box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
	}

	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
	}

	100% {
		transform: scale(0.9);
		box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
	}
}
.cover_outside_block .img_ico:hover + p picture:first-child{
	opacity: 1;
}
/*костыли*/
#menu-bottom-menu > li > a[href="#"]{
	display: none;
}
/*#menu-item-423{
	opacity: 0;
	pointer-events: none;
}*/
/**/
.rating-stars i.rated:after,
#stars-rating-review .br-widget a.br-active:after,
#stars-rating-review .br-widget a.br-selected:after{
	color: var(--textColor)
}
.name_comment_author {
  font-weight: 700;
}
.comment-body{
	position: relative;
}
.comment_star_rating{
	position: absolute;
	right: 0;
	top: 0;
	margin-top: 0;
}
.comment-edit-link{
	margin-top: 15px;
}
.reply{
	text-align: right;
}
.reply a{
	text-decoration: underline;
	color: var(--textColor);
}
.reply a:hover{
	text-decoration: none;
}
/*порядок меню в Темах*/

.themes ul li[data-attr="brokery"]{
	order: 0;
}
.themes ul li[data-attr="otzivi-o-brokerah"]{
	order: 1;
}
.themes ul li[data-attr="strategii"]{
	order: 2;
}
.themes ul li[data-attr="indikatory"]{
	order: 3;
}
.themes ul li[data-attr="svechnie-paterny"]{
	order: 4;
}
.themes ul li[data-attr="torgovie-sessii"]{
	order: 5;
}
.themes ul li[data-attr="risk-i-mani-menedjment"]{
	order: 6;
}
.themes ul li[data-attr="dnevnik-treidera"]{
	order: 7;
}
.themes ul li[data-attr="martingeil-i-dogon"]{
	order: 8;
}
.themes ul li[data-attr="geometriya-v-traidinge"]{
	order: 9;
}
.themes ul li[data-attr="vischiy-kurs"]{
	order: 10;
}
.themes ul li[data-attr="pro-dengi"]{
	order: 11;
}
.themes ul li[data-attr="poleznoe"]{
	order: 15;
}


#newPostForm form p{
	margin: 0 0 20px;
}
#newPostForm form p label{
	font-size: 16px;
}
#newPostForm .wpcf7-form-control-wrap{
    margin-top: 7px;
    display: block;
}
#newPostForm form p label textarea,
#newPostForm form p label input{	
	display: block;
	width: 100%;
	background-color: var(--gray);
	border: none;
    padding: 0 16px;
    border-radius: 12px;
    height: 46px;
    font-size: 14px;
    letter-spacing: -0.42px;
}
#newPostForm form p label textarea{
	resize: none;
	height: 500px;
	padding: 16px;
}
.codedropz-upload-inner{
	opacity: 0.6;
}
#newPostForm form .btn{
	width: 200px;
}

.blog-container .col .inner>.btn{
	width: 100%;
	margin-top: 20px;
}
.wpcf7 form .wpcf7-response-output{
	border-radius: 12px;
	padding: 16px;
	font-size: 18px;
	margin-right: 0;
	margin-left: 0;
}

#post-404{
	display: flex;
	flex-flow: column;
	justify-content: center;
	height: 600px;
}
.box.top-broker{
	background: none;
	padding: 0;
}
@media screen and (min-width: 1024px) {
	.brokers-grid.only-top{
		grid-template-columns: repeat(3,1fr);
	}	
}
.brokers-grid-header{
	margin-bottom: 24px;
	padding-left: 50px;
	background-image: url(../img/star.svg);
	background-repeat: no-repeat;
	background-position: left center;
}
.brokers-grid-header h3{
	margin: 0;
	font-weight: 500;
}
.brokers-grid-header p{
	margin: 0;
}



/*  ---------PAGE ABOUT--------- */

.page-about section{
	padding: 64px 0;
}
.section-white{
	background:var(--white)
}
.section-gray {
    background: var(--bg);
}
.au-hero {
    background: linear-gradient(150deg, #EFF6FF 0%, #DBEAFE 30%, #F8FAFC 70%, #fff 100%);
    padding: 72px 0 80px;
    border-bottom: 1px solid var(--border)
}

.au-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #EFF6FF;
    border: 1px solid #BFDBFE;
    color: var(--blue);
    font-size: 11px;
    font-weight: 700;
    padding: 5px 14px;
    border-radius: 20px;
    margin-bottom: 20px;
    letter-spacing: .06em;
    text-transform: uppercase
}

.au-dot {
    width: 6px;
    height: 6px;
    background: var(--blue);
    border-radius: 50%;
    animation: pulse_second 2s infinite
}

.au-hero h1 {
    font-size: 46px;
    font-weight: 900;
    letter-spacing: -1.5px;
    color: var(--text);
    line-height: 1.08;
    margin: 0 0 18px
}

.au-hero h1 em {
    font-style: normal;
    color: var(--blue)
}

.au-hero-sub {
    font-size: 17px;
    line-height: 1.7;
    max-width: 560px;
    margin: 0;
}

/* STATS */
.au-stats {
    background: var(--white);
    border-bottom: 1px solid var(--border)
}

.au-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr)
}

.au-stat {
    padding: 28px 24px;
    border-right: 1px solid var(--border);
    text-align: center
}

.au-stat:last-child {
    border-right: none
}

.au-stat-num {
    font-size: 36px;
    font-weight: 900;
    color: var(--text);
    letter-spacing: -1.5px;
    line-height: 1;
    margin-bottom: 5px
}

.au-stat-num em {
    font-style: normal;
    color: var(--blue)
}

.au-stat-label {
    font-size: 13px;
    color: var(--textColor);
    font-weight: 500
}

/* SECTION TITLES */
.au-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--blue);
    margin-bottom: 8px
}

.au-h2 {
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.5px;
    color: var(--text);
    line-height: 1.18;
    margin: 0 0 14px
}

.section-who p,
.au-p {
    font-size: 15px;
    color: var(--textColor);
    line-height: 1.75;
    margin: 0 0 12px
}
.section-who p:last-child,
.au-p:last-child {
    margin-bottom: 0
}

/* TWO-COL */
.au-two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center
}

/* FACT LIST (replaces broken visual card) */
.au-fact-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: var(--text);
    border-radius: 16px;
    overflow: hidden
}

.au-fact-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, .07)
}

.au-fact-item:last-child {
    border-bottom: none
}

.au-fact-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0
}
.au-fact-dot-5,
.au-fact-dot-1 {
    background: #60A5FA
}

.au-fact-dot-2 {
    background: #34D399
}

.au-fact-dot-3 {
    background: #FCD34D
}

.au-fact-dot-4 {
    background: #A78BFA
}

.au-fact-label {
    font-size: 12px;
    color: rgba(255, 255, 255, .4);
    margin-bottom: 2px;
    font-family: inherit
}

.au-fact-val {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    font-family: inherit
}

/* VALUES GRID */
.au-values {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px
}

.au-val-card {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: 14px;
    padding: 22px 20px;
    transition: box-shadow .2s, transform .2s
}

.au-val-card:hover {
    box-shadow: 0 8px 28px rgba(37, 99, 235, .08);
    transform: translateY(-2px)
}

.au-val-icon {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 13px
}

.au-val-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 6px
}

.au-val-desc {
    font-size: 13px;
    line-height: 1.6
}

/* HOW WE TEST */
.au-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px
}

.au-step {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: 14px;
    padding: 20px 18px
}

.au-step-num {
    font-size: 11px;
    font-weight: 700;
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 10px
}

.au-step-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 6px
}

.au-step-desc {
    font-size: 13px;
    line-height: 1.55
}

/* TEAM */
.au-team {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px
}

.au-team-card {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: 16px;
    padding: 26px 22px;
    text-align: center;
    transition: box-shadow .2s, transform .2s
}

.au-team-card:hover {
    box-shadow: 0 8px 28px rgba(37, 99, 235, .08);
    transform: translateY(-2px)
}

.au-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    margin: 0 auto 14px
}

.au-member-name {
    font-size: 16px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 3px
}

.au-member-role {
    font-size: 12px;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 10px
}

.au-member-bio {
    font-size: 13px;
    line-height: 1.55
}

/* CTA */
.au-cta {
    background: linear-gradient(135deg, #071223, #0d2545);
    border-radius: 20px;
    padding: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px
}

.au-cta-left {}

.au-cta-title {
    font-size: 26px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -.4px;
    margin-bottom: 7px
}

.au-cta-sub {
    font-size: 15px;
    color: rgba(255, 255, 255, .55)
}

.au-cta-btns {
    display: flex;
    gap: 12px;
    flex-shrink: 0
}

.au-btn-p {
    font-size: 14px;
    font-weight: 700;
    padding: 13px 26px;
    background: var(--blue);
    color: #fff;
    border-radius: 10px;
    transition: background .15s;
    white-space: nowrap
}

.au-btn-p:hover {
    background: var(--blue)
}

.au-btn-s {
    font-size: 14px;
    font-weight: 600;
    padding: 13px 26px;
    background: rgba(255, 255, 255, .1);
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, .2);
    border-radius: 10px;
    transition: all .15s;
    white-space: nowrap
}

.au-btn-s:hover {
    background: rgba(255, 255, 255, .18)
}
@media(max-width:1199px) {
    .au-hero h1 {
        font-size: 32px
    }
    .au-two {
        grid-template-columns: 1fr;
        gap: 32px
    }
    .au-values {
        grid-template-columns: 1fr 1fr
    }
    .au-team {
        grid-template-columns: 1fr 1fr
    }
    .au-steps {
        grid-template-columns: 1fr 1fr
    }
    .au-stats-grid {
        grid-template-columns: 1fr 1fr
    }
    .au-stat:nth-child(2) {
        border-right: none
    }
    .au-stat:nth-child(n+3) {
        border-top: 1px solid var(--border)
    }
    .au-cta {
        flex-direction: column;
        text-align: center;
        padding: 32px 24px
    }
}

@media(max-width:767px) {

    .au-values,
    .au-team {
        grid-template-columns: 1fr
    }

    .au-steps {
        grid-template-columns: 1fr
    }

    .au-stats-grid {
        grid-template-columns: 1fr 1fr
    }

    .au-cta-btns {
        flex-direction: column
    }
}

/*  ---------end PAGE ABOUT--------- */
/*------------SINGLE POST------------*/
/* ── BREADCRUMB ── */
.breadcrumb {
    padding: 18px 0 0;
    font-size: 13px;
    color: var(--textColor);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px
}

.breadcrumb a {
    color: var(--textColor);
    transition: color .15s
}

.breadcrumb a:hover {
    color: var(--blue)
}

.breadcrumb .sep {
    color: var(--border)
}

.breadcrumb .current {
    color: var(--ink);
    font-weight: 500
}

/* ── ARTICLE HERO ── */
.art-hero {
    background: var(--white);
    padding: 24px 0 40px;
    border-bottom: 1px solid var(--border)
}

.art-hero-inner {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 48px;
    align-items: center
}

.art-hero-left {}

.art-label {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--blue);
    background: var(--blue-light);
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 14px
}

.art-hero-left h1 {
    font-size: 38px;
    font-weight: 900;
    letter-spacing: -1.2px;
    line-height: 1.1;
    color: var(--ink);
    margin: 0 0 14px
}

.art-hero-desc {
    font-size: 16px;
    color: var(--textColor);
    line-height: 1.6;
    margin-bottom: 20px;
    max-width: 480px
}

.art-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--textColor);
    font-weight: 500;
    flex-wrap: wrap
}

.art-meta .dot {
    color: var(--border)
}

.art-meta .author {
    display: flex;
    align-items: center;
    gap: 7px
}

.author-av {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--blue), #2d7aff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    overflow: hidden;
}
.author-av img{
	width: 100%;
	height: 100%;
}
/* Hero image placeholder */
.art-hero-img {
    height: 280px;
    border-radius: 18px;
    overflow: hidden;
    background: linear-gradient(135deg, #071223 0%, #0d2545 55%, #1a3a6e 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: var(--shadow)
}

.art-hero-img svg {
    opacity: .75
}

/*.art-hero-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(7, 18, 35, .6), transparent 50%)
}*/

/* ── PAGE LAYOUT ── */
.page-body {
    padding: 40px 0 60px
}

.page-grid {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 40px;
    align-items: start
}
.page-grid.no-sidebar{
  grid-template-columns: 1fr;
}
/* ── TABLE OF CONTENTS ── */
.toc {
    display: none !important
}

.toc-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--textColor);
    margin-bottom: 12px
}

.toc-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 2px
}

.toc-list li {}

.toc-list a {
    font-size: 13px;
    color: var(--textColor);
    font-weight: 500;
    padding: 5px 10px;
    border-left: 2px solid var(--border);
    display: block;
    transition: all .15s;
    line-height: 1.4
}

.toc-list a:hover {
    color: var(--blue);
    border-left-color: var(--blue);
    background: var(--blue-light);
    border-radius: 0 5px 5px 0
}

.toc-list a.active {
    color: var(--blue);
    border-left-color: var(--blue);
    font-weight: 600
}

/* ── ARTICLE CONTENT ── */
.article-content {
    min-width: 0;
    color: var(--ink)
}

.article-content h2 {
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -.4px;
    color: var(--ink);
    margin: 36px 0 14px;
    padding-top: 8px
}

.article-content h2:first-child {
    margin-top: 0
}

.article-content p {
    font-size: 15px;
    color: var(--ink);
    line-height: 1.75;
    margin-bottom: 16px
}

.article-content p:last-child {
    margin-bottom: 0
}

/* Quote */
.article-content blockquote {
    background: #eef5ff;
    border-left: 4px solid var(--blue);
    border-radius: 0 12px 12px 0;
    padding: 20px 24px;
    margin: 24px 0
}

.article-content blockquote p {
    font-size: 17px;
    font-style: italic;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.55;
    margin: 0
}

.article-content blockquote p::before {
    content: '\201C';
    color: var(--blue);
    font-size: 28px;
    font-style: normal;
    line-height: 1;
    margin-right: 4px;
    vertical-align: -.2em
}

.article-content blockquote p::after {
    content: '\201D';
    color: var(--blue);
    font-size: 28px;
    font-style: normal;
    line-height: 1;
    margin-left: 4px;
    vertical-align: -.2em
}
.article-content a{
	color: var(--accent);
	text-decoration: underline;
}
.article-content a:hover{
	text-decoration: none;
}
.article-content table{
	width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    margin: 12px 0;
}
.article-content table th {
    background: var(--blue-light);
    color: #1a2530;
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    border-bottom: 1px solid var(--accent);
}
.article-content table td {
    padding: 10px 12px;
    border-bottom: 0.5px solid var(--border);
    color: #4a5560;
}
.article-content ul{
	padding-left: 20px;
}
.article-content ul li::marker {
  color: var(--accent);
}
/* Check list */
.check-list {
    list-style: none;
    margin: 16px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0;
}

.check-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    color: var(--ink);
    line-height: 1.5
}

.check-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px
}

.check-icon svg {
    width: 11px;
    height: 11px;
    stroke: #fff;
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round
}

/* Bullet list */
.bullet-list {
    list-style: none;
    margin: 16px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.bullet-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    color: var(--ink);
    line-height: 1.5
}

.bullet-list li::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--blue);
    margin-top: 8px;
    flex-shrink: 0
}

/* Wide image placeholder */
.wide-img {
    height: 220px;
    border-radius: var(--r);
    overflow: hidden;
    margin: 24px 0;
    background: linear-gradient(135deg, #071223, #0d2545 50%, #1a3a6e);
    display: flex;
    align-items: center;
    justify-content: center
}

.wide-img svg {
    opacity: .7
}

/* ── KEY TAKEAWAYS ── */
.takeaways {
    background: var(--blue-light);
    border: 1.5px solid #C4D9FF;
    border-radius: 18px;
    padding: 28px 32px;
    margin: 40px 0
}

.takeaways-title {
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px
}

.takeaways-title svg {
    width: 20px;
    height: 20px;
    stroke: var(--blue);
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round
}

.takeaways-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.tk-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: var(--ink);
    font-weight: 500;
    line-height: 1.45
}

.tk-dot {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px
}

.tk-dot svg {
    width: 11px;
    height: 11px;
    stroke: #fff;
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round
}

/* ── RECOMMENDED BROKERS TABLE ── */
.rec-brokers {
    margin: 40px 0
}

.rec-brokers h2 {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.3px;
    margin-bottom: 20px
}

.broker-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px
}

.broker-table thead th {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--textColor);
    padding: 0 16px 6px;
    text-align: left
}

.broker-table thead th:last-child {
    text-align: right
}

.broker-table tbody tr {
    background: var(--white);
    box-shadow: var(--shadow);
    transition: box-shadow .2s, transform .2s;
    cursor: pointer
}

.broker-table tbody tr:hover {
    box-shadow: var(--shadow-h);
    transform: translateY(-1px)
}

.broker-table tbody td {
    padding: 14px 16px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border)
}

.broker-table tbody td:first-child {
    border-left: 1px solid var(--border);
    border-radius: var(--r) 0 0 var(--r)
}

.broker-table tbody td:last-child {
    border-right: 1px solid var(--border);
    border-radius: 0 var(--r) var(--r) 0
}

.bt-broker {
    display: flex;
    align-items: center;
    gap: 12px
}

.bt-logo {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
    flex-shrink: 0
}

.bt-name {
    font-size: 14px;
    font-weight: 700
}

.bt-rating {
    font-size: 18px;
    font-weight: 900;
    color: var(--ink);
    letter-spacing: -.5px
}

.bt-rating span {
    font-size: 11px;
    color: var(--textColor);
    font-weight: 500;
    letter-spacing: 0
}

.bt-dep {
    font-size: 14px;
    font-weight: 600
}

.bt-best {
    font-size: 12px;
    font-weight: 600;
    color: var(--blue);
    background: var(--blue-light);
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap
}

.bt-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end
}

/* ── RELATED ARTICLES ── */
.related {
    margin: 40px 0 0
}

.related h2 {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.3px;
    margin-bottom: 20px
}

.related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 0 !important;
}

.rel-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: box-shadow .2s, transform .2s;
    cursor: pointer
}

.rel-card:hover {
    box-shadow: var(--shadow-h);
    transform: translateY(-3px)
}

.rel-thumb {
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center
}

.rel-body {
    padding: 16px
}

.rel-cat {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--blue);
    margin-bottom: 7px
}

.rel-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.35;
    margin-bottom: 10px
}

.rel-meta {
    font-size: 12px;
    color: var(--textColor)
}

/* ── SIDEBAR ── */
.sidebar {
    position: sticky;
    top: 88px;
    display: flex;
    flex-direction: column;
    gap: 20px
}

.sb-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 22px;
    box-shadow: var(--shadow)
}

.sb-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--ink);
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--blue)
}

.pop-art-list {
    display: flex;
    flex-direction: column;
    gap: 0
}

.pa-item {
    display: flex;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
    align-items: flex-start;
    position: relative;
}
.pa-item a{
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}
.pa-item:last-child {
    border-bottom: none;
    padding-bottom: 0
}

.pa-thumb {
    width: 56px;
    height: 44px;
    border-radius: 8px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.pa-info {}

.pa-cat {
    font-size: 10px;
    font-weight: 700;
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: 3px
}

.pa-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.35
}

.pa-meta {
    font-size: 11px;
    color: var(--textColor);
    margin-top: 3px
}

/* Compare card */
.compare-card {
    background: var(--blue-light);
    border: 1.5px solid #C4D9FF;
    border-radius: 18px;
    padding: 22px;
    text-align: center
}

.compare-icon {
    width: 52px;
    height: 52px;
    background: var(--white);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 14px;
    box-shadow: 0 2px 10px rgba(0, 91, 255, .1)
}

.compare-icon svg {
    width: 26px;
    height: 26px;
    stroke: var(--blue);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round
}

.compare-title {
    font-size: 15px;
    font-weight: 800;
    color: var(--ink);
    margin-bottom: 6px
}

.compare-sub {
    font-size: 13px;
    color: var(--textColor);
    margin-bottom: 16px;
    line-height: 1.5
}

.compare-btn {
    width: 100%;
    padding: 11px;
    background: var(--blue);
    color: #fff;
    border: none;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s;
    font-family: inherit
}

.compare-btn:hover {
    background: var(--blue2)
}

/* ── NEWSLETTER ── */
.newsletter-sec {
    padding: 40px 0
}

.newsletter {
    background: var(--grad);
    border-radius: 20px;
    padding: 36px 48px;
    display: flex;
    align-items: center;
    gap: 32px
}

.nl-icon {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    background: rgba(255, 255, 255, .1);
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center
}

.nl-icon svg {
    width: 24px;
    height: 24px;
    stroke: #fff;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round
}

.nl-text {
    flex: 1
}

.nl-title {
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 4px;
    letter-spacing: -.3px
}

.nl-sub {
    font-size: 14px;
    color: rgba(255, 255, 255, .6)
}

.nl-form {
    display: flex;
    gap: 10px;
    flex-shrink: 0
}

.nl-input {
    width: 260px;
    padding: 12px 18px;
    border: 1px solid rgba(255, 255, 255, .15);
    background: rgba(255, 255, 255, .1);
    border-radius: 9px;
    color: #fff;
    font-size: 14px;
    font-family: inherit;
    outline: none
}

.nl-input::placeholder {
    color: rgba(255, 255, 255, .35)
}

.nl-input:focus {
    border-color: rgba(0, 91, 255, .5);
    background: rgba(255, 255, 255, .14)
}

.nl-btn {
    padding: 12px 24px;
    background: var(--blue);
    color: #fff;
    border: none;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s;
    font-family: inherit
}

.nl-btn:hover {
    background: var(--blue2)
}

/* ── RESPONSIVE ── */
@media(max-width:1100px) {
    .page-grid {
        grid-template-columns: 1fr 280px
    }

    .art-hero-inner {
        grid-template-columns: 1fr 340px;
        gap: 32px
    }
}

@media(max-width:900px) {
    .art-hero-inner {
        grid-template-columns: 1fr
    }

    .art-hero-img {
        display: none
    }

    .art-hero-left h1 {
        font-size: 28px
    }

    .page-grid {
        grid-template-columns: 1fr
    }

    .sidebar {
        position: static;
        top: auto
    }

    .takeaways-grid {
        grid-template-columns: 1fr
    }

    .related-grid {
        grid-template-columns: 1fr 1fr
    }

    .newsletter {
        flex-direction: column;
        padding: 28px 24px
    }

    .nl-form {
        flex-direction: column;
        width: 100%
    }

    .nl-input {
        width: 100%
    }
}

@media(max-width:600px) {
    .related-grid {
        grid-template-columns: 1fr
    }

    .broker-table {
        display: none
    }

    .broker-cards-mobile {
        display: flex !important;
        flex-direction: column;
        gap: 14px;
        margin: 0 0 20px
    }

    .bm-card {
        background: var(--white);
        border: 1px solid var(--border);
        border-radius: var(--r);
        padding: 18px;
        box-shadow: var(--shadow)
    }

    .bm-top {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 12px
    }

    .bm-logo {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        border: 1px solid var(--border);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        font-weight: 800
    }

    .bm-name {
        font-size: 15px;
        font-weight: 800
    }

    .bm-rating {
        font-size: 22px;
        font-weight: 900;
        color: var(--ink)
    }

    .bm-row {
        display: flex;
        justify-content: space-between;
        font-size: 13px;
        margin-bottom: 8px
    }

    .bm-label {
        color: var(--textColor)
    }

    .bm-val {
        font-weight: 600
    }

    .bm-actions {
        display: flex;
        gap: 8px;
        margin-top: 12px
    }

    .bm-actions button {
        flex: 1
    }

    .art-hero-left h1 {
        font-size: 24px
    }
}

.broker-cards-mobile {
    display: none !important
}

/* ── SIDEBAR BROKER MINI LIST ── */
.sb-brokers-card {
    padding: 18px 20px;
}

.sb-broker-mini-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.sbm-row {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 0;
    border-bottom: 1px solid var(--border);
    transition: background .15s;
}

.sbm-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.sbm-row.sbm-featured {
    background: #F5F9FF;
    margin: 0 -20px;
    padding: 11px 20px;
    border-radius: 10px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 0;
}

.sbm-rank {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background: var(--blue);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sbm-rank-2 {
    background: #475569;
}

.sbm-rank-3 {
    background: #6D6D6D;
}

.sbm-logo {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 800;
    flex-shrink: 0;
}

.sbm-info {
    flex: 1;
    min-width: 0;
}

.sbm-name {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink);
    margin-bottom: 1px;
}

.sbm-stars {
    font-size: 10px;
    color: #FBBF24;
    letter-spacing: .3px;
}

.sbm-score {
    font-size: 10px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -.2px;
}

.sbm-tag {
    font-size: 10px;
    color: var(--textColor);
    margin-top: 1px;
}

.sbm-btn {
    font-size: 11px;
    font-weight: 700;
    padding: 5px 11px;
    background: var(--blue);
    color: #fff;
    border-radius: 6px;
    flex-shrink: 0;
    transition: background .15s;
}

.sbm-btn:hover {
    background: var(--blue2);
}

/*------------end SINGLE POST------------*/
/*---------------CATEGORY---------------*/

.page-category{
  color: var(--ink);
}

/* ── HERO ── */
.hero {
  background: var(--white);
  padding: 28px 0 40px;
  border-bottom: 1px solid var(--border);
  overflow: hidden;
  position: relative;
}
.hero-inner {
  display: grid;
  grid-template-columns: 1fr 460px;
  gap: 40px;
  align-items: center;
}
.hero-left {}
.hero h1 {
  font-size: 42px; font-weight: 900;
  letter-spacing: -1.5px; line-height: 1.1;
  color: var(--ink); margin-bottom: 14px;
}
.hero-sub {
  font-size: 16px; color: var(--textColor);
  line-height: 1.6; max-width: 400px;
}
/* Hero right: CSS trading illustration */
.hero-visual {
  /*position: relative;*/
  /*height: 220px;*/
  display: flex; align-items: center; justify-content: flex-end;
}
.hero-visual img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* Subtle bg circles */
.hero-visual::before {
  content: '';
  position: absolute; right: -40px; top: -40px;
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(0,91,255,.06) 0%, transparent 70%);
  border-radius: 50%; pointer-events: none;
}
.laptop-mock {
  position: relative;
  width: 300px;
}
.lm-shell {
  background: #D8DEE8;
  border-radius: 12px 12px 0 0;
  padding: 7px 7px 0;
  box-shadow: 0 20px 60px rgba(7,22,47,.2), 0 6px 20px rgba(7,22,47,.1);
}
.lm-screen {
  background: #071223;
  border-radius: 7px;
  overflow: hidden;
  aspect-ratio: 16/10;
  padding: 8px;
  font-size: 7px;
  font-family: 'Inter', monospace;
  color: rgba(255,255,255,.5);
}
.lm-screen-header {
  display: flex; justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.07);
  padding-bottom: 5px; margin-bottom: 6px;
}
.lms-title { font-size: 8px; font-weight: 700; color: #fff; letter-spacing: 1px; }
.lms-dot { width: 5px; height: 5px; border-radius: 50%; background: #10B981; display: inline-block; }
.lm-body { display: grid; grid-template-columns: 1fr 80px; gap: 6px; }
.lm-chart { background: rgba(255,255,255,.03); border-radius: 4px; padding: 5px; }
.lm-price { font-size: 13px; font-weight: 800; color: #fff; }
.lm-change { font-size: 7px; color: #10B981; margin-bottom: 4px; }
.lm-sidebar { display: flex; flex-direction: column; gap: 4px; }
.lm-panel { background: rgba(255,255,255,.04); border-radius: 4px; padding: 5px; border: 1px solid rgba(255,255,255,.06); }
.lm-panel-val { font-size: 9px; font-weight: 700; color: #fff; }
.lm-panel-label { font-size: 6px; color: rgba(255,255,255,.35); }
.lm-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-top: 3px; }
.lm-buy { background: rgba(16,185,129,.25); color: #10B981; border-radius: 3px; padding: 4px; font-size: 7px; font-weight: 800; text-align: center; }
.lm-sell { background: rgba(239,68,68,.25); color: #EF4444; border-radius: 3px; padding: 4px; font-size: 7px; font-weight: 800; text-align: center; }
.lm-base { height: 10px; background: #C8CDD5; border-radius: 0 0 3px 3px; margin: 0 -3px; }
.lm-foot { height: 4px; background: #BEC3CB; border-radius: 0 0 5px 5px; margin: 0 16px; }
/* Phone */
.phone-mock {
  position: absolute;
  bottom: 10px; left: 60px;
  width: 90px;
  background: #12172A;
  border-radius: 14px;
  padding: 4px;
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
}
.pm-screen {
  background: #071223;
  border-radius: 11px;
  overflow: hidden;
  padding: 6px;
  min-height: 130px;
  font-size: 7px;
  color: rgba(255,255,255,.5);
  display: flex; flex-direction: column; gap: 4px;
}
.pm-title { font-size: 8px; font-weight: 800; color: #fff; }
.pm-bal { font-size: 14px; font-weight: 900; color: #fff; line-height: 1; }
.pm-bal-label { font-size: 6px; color: rgba(255,255,255,.35); }
.pm-chart-area { flex: 1; background: rgba(255,255,255,.03); border-radius: 4px; padding: 4px; }
.pm-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.pm-buy { background: rgba(16,185,129,.2); color: #10B981; border-radius: 4px; padding: 4px; font-size: 7px; font-weight: 800; text-align: center; }
.pm-sell { background: rgba(239,68,68,.2); color: #EF4444; border-radius: 4px; padding: 4px; font-size: 7px; font-weight: 800; text-align: center; }
/* Floating icons */
.float-icon {
  position: absolute;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--white); border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(7,22,47,.1);
  font-size: 14px;
}
.fi-1 { top: 20px; right: 10px; }
.fi-2 { top: 55px; right: -12px; }
.fi-3 { bottom: 55px; left: 10px; }
.fi-4 { bottom: 20px; right: 0; }

/* ── CATEGORY TABS ── */
.cat-tabs {
  padding: 28px 0;
  border-bottom: 1px solid var(--border);
  background: var(--white);
}
.cat-inner { display: flex; gap: 10px; flex-wrap: wrap; }
.cat-btn {
  font-size: 13px; font-weight: 600;
  padding: 8px 18px; border-radius: 50px;
  border: 1.5px solid var(--border);
  background: var(--white); color: var(--textColor);
  cursor: pointer; transition: all .15s;
}
.cat-btn:hover { border-color: var(--blue); color: var(--blue); }
.cat-btn.active { background: var(--blue); color: #fff; border-color: var(--blue); }

/* ── SECTION COMMON ── */
.section { padding: 32px 0; }
.section-alt { background: var(--bg); }
.sh {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 28px;
  line-height: 1;
}
.sh h2 { font-size: 24px; font-weight: 800; letter-spacing: -.4px; margin: 0; }
.view-all {
  font-size: 14px; font-weight: 600; color: var(--blue);
  display: flex; align-items: center; gap: 4px; transition: gap .15s;
}
.view-all:hover { gap: 7px; }
.view-all svg { width: 14px; height: 14px; stroke: var(--blue); fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* ── ARTICLE CARDS ── */
/* Popular (large) */
.pop-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.article-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: box-shadow .2s, transform .2s;
  cursor: pointer;
}
.article-card:hover {
  box-shadow: var(--shadow-h);
  transform: translateY(-3px);
}
/* Thumbnail placeholders */
.art-thumb {
  height: 190px;
  position: relative;
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.art-thumb svg { position: absolute; opacity: .8; }
.thumb-1 { background: linear-gradient(135deg, #071223 0%, #0d2545 60%, #1a3a6e 100%); }
.thumb-2 { background: linear-gradient(135deg, #0a1929 0%, #102040 60%, #0d3b6e 100%); }
.thumb-3 { background: linear-gradient(135deg, #071223 0%, #0e2a50 60%, #1c4480 100%); }
.thumb-4 { background: linear-gradient(135deg, #091420 0%, #0c2238 60%, #163860 100%); }
.thumb-5 { background: linear-gradient(135deg, #0a1624 0%, #0f2640 60%, #1a3d6a 100%); }
.thumb-6 { background: linear-gradient(135deg, #080f1d 0%, #0b1e35 60%, #112e55 100%); }
.thumb-7 { background: linear-gradient(135deg, #071522 0%, #0d2340 60%, #1a3968 100%); }
.thumb-8 { background: linear-gradient(135deg, #09141e 0%, #0c2035 60%, #162e50 100%); }
.featured-badge {
  position: absolute; top: 12px; left: 12px;
  background: var(--blue); color: #fff;
  font-size: 10px; font-weight: 700;
  padding: 3px 10px; border-radius: 5px;
  letter-spacing: .05em; text-transform: uppercase;
}
.art-body { padding: 18px 20px 20px; }
.art-cat {
  font-size: 10px; font-weight: 700;
  color: var(--blue); text-transform: uppercase;
  letter-spacing: .07em; margin-bottom: 8px;
}
.art-title {
  font-size: 17px; font-weight: 700;
  color: var(--ink); line-height: 1.35;
  letter-spacing: -.2px; margin-bottom: 10px;
}
.art-title-sm {
  font-size: 14px; font-weight: 700;
  color: var(--ink); line-height: 1.35;
  letter-spacing: -.1px; margin-bottom: 8px;
}
.art-desc {
  font-size: 13px; color: var(--textColor);
  line-height: 1.55; margin-bottom: 14px;
  display: -webkit-box; -webkit-line-clamp: 3;
  -webkit-box-orient: vertical; overflow: hidden;
}
.art-meta {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: var(--textColor); font-weight: 500;
}
.art-meta .dot { color: var(--border); }
/* Latest (small) */
.latest-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.article-card-sm .art-thumb { height: 140px; }
.article-card-sm .art-body { padding: 14px 16px 16px; }

/* ── NEWSLETTER ── */
.newsletter {
  background: var(--grad);
  border-radius: 20px;
  padding: 36px 48px;
  display: flex; align-items: center; gap: 32px;
}
.nl-icon {
  width: 52px; height: 52px; flex-shrink: 0;
  background: rgba(255,255,255,.1);
  border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
}
.nl-icon svg { width: 24px; height: 24px; stroke: #fff; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.nl-text { flex: 1; }
.nl-title { font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 4px; letter-spacing: -.3px; }
.nl-sub { font-size: 14px; color: rgba(255,255,255,.6); }
.nl-form { display: flex; gap: 10px; flex-shrink: 0; }
.nl-input {
  width: 280px; padding: 12px 18px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.1);
  border-radius: 9px; color: #fff;
  font-size: 14px; font-family: inherit; outline: none;
}
.nl-input::placeholder { color: rgba(255,255,255,.35); }
.nl-input:focus { border-color: rgba(0,91,255,.6); background: rgba(255,255,255,.14); }
.nl-btn {
  padding: 12px 24px;
  background: var(--blue); color: #fff;
  border: none; border-radius: 9px;
  font-size: 14px; font-weight: 700;
  cursor: pointer; white-space: nowrap;
  transition: background .15s; font-family: inherit;
}
.nl-btn:hover { background: var(--blue2); }
/* ── INLINE SVG CHARTS (thumb decoration) ── */
.chart-deco { position: absolute; bottom: 0; left: 0; width: 100%; }

/* ── RESPONSIVE ── */
@media (max-width: 1100px) {
  .hero-inner { grid-template-columns: 1fr 380px; }
  .pop-grid { grid-template-columns: 1fr 1fr; }
  .pop-grid .article-card:last-child { display: none; }
  .latest-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .nav-links { display: none; }
  .wrap { padding: 0 16px; }
  .hero-inner { grid-template-columns: 1fr; }
  .hero-visual { opacity: .5 }
  .hero h1 { font-size: 32px; }
  .pop-grid { grid-template-columns: 1fr; }
  .pop-grid .article-card:last-child { display: block; }
  .latest-grid { grid-template-columns: 1fr 1fr; }
  .nl-form { flex-direction: column; width: 100%; }
  .nl-input { width: 100%; }
  .newsletter { flex-direction: column; padding: 28px 24px; }
  .faq-row { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .latest-grid { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: 10px; }
  .cat-inner { gap: 7px; }
  .cat-btn { font-size: 12px; padding: 6px 14px; }
  .section { padding: 40px 0; }
}

/* ── LOAD MORE ── */
.load-more-wrap {
  padding: 0;
  /*background: var(--bg);*/
}
.load-more-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding: 18px;
  background: var(--white);
  border: 1.5px dashed var(--border);
  border-radius: 14px;
  cursor: pointer;
  transition: all .2s;
  font-family: inherit;
}
.load-more-btn:hover {
  border-color: var(--blue);
  background: #EEF5FF;
}
.load-more-btn:hover .lm-icon { stroke: var(--blue); }
.load-more-btn:hover .lm-text { color: var(--blue); }
.lm-text {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  transition: color .2s;
}
.lm-count {
  font-size: 12px;
  color: var(--textColor);
  font-weight: 500;
}
.lm-icon {
  width: 20px; height: 20px;
  stroke: var(--textColor);
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .2s, transform .3s;
  margin-top: 2px;
}
.load-more-btn.loading .lm-icon {
  animation: spin 1s linear infinite;
}
.load-more-btn.all-loaded {
  opacity: .45;
  cursor: default;
  border-style: solid;
}
.load-more-btn.all-loaded:hover {
  border-color: var(--border);
  background: var(--white);
}
.load-more-btn.all-loaded:hover .lm-text { color: var(--ink); }
@keyframes spin { to { transform: rotate(360deg); } }


/* ── TOP 3 BROKERS ── */
.t3-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.t3-card:first-child{
  grid-row: span 2;
  flex-direction: column;
  align-items: flex-start;
}
.t3-card {
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: 18px;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: box-shadow .22s, transform .22s;
}
.t3-card:hover {
  box-shadow: 0 12px 36px rgba(0,91,255,.09);
  transform: translateY(-2px);
}
.t3-featured {
  border-color: #BFDBFE;
  background: linear-gradient(155deg, #EFF6FF 0%, #fff 50%);
}
.t3-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.t3-card:first-child .t3-head{
  width: 100%;
}
.t3-rank {
  width: 28px; height: 28px;
  border-radius: 8px;
  font-size: 13px; font-weight: 800;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.t3-rank-1 { background: var(--blue); }
.t3-rank-2 { background: #475569; }
.t3-rank-3 { background: #6B7280; }
.t3-badge {
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  background: linear-gradient(135deg, var(--blue), #7C3AED);
  color: #fff;
  padding: 3px 10px; border-radius: 20px;
}
.t3-tag {
  font-size: 11px; font-weight: 600;
  color: var(--blue); background: var(--bgl, #EFF6FF);
  padding: 3px 10px; border-radius: 20px;
}
.t3-identity {
  display: flex; align-items: center; gap: 12px;
}
.t3-logo {
  width: 48px; height: 48px;
  border-radius: 12px;
  border: 1.5px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 900; flex-shrink: 0;
}
.t3-name {
  font-size: 18px; font-weight: 800;
  color: var(--ink); letter-spacing: -.3px;
}
.t3-stars {
  font-size: 13px; color: #FBBF24;
  letter-spacing: 1px; margin-top: 2px;
}
.t3-score {
  font-size: 13px; font-weight: 800;
  color: var(--ink); letter-spacing: -.2px;
}
.t3-pills {
  display: flex; flex-wrap: wrap; gap: 7px;
}
.t3-pill {
  font-size: 12px; font-weight: 500;
  color: var(--textColor);
  background: var(--bg, #F7FAFF);
  border: 1px solid var(--border);
  border-radius: 20px; padding: 4px 11px;
}
.article-content .t3-card .t3-btn-p,
.t3-btn-p {
  display: block;
  width: 100%; padding: 13px;
  background: linear-gradient(135deg, var(--blue), #1D4ED8);
  color: #fff;
  border: none; border-radius: 10px;
  font-size: 14px; font-weight: 700;
  text-align: center;
  cursor: pointer; transition: opacity .15s;
  box-shadow: 0 4px 14px rgba(37,99,235,.3);
}
.t3-btn-p:hover { opacity: .9; }
.article-content .t3-card .t3-btn-s,
.t3-btn-s {
  display: block;
  padding: 13px;
  background: transparent;
  color: var(--ink);
  border: 1.5px solid var(--border);
  border-radius: 10px;
  font-size: 14px; font-weight: 600;
  text-align: center;
  cursor: pointer; transition: all .15s;
  margin-left: auto;
}
.article-content .t3-card .t3-btn-s:hover,
.t3-btn-s:hover { border-color: var(--blue); color: var(--blue); }
@media(max-width:900px) { .t3-grid { grid-template-columns: 1fr; } }
@media(max-width:600px) { .t3-card { padding: 18px; } .t3-btn-s{font-size: 12px;}}

.article-content .t3-card a{
  text-decoration: none;
}

/*---------------end CATEGORY---------------*/
/*---------------SINGLE BROKER---------------*/

.single-broker-page{
  color: var(--ink);
}
.broker-hero {
  position: relative;
  background-image: url(../img/broker-intro.png);
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  padding: 24px 0 52px;
  border-bottom: 1px solid var(--border);
}
.hero.has-bg-image {
  --hero-bg-overlay: linear-gradient(
    90deg,
    rgba(248,250,255,0.97) 0%,
    rgba(248,250,255,0.92) 40%,
    rgba(248,250,255,0.55) 70%,
    rgba(248,250,255,0.20) 100%
  );
}
.hero-grid{display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:flex-start;margin-top:24px}
@media(max-width:800px){.hero-grid{grid-template-columns:1fr}}
.hero-left{}
.broker-id{display:flex;align-items:center;gap:18px;margin-bottom:20px}
.broker-logo-box{overflow: hidden;width:72px;height:72px;border-radius:16px;background:var(--bgl);border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:900;color:var(--blue)}
.broker-name-tag{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--blue);background:var(--bgl);padding:3px 10px;border-radius:20px;display:inline-block;margin-bottom:6px}
.broker-hero h1{font-size:38px;font-weight:900;letter-spacing:-1.2px;line-height:1.1;color:var(--ink);margin-bottom:12px}
.broker-hero .broker-label h1{margin: 0;}
.hero-sub{font-size:16px;color:var(--textColor);margin-bottom:24px;max-width:500px}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.risk-txt{font-size:12px;color:var(--textColor);opacity:.75}
/* Rating card */
.rating-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r2);padding:28px 24px;box-shadow:var(--sh);text-align:center}
.rc-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--textColor);margin-bottom:10px}
.rc-stars{color:var(--gold);font-size:22px;letter-spacing:3px;margin-bottom:8px}
.rc-score{font-size:56px;font-weight:900;color:var(--ink);letter-spacing:-2px;line-height:1}
.rc-verdict{font-size:15px;font-weight:700;color:var(--green);margin:6px 0 8px}
.rc-base{font-size:12px;color:var(--textColor)}

/* ── QUICK STATS ── */
.quick-stats{background:var(--white);border-bottom:1px solid var(--border);padding:20px 0}
.qs-wrap{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
/* Big stat tiles */
.qs-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.qs-tile{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:14px 16px;display:flex;align-items:center;gap:12px;transition:border-color .15s,box-shadow .15s}
.qs-tile:hover{border-color:#BFDBFE;box-shadow:0 4px 16px rgba(0,91,255,.07)}
.qs-tile-icon{width:38px;height:38px;border-radius:10px;background:var(--bgl);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.qs-tile-icon svg{width:18px;height:18px;stroke:var(--blue);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.qs-tile-label{font-size:11px;color:var(--textColor);font-weight:500;margin-bottom:3px}
.qs-tile-val{font-size:17px;font-weight:800;color:var(--ink);letter-spacing:-.3px;line-height:1}
.qs-tile-val.g{color:var(--green)}
/* Badge strip */
.qs-badges{display:flex;flex-direction:column;gap:7px;padding-left:24px;border-left:1px solid var(--border)}
.qs-badge{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap}
.qs-badge-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dot-green{background:var(--green)}
.dot-blue{background:var(--blue)}
.dot-amber{background:#F5A400}
.dot-gray{background:#94A3B8}
/* Responsive */
@media(max-width:900px){
  .qs-wrap{grid-template-columns:1fr}
  .qs-badges{border-left:none;padding-left:0;border-top:1px solid var(--border);padding-top:14px;flex-direction:row;flex-wrap:wrap}
  .qs-tiles{grid-template-columns:1fr 1fr}
}
@media(max-width:500px){
  .qs-tiles{grid-template-columns:1fr 1fr}
  .qs-tile-val{font-size:15px}
}

/* ── TABS ── */
.tabs-bar{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:64px;z-index:10}
.tabs-inner{display:flex;gap:0;overflow-x:auto;scrollbar-width:none}
.tabs-inner::-webkit-scrollbar{display:none}
.tab{font-size:14px;font-weight:600;padding:16px 22px;color:var(--textColor);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;transition:all .2s;background:transparent;border-top:none;border-left:none;border-right:none;font-family:inherit}
.tab:hover{color:var(--ink)}
.tab.act{color:var(--blue);border-bottom-color:var(--blue)}

/* ── EXPERT VERDICT ── */
.verdict{background:var(--bgl);border:1.5px solid #C4D9FF;border-radius:var(--r2);padding:36px 40px;margin:56px 0 0}
.verdict-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.verdict h2{font-size:26px;font-weight:800;letter-spacing:-.4px;margin: 0 0 14px}
.verdict p{font-size:15px;color:var(--textColor);line-height:1.7;margin: 0;}
.check-list{list-style:none;display:flex;flex-direction:column;gap:11px}
.check-list li{display:flex;align-items:flex-start;gap:10px;font-size:14px;font-weight:500}
.ci{width:20px;height:20px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.ci svg{width:11px;height:11px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

/* ── RATINGS + PROS/CONS ── */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
.card{background:var(--white);border:1px solid var(--border);border-radius:var(--r2);padding:28px;box-shadow:var(--sh)}
.card h3{font-size:18px;font-weight:800;margin-bottom:20px;letter-spacing:-.2px}
.rating-bar-row{margin-bottom:13px}
.rb-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.rb-label{font-size:13px;font-weight:500;color:var(--ink)}
.rb-val{font-size:13px;font-weight:700;color:var(--ink)}
.rb-track{height:7px;background:var(--bg);border-radius:10px;overflow:hidden}
.rb-fill{height:100%;border-radius:10px;background:linear-gradient(90deg,var(--blue),#4D9CFF)}
.how-rate{font-size:13px;color:var(--blue);font-weight:600;margin-top:16px;display:inline-flex;align-items:center;gap:4px}
.how-rate svg{width:13px;height:13px;stroke:var(--blue);fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
/* Pros cons */
.pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pc-col h4{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
.pc-col.pros h4{color:var(--green)}
.pc-col.cons h4{color:var(--red)}
.pc-list{list-style:none;display:flex;flex-direction:column;gap:9px;margin: 0;padding: 0;}
.pc-list li{display:flex;align-items:flex-start;gap:8px;font-size:13px;line-height:1.45}
.pi{width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.pi svg{width:9px;height:9px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.pro .pi{background:var(--green)}
.con .pi{background:var(--red)}
.con .pi svg{stroke-width:3}

/* ── PLATFORM OVERVIEW ── */
.platform-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.plat-main{border-radius:var(--r2);overflow:hidden;background:linear-gradient(135deg,#071223,#0d2545 55%,#1a3a6e);min-height:320px;display:flex;align-items:center;justify-content:center;position:relative}
.plat-side{display:flex;flex-direction:column;gap:16px}
.plat-thumb{border-radius:var(--r);overflow:hidden;background:linear-gradient(135deg,#071223,#102040);height:148px;display:flex;align-items:center;justify-content:center}
.explore-link{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:600;color:var(--blue);margin-top:8px;transition:gap .15s}
.explore-link:hover{gap:9px}
.explore-link svg{width:14px;height:14px;stroke:var(--blue);fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}

/* ── STEPS + CONDITIONS ── */
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r2);padding:22px;box-shadow:var(--sh);transition:box-shadow .2s,transform .2s;position:relative;overflow:hidden}
.step-card::before{content:attr(data-n);position:absolute;top:-10px;right:8px;font-size:64px;font-weight:900;color:var(--bgl);z-index:0;line-height:1}
.step-card>*{position:relative;z-index:1}
.step-icon{width:40px;height:40px;border-radius:10px;background:var(--bgl);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.step-icon svg{width:20px;height:20px;stroke:var(--blue);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.step-title{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:6px}
.step-desc{font-size:13px;color:var(--textColor);line-height:1.5}
.step-card:hover{box-shadow:var(--shh);transform:translateY(-2px)}
/* Conditions table */
.cond-table{width:100%;border-collapse:collapse}
.cond-table tr{border-bottom:1px solid var(--border)}
.cond-table tr:last-child{border-bottom:none}
.cond-table td{padding:11px 0;font-size:14px}
.cond-table td:first-child{color:var(--textColor);font-weight:500;width:50%}
.cond-table td:last-child{color:var(--ink);font-weight:700;text-align:right}

/* ── FAQ ── */
.single-broker-page .faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.single-broker-page .faq-item {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    padding: 18px 20px;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    user-select: none;
    align-self: flex-start;
}

.single-broker-page .faq-item:hover,
.faq-item.open {
    border-color: var(--blue);
    box-shadow: 0 4px 18px rgba(0, 91, 255, .08)
}

.single-broker-page .faq-q {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.4
}

.single-broker-page .faq-ch svg {
    width: 16px;
    height: 16px;
    stroke: var(--textColor);
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .2s
}

.single-broker-page .faq-item.open .faq-ch svg {
    transform: rotate(180deg);
    stroke: var(--blue)
}

.single-broker-page .faq-answer {
    font-size: 13px;
    color: var(--textColor);
    margin-top: 10px;
    line-height: 1.6;
    display: none;
    width: 100%;
}

.single-broker-page .faq-item.open .faq-answer {
    display: block
}

/* ── COMPARE CARDS ── */
.compare-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.broker-cmp{background:var(--white);border:1px solid var(--border);border-radius:var(--r2);padding:24px;box-shadow:var(--sh);transition:box-shadow .2s,transform .2s;text-align:center}
.broker-cmp:hover{box-shadow:var(--shh);transform:translateY(-3px)}
.cmp-logo{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:900;margin:0 auto 12px;border:1px solid var(--border)}
.cmp-name{font-size:17px;font-weight:800;margin-bottom:4px}
.cmp-stars{color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:2px}
.cmp-score{font-size:28px;font-weight:900;letter-spacing:-1px;margin-bottom:2px}
.cmp-verdict{font-size:12px;color:var(--textColor);margin-bottom:10px}
.cmp-dep{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:4px}
.cmp-best{font-size:12px;color:var(--blue);background:var(--bgl);padding:3px 10px;border-radius:20px;display:inline-block;margin-bottom:16px;font-weight:600}
.cmp-btns{display:flex;gap:8px}
.cmp-btns button{flex:1}

/* ── FINAL CTA ── */
.final-cta{background:var(--grad);border-radius:20px;padding:52px 48px;display:flex;align-items:center;gap:40px;overflow:hidden;position:relative;margin:0}
.cta-left{flex:1;position:relative;z-index:1}
.cta-logo-big{width:80px;height:80px;border-radius:20px;background:rgba(0,91,255,.25);border:2px solid rgba(0,91,255,.4);display:flex;align-items:center;justify-content:center;font-size:42px;font-weight:900;color:rgba(255,255,255,.9);margin-bottom:20px}
.cta-title{font-size:30px;font-weight:900;color:#fff;letter-spacing:-.6px;line-height:1.15;margin-bottom:10px}
.cta-sub{font-size:15px;color:rgba(255,255,255,.6);margin-bottom:28px;line-height:1.6}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap}
.cta-btn-p{font-size:14px;font-weight:700;padding:12px 26px;background:var(--blue);color:#fff;border:none;border-radius:9px;cursor:pointer;transition:background .2s;font-family:inherit}
.cta-btn-p:hover{background:var(--blue2)}
.cta-btn-s{font-size:14px;font-weight:600;padding:12px 26px;background:rgba(255,255,255,.1);color:#fff;border:1.5px solid rgba(255,255,255,.25);border-radius:9px;cursor:pointer;transition:all .2s;font-family:inherit}
.cta-btn-s:hover{background:rgba(255,255,255,.2)}
/* Phone mockup */
.cta-phone{flex-shrink:0;position:relative;z-index:1}
.phone-outer{width:140px;background:#12172A;border-radius:28px;padding:6px;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.phone-screen{background:#071223;border-radius:23px;overflow:hidden;padding:14px 10px;min-height:260px;display:flex;flex-direction:column;gap:10px}
.phone-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px}
.ph-title{font-size:9px;font-weight:800;color:#fff;font-family:inherit}
.ph-dot{width:6px;height:6px;border-radius:50%;background:#10B981}
.ph-bal{font-size:16px;font-weight:900;color:#fff;font-family:inherit;line-height:1.1}
.ph-change{font-size:8px;color:#10B981;margin-bottom:4px;font-family:inherit}
.ph-chart{flex:1;background:rgba(255,255,255,.03);border-radius:6px;padding:6px;border:1px solid rgba(255,255,255,.06)}
.ph-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.ph-buy{background:rgba(16,185,129,.2);color:#10B981;border-radius:5px;padding:6px;font-size:8px;font-weight:800;text-align:center;font-family:inherit}
.ph-sell{background:rgba(239,68,68,.2);color:#EF4444;border-radius:5px;padding:6px;font-size:8px;font-weight:800;text-align:center;font-family:inherit}

/* ── NEWSLETTER ── */
.newsletter{background:var(--grad);border-radius:20px;padding:36px 48px;display:flex;align-items:center;gap:32px;margin:60px 0 0}
.nl-icon{width:52px;height:52px;flex-shrink:0;background:rgba(255,255,255,.1);border-radius:13px;display:flex;align-items:center;justify-content:center}
.nl-icon svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nl-text{flex:1}
.nl-title{font-size:20px;font-weight:800;color:#fff;margin-bottom:4px;letter-spacing:-.3px}
.nl-sub{font-size:14px;color:rgba(255,255,255,.6)}
.nl-form{display:flex;gap:10px;flex-shrink:0}
.nl-input{width:260px;padding:12px 18px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.1);border-radius:9px;color:#fff;font-size:14px;font-family:inherit;outline:none}
.nl-input::placeholder{color:rgba(255,255,255,.35)}
.nl-input:focus{border-color:rgba(0,91,255,.5)}
.nl-btn{padding:12px 24px;background:var(--blue);color:#fff;border:none;border-radius:9px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .2s;font-family:inherit}
.nl-btn:hover{background:var(--blue2)}


/* ── UTILS ── */
.stars{color:var(--gold);letter-spacing:2px}
.sec-title{font-size:24px;font-weight:800;letter-spacing:-.4px;margin-bottom:6px}
.sec-sub{font-size:15px;color:var(--textColor);margin-bottom:28px}

/* ── RESPONSIVE ── */
@media(max-width:1100px){
  .qs-grid{grid-template-columns:repeat(4,1fr)}
  .qs-item:nth-child(4){border-right:none}
  .qs-item:nth-child(n+5){border-top:1px solid var(--border)}
  .steps-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .verdict-grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .platform-grid{grid-template-columns:1fr}
  .steps-grid{grid-template-columns:1fr 1fr}
  .compare-grid{grid-template-columns:1fr}
  .single-broker-page .faq-grid{grid-template-columns:1fr}
  .newsletter{flex-direction:column;padding:28px 24px}
  .nl-form{flex-direction:column;width:100%}
  .nl-input{width:100%}
  .final-cta{flex-direction:column;padding:36px 28px;gap:28px}
}
@media(max-width:600px){
  .qs-grid{grid-template-columns:repeat(2,1fr)}
  .qs-item:nth-child(2n){border-right:none}
  .qs-item:nth-child(n+3){border-top:1px solid var(--border)}
  .steps-grid{grid-template-columns:1fr}
  .pc-grid{grid-template-columns:1fr}
  .cta-phone{display:none}
  .broker-hero h1{font-size:28px}
  .cta-title{font-size:24px}
}

/* ── HERO VISUAL COL ── */
.hero-visual-col{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-top:4px;
}
.hv-screen{
  background:#071223;
  border-radius:14px;
  padding:14px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 40px rgba(7,18,35,.18);
}
.hv-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.hv-name{font-size:9px;font-weight:700;color:#fff;letter-spacing:1px;font-family:'Inter',sans-serif}
.hv-live{display:flex;align-items:center;gap:4px;font-size:8px;color:rgba(255,255,255,.4);font-family:'Inter',sans-serif}
.hv-dot{width:5px;height:5px;border-radius:50%;background:#10B981;animation:pulse 2s infinite}
.hv-pair{font-size:8px;color:rgba(255,255,255,.4);margin-bottom:3px;font-family:'Inter',sans-serif}
.hv-price{font-size:20px;font-weight:900;color:#fff;letter-spacing:-.5px;line-height:1;font-family:'Inter',sans-serif}
.hv-change{font-size:8px;color:#10B981;margin-bottom:8px;font-family:'Inter',sans-serif}
.hv-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:10px}
.hv-buy{background:rgba(16,185,129,.2);color:#10B981;border-radius:5px;padding:6px;font-size:8px;font-weight:800;text-align:center;font-family:'Inter',sans-serif}
.hv-sell{background:rgba(239,68,68,.2);color:#EF4444;border-radius:5px;padding:6px;font-size:8px;font-weight:800;text-align:center;font-family:'Inter',sans-serif}
.hv-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hv-stat{background:var(--bgl);border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.hv-stat-label{font-size:10px;color:var(--textColor);margin-bottom:3px;font-weight:500}
.hv-stat-val{font-size:16px;font-weight:800;color:var(--ink);letter-spacing:-.3px}
.hv-stat-val.green{color:var(--green)}
.hv-stat-sub{font-size:10px;color:var(--textColor);margin-top:1px}


/* ── RICH HERO ── */
.hero-eyebrow{display:inline-flex;align-items:center;gap:7px;background:var(--bgl);border:1px solid #BFDBFE;color:var(--blue);font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;margin-bottom:16px;letter-spacing:.04em;text-transform:uppercase}
.eyebrow-pulse{width:6px;height:6px;background:var(--blue);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.hero-trust-row{display:flex;align-items:center;gap:16px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border);flex-wrap:wrap}
.htr-item{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--textColor)}
.htr-item svg{width:13px;height:13px;stroke:var(--green);fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.htr-divider{width:1px;height:14px;background:var(--border)}
.htr-divider:last-child{
  display: none;
}
/* Rich rating card */
.rating-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r2);padding:0;box-shadow:var(--shh);overflow:hidden}
.rc-top{padding:24px 24px 20px;text-align:center;border-bottom:1px solid var(--border)}
.rc-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--textColor);margin-bottom:10px}
.rc-stars{color:var(--gold);font-size:20px;letter-spacing:3px;margin-bottom:6px}
.rc-score{font-size:52px;font-weight:900;color:var(--ink);letter-spacing:-2px;line-height:1}
.rc-verdict{font-size:14px;font-weight:700;color:var(--green);margin:6px 0 4px}
.rc-base{font-size:12px;color:var(--textColor)}
.rc-stats{display:grid;grid-template-columns:1fr 1fr;gap:0}
.rc-stat{padding:14px 16px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.rc-stat:nth-child(2n){border-right:none}
.rc-stat:nth-child(3),.rc-stat:nth-child(4){border-bottom:none}
.rc-stat-label{font-size:10px;color:var(--textColor);font-weight:500;margin-bottom:4px}
.rc-stat-val{font-size:16px;font-weight:800;color:var(--ink);letter-spacing:-.3px}
.rc-stat-val.g{color:var(--green)}
.rc-btns{display:flex;flex-direction:column;gap:8px;padding:16px}
.rc-btn-p{width:100%;padding:11px;background:var(--blue);color:#fff;border:none;border-radius:9px;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s;font-family:inherit}
.rc-btn-p:hover{background:var(--blue2)}
.rc-btn-s{width:100%;padding:11px;background:transparent;color:var(--ink);border:1.5px solid var(--border);border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit}
.rc-btn-s:hover{border-color:var(--blue);color:var(--blue)}
.rc-risk{font-size:11px;color:var(--textColor);text-align:center;opacity:.7;padding:0 16px 14px}


/* ── READER REVIEWS ── */
.rr-list { display: flex; flex-direction: column; gap: 14px; }
.rr-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r2);
  padding: 20px 22px;
  box-shadow: var(--sh);
  transition: box-shadow .2s;
}
.rr-card:hover { box-shadow: var(--shh); }
.rr-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.rr-av {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; color: #fff; flex-shrink: 0;
}
.rr-meta { flex: 1; }
.rr-name { font-size: 14px; font-weight: 700; color: var(--ink); line-height: 1.2; }
.rr-stars { font-size: 13px; color: var(--gold); letter-spacing: .5px; }
.rr-badge {
  font-size: 10px; font-weight: 600;
  padding: 3px 9px; border-radius: 20px;
  flex-shrink: 0;
}
.rr-badge.verified { background: #ECFDF5; color: #065F46; }
.rr-badge.unverified { background: var(--bg); color: var(--textColor); }
.rr-title { font-size: 14px; font-weight: 700; color: var(--ink); margin-bottom: 7px; }
.rr-text { font-size: 13px; color: var(--textColor); line-height: 1.65; }
.rr-helpful {
  display: flex; align-items: center; gap: 8px;
  margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 12px; color: var(--textColor);
}
.rr-vote {
  font-size: 12px; padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 6px; background: var(--white);
  cursor: pointer; transition: all .15s; font-family: inherit;
}
.rr-vote:hover { border-color: var(--blue); color: var(--blue); }
.rr-vote.voted { background: var(--bgl); border-color: var(--blue); color: var(--blue); }

/* Form */
.rr-form-wrap { position: sticky; top: 88px; }
.rr-form-card {
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: var(--r2);
  padding: 24px;
  box-shadow: var(--sh);
  position: relative;
}
.rr-form-title { font-size: 17px; font-weight: 800; color: var(--ink); margin-bottom: 5px; letter-spacing: -.2px; }
.rr-form-sub { font-size: 13px; color: var(--textColor); margin-bottom: 20px; line-height: 1.5; }
.rr-field { margin-bottom: 16px; }
.rr-label { display: block; font-size: 12px; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.rr-input, .rr-select {
  width: 100%; padding: 10px 14px;
  border: 1.5px solid var(--border);
  border-radius: 9px; font-size: 14px;
  font-family: inherit; color: var(--ink);
  background: var(--white); outline: none;
  transition: border-color .15s;
}
.rr-input:focus, .rr-select:focus { border-color: var(--blue); }
.rr-input::placeholder { color: var(--textColor); opacity: .6; }
.rr-textarea {
  width: 100%; padding: 10px 14px;
  border: 1.5px solid var(--border);
  border-radius: 9px; font-size: 14px;
  font-family: inherit; color: var(--ink);
  background: var(--white); outline: none;
  resize: vertical; min-height: 100px;
  transition: border-color .15s; line-height: 1.55;
}
.rr-textarea:focus { border-color: var(--blue); }
.rr-textarea::placeholder { color: var(--textColor); opacity: .6; }
.rr-select { cursor: pointer; }

/* Star picker */
.rr-star-picker { display: flex; gap: 4px; margin-bottom: 5px; }
.sp-star {
  font-size: 26px; color: var(--border);
  cursor: pointer; transition: color .12s, transform .12s;
  user-select: none;
}
.sp-star:hover, .sp-star.active { color: var(--gold); transform: scale(1.1); }
.rr-rating-label { font-size: 12px; color: var(--textColor); height: 16px; }

.rr-disclaimer {
  font-size: 11px; color: var(--textColor);
  background: var(--bg); border-radius: 7px;
  padding: 9px 12px; margin-bottom: 14px;
  line-height: 1.5;
}
.rr-submit {
  width: 100%; padding: 12px;
  background: var(--blue); color: #fff;
  border: none; border-radius: 9px;
  font-size: 15px; font-weight: 700;
  cursor: pointer; transition: background .2s;
  font-family: inherit;
}
.rr-submit:hover { background: var(--blue2); }
.rr-submit.success {
  background: var(--green);
  cursor: default;
}
.review-columns{
	display:grid;grid-template-columns:1fr 400px;gap:40px;align-items:start
}

/* Responsive */
@media(max-width:900px) {
  .rr-form-wrap { position: static; }
  .review-columns {
  	grid-template-columns: 1fr !important;
  }
}


.thanks-message{
	z-index: 2;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap:16px;
	padding: 24px;
	border-radius: var(--r2);
	text-align: center;
}
.thanks-message p{
	font-size: 14px;
	margin: 0;
}

/* ═══════════════════════════════
   TRADERANKER RECOMMENDATIONS
═══════════════════════════════ */
.section-white { background: var(--white); }
.tr-rec-head { margin-bottom: 24px; }
.tr-rec-title { font-size: 22px; font-weight: 800; letter-spacing: -.4px; margin-bottom: 6px; }
.tr-rec-sub { font-size: 14px; color: var(--textColor); max-width: 600px; }

.tr-rec-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 16px;
  margin-bottom: 16px;
}

/* Featured */
.tr-rec-featured {
  background: linear-gradient(145deg, #EFF6FF, #F8FAFF);
  border: 1.5px solid #BFDBFE;
  border-radius: var(--r2);
  padding: 28px;
  display: flex; flex-direction: column; gap: 16px;
  text-decoration: none;
  transition: box-shadow .22s, transform .22s, border-color .2s;
  cursor: pointer;
}
.tr-rec-featured:hover {
  box-shadow: 0 14px 44px rgba(37,99,235,.13);
  transform: translateY(-2px);
  border-color: var(--blue);
}
.tr-rec-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--blue); background: rgba(37,99,235,.08);
  padding: 4px 12px; border-radius: 20px; width: fit-content;
}
.tr-rec-feat-top { display: flex; align-items: center; gap: 14px; }
.tr-rec-logo {
  width: 56px; height: 56px; border-radius: 14px;
  border: 1.5px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 900; flex-shrink: 0;
}
.tr-rec-name { font-size: 22px; font-weight: 800; color: var(--ink); letter-spacing: -.4px; }
.tr-rec-stars { font-size: 13px; color: var(--gold); letter-spacing: 1px; margin-top: 2px; }
.tr-rec-score { font-size: 13px; font-weight: 700; color: var(--ink); letter-spacing: 0; }
.tr-rec-desc { font-size: 14px; color: var(--textColor); line-height: 1.65; }
.tr-rec-pills { display: flex; flex-wrap: wrap; gap: 7px; }
.tr-rec-pill {
  font-size: 12px; font-weight: 600;
  background: var(--white); color: var(--ink);
  border: 1px solid var(--border); border-radius: 20px;
  padding: 4px 12px;
}
.tr-rec-btns { display: flex; gap: 10px; margin-top: 4px; }
.tr-rec-btn-p {
  font-size: 14px; font-weight: 700; padding: 11px 22px;
  background: var(--blue); color: #fff;
  border-radius: 9px; cursor: pointer;
}
.tr-rec-btn-s {
  font-size: 14px; font-weight: 600; padding: 11px 22px;
  background: transparent; color: var(--ink);
  border: 1.5px solid var(--border); border-radius: 9px; cursor: pointer;
}

/* Stack cards */
.tr-rec-stack { display: flex; flex-direction: column; gap: 12px; }
.tr-rec-card {
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: var(--r2);
  padding: 18px 20px;
  display: flex; align-items: center; gap: 14px;
  text-decoration: none;
  transition: box-shadow .2s, border-color .2s, transform .2s;
  flex: 1;
}
.tr-rec-card:hover {
  box-shadow: var(--shh); border-color: #BFDBFE; transform: translateY(-1px);
}
.tr-rec-card-logo {
  width: 46px; height: 46px; border-radius: 11px;
  border: 1.5px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 900; flex-shrink: 0;
}
.tr-rec-card-body { flex: 1; min-width: 0; }
.tr-rec-card-badge {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--blue); margin-bottom: 3px;
}
.tr-rec-card-name { font-size: 16px; font-weight: 800; color: var(--ink); margin-bottom: 3px; }
.tr-rec-card-desc { font-size: 12px; color: var(--textColor); line-height: 1.45; }
.tr-rec-card-rating { font-size: 12px; color: var(--gold); margin-top: 5px; letter-spacing: .5px; }
.tr-rec-card-rating strong { color: var(--ink); font-size: 14px; letter-spacing: -.2px; }
.tr-rec-card-link { font-size: 13px; font-weight: 600; color: var(--blue); flex-shrink: 0; white-space: nowrap; }

/* Why box */
.tr-rec-why {
  background: var(--bgl);
  border: 1px solid #C4D9FF;
  border-radius: 12px;
  padding: 16px 20px;
  display: flex; align-items: flex-start; gap: 12px;
  margin-bottom: 20px;
}
.tr-rec-why-icon {
  width: 32px; height: 32px; border-radius: 8px;
  background: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.tr-rec-why-icon svg { width: 16px; height: 16px; }
.tr-rec-why-title { font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 3px; }
.tr-rec-why-text { font-size: 13px; color: var(--textColor); line-height: 1.6; }

/* Compare CTA */
.tr-rec-cta { text-align: center; padding: 20px 0 4px; }
.tr-rec-cta-title { font-size: 14px; font-weight: 600; color: var(--textColor); margin-bottom: 12px; }
.tr-rec-cta-btn {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 700; padding: 12px 26px;
  background: var(--blue); color: #fff;
  border-radius: 9px; transition: background .15s;
}
.tr-rec-cta-btn:hover { background: var(--blue2); }

/* ═══════════════════════════
   WHO SHOULD CHOOSE
═══════════════════════════ */
.who-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.who-card {
  border-radius: 14px; padding: 18px 16px;
  display: flex; flex-direction: column; gap: 8px;
  border: 1.5px solid transparent;
}
.who-yes { background: #F0FDF4; border-color: #BBF7D0; }
.who-no  { background: #FEF2F2; border-color: #FECACA; }
.who-icon {
  width: 30px; height: 30px; border-radius: 50%;
  background: #DCFCE7;
  display: flex; align-items: center; justify-content: center;
}
.who-icon svg { width: 14px; height: 14px; }
.who-icon-no { background: #FEE2E2; }
.who-title { font-size: 14px; font-weight: 700; color: var(--ink); }
.who-desc { font-size: 12px; color: var(--textColor); line-height: 1.5; }

/* ═══════════════════════════
   TRUST TIMELINE
═══════════════════════════ */
.timeline {
  display: flex; align-items: flex-start;
  gap: 0; overflow-x: auto;
  padding-bottom: 8px;
}
.tl-item {
  display: flex; flex-direction: column; align-items: center;
  flex: 1; min-width: 80px; position: relative; text-align: center;
}
.tl-connector {
  position: absolute;
  top: 22px; left: 60%; right: -40%;
  height: 2px; background: var(--border);
  z-index: 0;
}
.tl-last .tl-connector { display: none; }
.tl-icon {
  width: 44px; height: 44px; border-radius: 50%;
  background: #EFF6FF; border: 2px solid #BFDBFE;
  display: flex; align-items: center; justify-content: center;
  position: relative; z-index: 1; margin-bottom: 10px; flex-shrink: 0;
}
.tl-icon svg { width: 18px; height: 18px; }
.tl-icon-done { background: var(--blue); border-color: var(--blue2); }
.tl-label { font-size: 12px; font-weight: 600; color: var(--ink); line-height: 1.3; }

/* ═══════════════════════════
   SIMILAR BROKERS
═══════════════════════════ */
.sim-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.sim-card {
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r2); padding: 20px;
  text-decoration: none;
  transition: box-shadow .2s, border-color .2s, transform .2s;
  display: flex; flex-direction: column; gap: 12px;
}
.sim-card:hover { box-shadow: var(--shh); border-color: #BFDBFE; transform: translateY(-2px); }
.sim-top { display: flex; align-items: center; gap: 12px; }
.sim-logo {
  width: 40px; height: 40px; border-radius: 10px;
  border: 1.5px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 900; flex-shrink: 0;
}
.sim-info { flex: 1; }
.sim-name { font-size: 15px; font-weight: 700; color: var(--ink); }
.sim-stars { font-size: 11px; color: var(--gold); letter-spacing: .5px; margin-top: 2px; }
.sim-score { font-size: 12px; font-weight: 800; color: var(--ink); letter-spacing: -.2px; }
.sim-badge { font-size: 10px; font-weight: 700; padding: 2px 9px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }
.sim-badge-blue { background: #EFF6FF; color: var(--blue); }
.sim-benefit { font-size: 13px; color: var(--textColor); line-height: 1.5; }
.sim-link { font-size: 13px; font-weight: 600; color: var(--blue); }

/* ── Responsive ── */
@media(max-width:900px) {
  .tr-rec-layout { grid-template-columns: 1fr; }
  .tr-rec-stack { flex-direction: row; }
  .who-grid { grid-template-columns: 1fr 1fr; }
  .sim-grid { grid-template-columns: 1fr 1fr; }
  .timeline { flex-wrap: nowrap; }
}
@media(max-width:600px) {
  .tr-rec-stack { flex-direction: column; }
  .who-grid { grid-template-columns: 1fr; }
  .sim-grid { grid-template-columns: 1fr; }
  .tr-rec-btns { flex-direction: column; }
  .timeline { gap: 0; }
  .tl-item { min-width: 60px; }
}


.cond-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media(max-width:700px) {
  .cond-grid { grid-template-columns: 1fr; }
}


/* ── CONTEXT STRIP ── */
.ctx-strip {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  padding: 14px 0;
}
.ctx-inner {
  display: flex;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
}
.ctx-item {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 180px;
  padding: 10px 16px;
}
.ctx-divider {
  width: 1px;
  height: 36px;
  background: var(--border);
  flex-shrink: 0;
}
.ctx-icon {
  width: 34px; height: 34px;
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.ctx-icon svg { width: 16px; height: 16px; }
.ctx-icon-green  { background: #ECFDF5; }
.ctx-icon-blue   { background: #EFF6FF; }
.ctx-icon-purple { background: #EDE9FE; }
.ctx-icon-amber  { background: #FEF3C7; }
.ctx-label {
  font-size: 10px; font-weight: 600;
  color: var(--textColor); text-transform: uppercase;
  letter-spacing: .06em; margin-bottom: 2px;
}
.ctx-val {
  font-size: 13px; font-weight: 600;
  color: var(--ink); line-height: 1.3;
}
@media(max-width:900px) {
  .ctx-inner { gap: 0; }
  .ctx-item { flex: 0 0 50%; border-bottom: 1px solid var(--border); }
  .ctx-divider { display: none; }
}
@media(max-width:500px) {
  .ctx-item { flex: 0 0 100%; }
}


/* ── REVIEW SEO BLOCK ── */
.rev-seo-inner {
  display: block;
  max-width: 760px;
}
.rev-seo-h2 {
  font-size: 20px; font-weight: 800;
  color: var(--ink); letter-spacing: -.3px; margin-bottom: 14px;
}
.rev-seo-h3 {
  font-size: 14px; font-weight: 700;
  color: var(--ink); margin: 20px 0 7px;
}
.rev-seo-p {
  font-size: 13px; color: var(--textColor);
  line-height: 1.78; margin-bottom: 8px;
}
.rev-seo-aside {
  position: sticky; top: 88px;
  display: flex; flex-direction: column; gap: 12px;
}
.rev-seo-aside-block {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
}
.rev-seo-aside-title {
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em;
  color: var(--textColor); margin-bottom: 9px;
}
.rev-seo-nav { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.rev-seo-nav a {
  font-size: 12px; color: var(--textColor);
  transition: color .15s; display: flex; align-items: center; gap: 4px;
}
.rev-seo-nav a::before { content: "›"; color: var(--blue); font-weight: 700; }
.rev-seo-nav a:hover { color: var(--blue); }
.rev-seo-disclaimer {
  font-size: 11px; color: var(--textColor);
  line-height: 1.6; opacity: .65;
}
@media(max-width:900px) {
  .rev-seo-inner { grid-template-columns: 1fr; }
  .rev-seo-aside { position: static; }
  .verdict{
  	margin-top: 0;
  }
  .check-list{
  	margin: 0;
  }
}


/* Recommendations — clean version */
.tr-rec-btn-only {
  display: inline-block;
  margin-top: 8px;
  font-size: 14px; font-weight: 700;
  padding: 12px 28px;
  background: var(--blue);
  color: #fff; border-radius: 10px;
  text-decoration: none;
  transition: background .15s;
  box-shadow: 0 4px 14px rgba(37,99,235,.25);
}
.tr-rec-btn-only:hover { background: var(--blue2); }
.tr-rec-visit-btn {
  font-size: 12px; font-weight: 700;
  color: var(--blue); white-space: nowrap;
  text-decoration: none; flex-shrink: 0;
  padding: 6px 12px;
  border: 1.5px solid var(--blue);
  border-radius: 7px;
  transition: all .15s;
  align-self: center;
}
.tr-rec-visit-btn:hover { background: var(--blue); color: #fff; }


/*---------------end SINGLE BROKER---------------*/
/*----------------ARCHIVE BROKER----------------*/
 /* ── BREADCRUMB ──────────────────────────────────────── */
  .breadcrumb {
    max-width: 1160px; margin: 0 auto;
    padding: 16px 24px 0;
    font-size: 13px; color: var(--textColor);
    display: flex; gap: 6px; align-items: center;
  }
  .breadcrumb span { color: var(--ink); font-weight: 500; }

  /* ── HERO ────────────────────────────────────────────── */
  .archive-hero {
    max-width: 1160px; margin: 0 auto;
    padding: 40px 24px 48px;
    display: grid; grid-template-columns: 1fr 480px; gap: 48px;
    align-items: center;
  }
  .hero-left{
  	position: relative;
  	z-index: 1;
  }
  .hero-left h1 {
    font-size: 42px; font-weight: 800; line-height: 1.15;
    letter-spacing: -.5px; margin: 0 0 16px;
  }
  .hero-left p {
    font-size: 16px; color: var(--textColor); max-width: 460px; margin-bottom: 28px;
  }
  .hero-badges {
    display: flex; gap: 20px; flex-wrap: wrap;
  }
  .hero-badge {
    display: flex; align-items: center; gap: 8px;
    font-size: 13px; font-weight: 600; color: var(--ink);
  }
  .hero-badge-icon {
    width: 32px; height: 32px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; flex-shrink: 0;
  }
  .hero-badge-icon.blue { background: #EFF6FF; }
  .hero-badge-icon.green { background: #ECFDF5; }
  .hero-badge-icon.purple { background: #F5F3FF; }
  .hero-meta {
    margin-top: 24px; font-size: 13px; color: var(--textColor);
    display: flex; gap: 16px; align-items: center;
  }
  .hero-meta span { display: flex; align-items: center; gap: 5px; }

  /* Platform mockup */
  .hero-right { position: relative; }
  .mockup-wrap {
    position: relative; width: 100%;
  }
  .mockup-main {
    background: #07162F; border-radius: 16px;
    padding: 20px; box-shadow: 0 24px 60px rgba(0,91,255,.18);
    margin-left: 40px;
  }
  .mock-topbar {
    display: flex; align-items: center; gap: 10px;
    margin-bottom: 16px;
  }
  .mock-logo {
    background: var(--blue); border-radius: 6px;
    padding: 4px 8px; font-size: 11px; font-weight: 800; color: #fff;
  }
  .mock-label { font-size: 11px; color: #8899BB; }
  .mock-live {
    margin-left: auto; background: #16A34A;
    border-radius: 20px; padding: 2px 8px;
    font-size: 10px; font-weight: 700; color: #fff;
  }
  .mock-pair { font-size: 13px; color: #AAB8D0; margin-bottom: 2px; }
  .mock-price { font-size: 28px; font-weight: 800; color: #fff; }
  .mock-change { font-size: 12px; color: #16A34A; margin-bottom: 16px; }
  .mock-chart {
    height: 80px; position: relative; overflow: hidden;
    margin-bottom: 16px;
  }
  .mock-chart svg { width: 100%; height: 100%; }
  .mock-btns { display: flex; gap: 8px; }
  .mock-btn {
    flex: 1; padding: 10px; border-radius: 8px;
    font-size: 13px; font-weight: 700; border: none; cursor: pointer;
  }
  .mock-btn.buy { background: var(--green); color: #fff; }
  .mock-btn.sell { background: var(--red); color: #fff; }
  .mock-stats {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px;
  }
  .mock-stat-card {
    background: rgba(255,255,255,.06); border-radius: 10px; padding: 10px 12px;
  }
  .mock-stat-label { font-size: 10px; color: #8899BB; margin-bottom: 2px; }
  .mock-stat-val { font-size: 18px; font-weight: 800; color: #fff; }
  .mock-stat-sub { font-size: 11px; color: #16A34A; }

  .mockup-mini {
    position: absolute; left: 0; top: 50%;
    transform: translateY(-50%);
    background: #07162F; border-radius: 12px; padding: 14px;
    width: 140px; box-shadow: 0 12px 32px rgba(0,0,0,.25);
  }
  .mini-label { font-size: 10px; color: #8899BB; margin-bottom: 4px; }
  .mini-val { font-size: 18px; font-weight: 800; color: #fff; }
  .mini-sub { font-size: 11px; color: #16A34A; }

  /* ── FILTER BAR ──────────────────────────────────────── */
  .filter-wrap {
    max-width: 1160px; margin: 0 auto;
    padding: 0 24px 20px;
  }
  .filter-bar {
    background: var(--white); border: 1px solid var(--border);
    border-radius: 12px; padding: 12px 16px;
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  }
  .search-box {
    display: flex; align-items: center; gap: 8px;
    border: 1px solid var(--border); border-radius: 8px;
    padding: 7px 12px; background: var(--bg); flex: 1; min-width: 160px;
  }
  .search-box input {
    border: none; background: none; font-size: 13px;
    color: var(--ink); outline: none; width: 100%;
  }
  .filter-tabs { display: flex; gap: 4px; }
  .ftab {
    padding: 7px 14px; border-radius: 8px; font-size: 13px; font-weight: 500;
    border: none; cursor: pointer; background: none; color: var(--textColor);
    transition: all .2s;
  }
  .ftab.active { background: var(--blue); color: #fff; }
  .ftab:hover:not(.active) { background: var(--bg); color: var(--ink); }
  .sort-wrap {
    margin-left: auto; display: flex; align-items: center; gap: 8px;
    font-size: 13px; color: var(--textColor);
  }
  .sort-select {
    border: 1px solid var(--border); border-radius: 8px;
    padding: 7px 12px; font-size: 13px; background: var(--bg);
    color: var(--ink); outline: none; cursor: pointer;
  }

  /* ── TABLE ───────────────────────────────────────────── */
  .table-wrap {
    max-width: 1160px; margin: 0 auto;
    padding: 0 24px 48px;
    overflow-x: auto;
  }
  .archive-broker-table {
    /*min-width: 900px;*/
  }
  .archive-broker-table {
    background: var(--white); border: 1px solid var(--border);
    border-radius: 16px; overflow: hidden;
    width: 100%;
  }
  .table-head {
    display: grid;
    grid-template-columns: 220px 160px 110px 100px 1fr 110px 130px;
    padding: 12px 24px;
    border-bottom: 1px solid var(--border);
    background: var(--bg);
  }
  .th {
    font-size: 12px; font-weight: 600; color: var(--textColor);
    text-transform: uppercase; letter-spacing: .4px;
    display: flex; align-items: center; gap: 4px;
  }
  .th svg { opacity: .5; }

  .broker-row {
    display: grid;
    grid-template-columns: 220px 160px 110px 100px 1fr 110px 130px;
    padding: 20px 24px; align-items: center;
    border-bottom: 1px solid var(--border);
    transition: background .15s;
    position: relative;
  }
  .broker-row:last-child { border-bottom: none; }
  .broker-row:hover { background: #F9FBFF; }
  .broker-row.top { background: #FFF8E7; }
  .broker-row.top:hover { background: #FFF3CC; }

  .broker-name-cell {
    display: flex; align-items: center; gap: 12px;
  }
  .broker-logo {
    width: 40px; height: 40px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 12px; flex-shrink: 0;
    border: 1px solid var(--border);
  }
  .broker-info { display: flex; flex-direction: column; gap: 2px; }
  .broker-name { font-size: 15px; font-weight: 700; color: var(--ink); }
  .broker-cat { font-size: 11px; color: var(--textColor); }

  .broker-row .stars { display: flex; gap: 2px; align-items: center;letter-spacing: normal; }
  .broker-row .star { color: var(--gold); font-size: 14px; }
  .broker-row .star.half { opacity: .4; }
  .broker-row .rating-num {
    font-size: 15px; font-weight: 700; color: var(--ink); margin-left: 6px;
  }

  .cell-val {
    font-size: 14px; font-weight: 600; color: var(--ink);
  }
  .cell-muted { font-size: 12px; color: var(--textColor); }

  .assets-list { font-size: 12px; color: var(--textColor); line-height: 1.5; }

  .demo-badge {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 12px; font-weight: 600;
    padding: 3px 10px; border-radius: 20px;
  }
  .demo-badge.yes { background: #ECFDF5; color: var(--green); }
  .demo-badge.no  { background: #FEF2F2; color: var(--red); }

  .btn-review-link {
    display: inline-block; padding: 8px 16px;
    border: 1.5px solid var(--border); border-radius: 8px;
    font-size: 13px; font-weight: 600; color: var(--blue);
    background: var(--white); cursor: pointer; transition: all .2s;
    white-space: nowrap; width: 100%; text-align: center;
  }
  .btn-review-link:hover { border-color: var(--blue); background: #EFF6FF; }
  .btn-review-link:before{
    content:'';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 2;
  }
  /* ── SEO TEXT BLOCK ─────────────────────────────────── */
  .seo-block {
    max-width: 1160px; margin: 0 auto;
    padding: 0 24px 64px;
  }
  .seo-text h2 {
    font-size: 26px; font-weight: 800; margin-bottom: 16px; line-height: 1.25;
  }
  .seo-text p {
    font-size: 15px; color: var(--textColor); margin-bottom: 14px; line-height: 1.75;
  }
  .seo-text p:last-child { margin-bottom: 0; }

  /* ── DISCLAIMER ─────────────────────────────────────── */
  .disclaimer {
    max-width: 1160px; margin: 0 auto;
    padding: 0 24px 48px;
    font-size: 12px; color: var(--textColor);
    display: flex; align-items: flex-start; gap: 8px;
  }
  .disclaimer svg { flex-shrink: 0; margin-top: 1px; }


  /* ── RESPONSIVE ─────────────────────────────────────── */
  @media (max-width: 1100px) {
    .archive-hero { grid-template-columns: 1fr; }
    .hero-right { display: none; }
    .table-head, .broker-row {
      grid-template-columns: 180px 150px 100px 90px 1fr 100px 120px;
    }
  }
  @media (max-width: 900px) {
    .table-head { display: none; }
    .broker-row {
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }
    .broker-name-cell { grid-column: 1 / -1; }
    .seo-block { grid-template-columns: 1fr; }
    .filter-bar { flex-direction: column; align-items: stretch; }
    .sort-wrap { margin-left: 0; }
  }
  @media (max-width: 600px) {
    .hero-left h1 { font-size: 28px; }
    .nav-links { display: none; }
    .broker-row { grid-template-columns: 1fr; }
  }
/*----------------end ARCHIVE BROKER----------------*/
/*temporary*/
.section-news{
	display: none;
}
@media(max-width:767px){
	#newPostForm form p label textarea{
		height: 150px;
	}
}