/* Referral Program page — hero tweaks (reuses partners.css for base/header/hero) */
.referral-hero .hero-description{margin-bottom:16px}
.referral-hero .hero-subdescription{
	font-family:"Outfit",sans-serif;
	font-weight:400;
	font-size:16px;
	line-height:1.6;
	color:#4a6070;
	margin:0 0 32px;
	max-width:560px;
}
@media(max-width:991px){
	.referral-hero .hero-subdescription{font-size:14px;margin-bottom:24px}
}
html[dir=rtl] .referral-hero .hero-subdescription{text-align:right}

/* ── How It Works / Simple Steps ─────────────────────────── */
.referral-steps{
	position:relative;
	background:#0c151f url(../img/referral-program/bg-referral.png) center/cover no-repeat;
	padding:80px 0;
	overflow:hidden;
}
.referral-steps .container{position:relative;z-index:1}
.referral-badge{
	display:inline-block;
	background:rgba(255,117,34,.12);
	border:1px solid rgba(255,117,34,.3);
	color:#ff7522;
	font-family:"Outfit",sans-serif;font-weight:600;font-size:13px;line-height:1.5;
	padding:9px 22px;border-radius:999px;
}
.referral-steps-title{
	margin:16px 0 0;
	font-family:"Outfit",sans-serif;font-weight:700;
	font-size:clamp(1.75rem,3.4vw,2.625rem);line-height:1.2;
	color:#f8f9fa;
}
.referral-steps-grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
	margin-top:56px;align-items:stretch;
}
.referral-step-card{
	display:flex;flex-direction:column;
	background:rgba(255,255,255,.04);
	border:1px solid rgba(255,255,255,.1);
	border-radius:16px;padding:33px;
}
.referral-step-num{
	width:48px;height:48px;border-radius:12px;
	background:linear-gradient(135deg,#ff7522 0%,#d94f00 100%);
	display:flex;align-items:center;justify-content:center;
	color:#fff;font-family:"Outfit",sans-serif;font-weight:700;font-size:18px;
	margin-bottom:20px;flex-shrink:0;
}
.referral-step-title{
	margin:0;font-family:"Outfit",sans-serif;font-weight:700;
	font-size:20px;line-height:1.3;color:#f8f9fa;
}
.referral-step-desc{
	margin:12px 0 0;font-family:"Outfit",sans-serif;font-weight:400;
	font-size:15px;line-height:1.6;color:rgba(248,249,250,.65);
}
.referral-step-link{
	margin-top:auto;padding-top:20px;
	display:inline-flex;align-items:center;gap:8px;
	font-family:"Outfit",sans-serif;font-weight:600;font-size:14px;
	color:#ff7522;text-decoration:none;
}
.referral-step-link svg{width:14px;height:14px;flex-shrink:0;transition:transform .2s ease}
.referral-step-link:hover svg{transform:translateX(3px)}
.referral-steps-cta{display:flex;justify-content:center;margin-top:40px}
.referral-steps-cta .button--primary{
	display:inline-flex;align-items:center;justify-content:center;
	padding:16px 40px;border-radius:8px;
	font-family:"Outfit",sans-serif;font-weight:700;font-size:16px;color:#f8f9fa;
	background:linear-gradient(180deg,#ff7522 0%,#d94f00 100%);
	text-decoration:none;
	box-shadow:0 9px 9px rgba(55,47,42,.09),0 2px 5px rgba(55,47,42,.1);
	transition:transform .2s ease,box-shadow .2s ease;
}
.referral-steps-cta .button--primary:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(255,117,34,.35)}
@media(max-width:991px){
	.referral-steps{padding:60px 0}
	.referral-steps-grid{grid-template-columns:1fr;margin-top:32px}
	.referral-steps-cta .button--primary{width:100%}
}
html[dir=rtl] .referral-step-link svg{transform:scaleX(-1)}
html[dir=rtl] .referral-step-link:hover svg{transform:scaleX(-1) translateX(3px)}

/* ── Benefits / Why Join + Key Points ────────────────────── */
.referral-benefits{background:#fff;padding:80px 0}
.referral-benefits-grid{
	display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;
	max-width:1200px;margin:0 auto;
}
.referral-benefits-title{
	margin:16px 0 0;font-family:"Outfit",sans-serif;font-weight:700;
	font-size:clamp(1.75rem,3.4vw,2.625rem);line-height:1.2;color:#142333;
}
.referral-benefits-desc{
	margin:24px 0 0;font-family:"Outfit",sans-serif;font-weight:500;
	font-size:18px;line-height:1.5;color:#2e4054;max-width:520px;
}
.referral-benefits-btn{
	display:inline-flex;align-items:center;justify-content:center;
	margin-top:40px;padding:16px 40px;border-radius:8px;
	font-family:"Outfit",sans-serif;font-weight:700;font-size:16px;color:#f8f9fa;
	background:linear-gradient(180deg,#ff7522 0%,#d94f00 100%);text-decoration:none;
	box-shadow:0 9px 9px rgba(55,47,42,.09),0 2px 5px rgba(55,47,42,.1);
	transition:transform .2s ease,box-shadow .2s ease;
}
.referral-benefits-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(255,117,34,.35)}
.referral-keypoints{
	background:#142333;border:1px solid rgba(255,255,255,.08);
	border-radius:20px;padding:33px;
}
.referral-keypoints-title{
	margin:0 0 20px;font-family:"Outfit",sans-serif;font-weight:700;
	font-size:18px;line-height:1.5;color:#f8f9fa;
}
.referral-keypoints-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.referral-keypoints-list li{
	display:flex;gap:12px;align-items:flex-start;
	font-family:"Outfit",sans-serif;font-weight:400;font-size:16px;line-height:1.5;
	color:rgba(248,249,250,.8);
}
.referral-check{
	flex-shrink:0;width:20px;height:20px;border-radius:50%;
	background:linear-gradient(135deg,#ff7522 0%,#d94f00 100%);
	display:flex;align-items:center;justify-content:center;margin-top:2px;
}
.referral-check svg{width:11px;height:11px;display:block}
@media(max-width:991px){
	.referral-benefits{padding:60px 0}
	.referral-benefits-grid{grid-template-columns:1fr;gap:32px}
	.referral-benefits-btn{width:100%}
}
html[dir=rtl] .referral-benefits-desc{text-align:right}

/* ── Everything You Need (CTA cards) ─────────────────────── */
.referral-everything{
	position:relative;
	background:#0c151f url(../img/referral-program/bg-last-referral.png) center/cover no-repeat;
	padding:80px 0;overflow:hidden;
}
.referral-everything .container{position:relative;z-index:1}
.referral-everything-title{
	text-align:center;margin:0;font-family:"Outfit",sans-serif;font-weight:700;
	font-size:clamp(1.75rem,3.4vw,2.625rem);line-height:1.2;color:#f8f9fa;
}
.referral-cta-grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
	margin-top:56px;align-items:stretch;
}
.referral-cta-card{
	display:flex;flex-direction:column;
	background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
	border-radius:20px;padding:33px;
}
.referral-cta-card--highlight{
	background:linear-gradient(133deg,rgba(255,117,34,.15) 0%,rgba(217,79,0,.1) 100%);
	border-color:rgba(255,117,34,.3);
}
.referral-cta-icon{
	width:44px;height:44px;border-radius:10px;flex-shrink:0;margin-bottom:20px;
	display:flex;align-items:center;justify-content:center;
	background:rgba(255,117,34,.15);color:#ff7522;
}
.referral-cta-card--highlight .referral-cta-icon{
	background:linear-gradient(135deg,#ff7522 0%,#d94f00 100%);color:#fff;
}
.referral-cta-icon svg{width:20px;height:20px;display:block}
.referral-cta-label{
	margin:0;font-family:"Outfit",sans-serif;font-weight:600;font-size:12px;
	letter-spacing:.96px;text-transform:uppercase;color:#ff7522;
}
.referral-cta-title{
	margin:16px 0 0;font-family:"Outfit",sans-serif;font-weight:700;
	font-size:22px;line-height:1.3;color:#f8f9fa;
}
.referral-cta-desc{
	margin:8px 0 0;font-family:"Outfit",sans-serif;font-weight:400;
	font-size:15px;line-height:1.6;color:rgba(248,249,250,.65);
}
.referral-cta-action{margin-top:auto;padding-top:24px}
.referral-cta-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:8px;
	padding:16px 32px;border-radius:8px;
	font-family:"Outfit",sans-serif;font-weight:700;font-size:16px;text-decoration:none;
	transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;
}
.referral-cta-btn--solid{
	color:#f8f9fa;background:linear-gradient(180deg,#ff7522 0%,#d94f00 100%);
	box-shadow:0 9px 9px rgba(55,47,42,.09),0 2px 5px rgba(55,47,42,.1);
}
.referral-cta-btn--solid:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(255,117,34,.35)}
.referral-cta-btn--outline{color:#ff7522;background:transparent;border:1px solid #ff7522}
.referral-cta-btn--outline svg{width:18px;height:18px;flex-shrink:0}
.referral-cta-btn--outline:hover{background:#ff7522;color:#fff}
@media(max-width:991px){
	.referral-everything{padding:60px 0}
	.referral-cta-grid{grid-template-columns:1fr;margin-top:32px}
	.referral-cta-btn{width:100%}
}
html[dir=rtl] .referral-cta-btn--outline svg{transform:scaleX(-1)}