.acr-widget, .acr-widget *{ box-sizing:border-box; }

.acr-widget{
	--acr-bg: #EEF1F6;
	--acr-card: #FFFFFF;
	--acr-ink: #171B24;
	--acr-ink-soft: #5B6274;
	--acr-ink-faint: #9298A8;
	--acr-line: #DBDFE7;
	--acr-orange: #FF5C00;
	--acr-orange-deep: #D94A00;
	--acr-amber: #FFB25C;
	--acr-glow: rgba(255,92,0,.35);
	--acr-radius: 18px;

	color:var(--acr-ink);
	font-family:'Vazirmatn', Tahoma, sans-serif;
	-webkit-font-smoothing:antialiased;
	line-height:1.5;
	border-radius:24px;
	overflow:hidden;
}

.acr-page{
	max-width:920px;
	margin:0 auto;
	padding: clamp(40px, 6vw, 88px) clamp(20px, 5vw, 40px) clamp(64px, 8vw, 120px);
}

/* ---------- HERO ---------- */
.acr-hero{ text-align:center; margin-bottom: clamp(48px, 7vw, 84px); }

.acr-eyebrow{
	display:inline-flex;
	align-items:center;
	gap:10px;
	padding:7px 16px;
	border:1px solid var(--acr-line);
	background:var(--acr-card);
	border-radius:999px;
	font-size:.78rem;
	letter-spacing:.02em;
	color:var(--acr-ink-soft);
	margin-bottom:22px;
}
.acr-eyebrow b{
	font-family:'JetBrains Mono', monospace;
	direction:ltr;
	unicode-bidi:isolate;
	color:var(--acr-orange-deep);
	font-weight:600;
	letter-spacing:.06em;
}
.acr-eyebrow .acr-dot{ width:5px; height:5px; border-radius:50%; background:var(--acr-orange); flex:none; }

.acr-hero h1{
	margin:0 0 16px;
	font-size:clamp(1.9rem, 4.4vw, 2.9rem);
	font-weight:800;
	line-height:1.35;
	letter-spacing:-.01em;
}
.acr-hero h1 .acr-brand{
	color:var(--acr-orange);
	white-space:nowrap;
}

.acr-hero p{
	margin:0 auto;
	max-width:520px;
	color:var(--acr-ink-soft);
	font-size:clamp(.98rem, 1.6vw, 1.08rem);
	line-height:1.9;
}

/* ---------- TIMELINE ---------- */
.acr-timeline{ position:relative; }

.acr-steps{
	list-style:none;
	margin:0;
	padding:0;
	padding-inline-end: clamp(58px, 9vw, 84px);
	position:relative;
}

.acr-steps::before{
	content:"";
	position:absolute;
	inset-inline-end: clamp(20px, 3.6vw, 30px);
	top:26px;
	bottom:26px;
	width:2px;
	background:var(--acr-line);
	border-radius:2px;
}

.acr-spine-fill{
	position:absolute;
	inset-inline-end: clamp(20px, 3.6vw, 30px);
	top:26px;
	width:2px;
	height:0%;
	background:linear-gradient(to bottom, var(--acr-amber), var(--acr-orange) 70%, var(--acr-orange-deep));
	border-radius:2px;
	box-shadow:0 0 14px var(--acr-glow);
	transition:height .7s cubic-bezier(.3,.8,.3,1);
	z-index:1;
}

.acr-step{
	position:relative;
	display:flex;
	justify-content:flex-end;
	padding-bottom: clamp(22px, 3.4vw, 34px);
	opacity:0;
	transform:translateY(22px);
	transition:opacity .6s ease, transform .6s ease;
}
.acr-step:last-child{ padding-bottom:0; }
.acr-step.acr-in-view{ opacity:1; transform:none; }

.acr-node{
	position:absolute;
	inset-inline-end: clamp(20px, 3.6vw, 30px);
	top:2px;
	transform:translateX(-50%);
	width:40px;
	height:40px;
	border-radius:50%;
	background:var(--acr-card);
	border:2px solid var(--acr-line);
	display:flex;
	align-items:center;
	justify-content:center;
	z-index:2;
	transition:border-color .45s ease, background .45s ease, box-shadow .45s ease;
}

.acr-node .acr-num{
	font-family:'JetBrains Mono', monospace;
	font-size:.76rem;
	font-weight:600;
	color:var(--acr-ink-faint);
	direction:ltr;
	unicode-bidi:isolate;
	transition:color .45s ease;
}

.acr-step.acr-in-view .acr-node{
	border-color:var(--acr-orange);
	background:linear-gradient(160deg, var(--acr-orange), var(--acr-orange-deep));
	box-shadow:0 0 0 6px var(--acr-glow);
}
.acr-step.acr-in-view .acr-node .acr-num{ color:#fff; }

.acr-card{
	width:100%;
	max-width:640px;
	margin-inline-end: 60px;
	background:var(--acr-card);
	border:1px solid var(--acr-line);
	border-radius:var(--acr-radius);
	padding: 18px 22px;
	box-shadow:0 1px 2px rgba(23,27,36,.03);
	transition:border-color .4s ease, box-shadow .4s ease, transform .3s ease;
}
.acr-step.acr-in-view .acr-card:hover{
	transform:translateY(-2px);
	box-shadow:0 10px 24px rgba(23,27,36,.08);
	border-color:#EBD3C4;
}

.acr-card h3{
	margin:0 0 6px;
	font-size:clamp(1rem, 1.9vw, 1.12rem);
	font-weight:700;
	line-height:1.6;
}
.acr-card p{
	margin:0;
	color:var(--acr-ink-soft);
	font-size:.92rem;
	line-height:1.85;
}

/* final step emphasis */
.acr-step.acr-final .acr-node{
	width:52px; height:52px;
	top:-6px;
	border-width:2px;
}
.acr-step.acr-final .acr-card{ margin-inline-end:72px; }
.acr-step.acr-final .acr-card h3{
	font-weight:800;
	color:var(--acr-orange-deep);
}
.acr-step.acr-final.acr-in-view .acr-node{
	background:radial-gradient(circle at 35% 30%, var(--acr-amber), var(--acr-orange) 55%, var(--acr-orange-deep));
	box-shadow:0 0 0 8px var(--acr-glow), 0 0 26px 4px rgba(255,92,0,.5);
	animation:acr-pulse 2.2s ease-in-out infinite;
}
.acr-step.acr-final .acr-node svg{ width:20px; height:20px; display:none; }
.acr-step.acr-final.acr-in-view .acr-node .acr-num{ display:none; }
.acr-step.acr-final.acr-in-view .acr-node svg{ display:block; }

@keyframes acr-pulse{
	0%, 100%{ box-shadow:0 0 0 8px var(--acr-glow), 0 0 26px 4px rgba(255,92,0,.5); }
	50%{ box-shadow:0 0 0 11px var(--acr-glow), 0 0 34px 8px rgba(255,92,0,.65); }
}

/* ---------- CTA ---------- */
.acr-cta{
	margin-top: clamp(52px, 7vw, 88px);
	text-align:center;
	padding: clamp(30px, 5vw, 46px);
	background-color:#1B1E27;
	border-radius:22px;
	position:relative;
	overflow:hidden;
}
.acr-cta::before{
	content:"";
	position:absolute;
	inset:0;
	background:radial-gradient(420px 220px at 80% 0%, rgba(255,92,0,.35), transparent 65%);
	pointer-events:none;
}
.acr-cta p{
	position:relative;
	margin:0 0 18px;
	color:#F2F0EA;
	font-size:clamp(1.02rem, 1.9vw, 1.2rem);
	font-weight:600;
}
.acr-btn{
	position:relative;
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:13px 30px;
	background:var(--acr-orange);
	color:#fff;
	text-decoration:none;
	font-weight:700;
	font-size:.98rem;
	border-radius:999px;
	box-shadow:0 8px 20px rgba(255,92,0,.35);
	transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.acr-btn:hover{
	background:var(--acr-orange-deep);
	transform:translateY(-2px);
	box-shadow:0 12px 26px rgba(255,92,0,.45);
	color:#fff;
}
.acr-btn svg{ width:16px; height:16px; }

@media (max-width: 560px){
	.acr-card{ padding:15px 16px; margin-inline-end:48px; }
	.acr-step.acr-final .acr-card{ margin-inline-end:58px; }
}

@media (prefers-reduced-motion: reduce){
	.acr-step{ opacity:1; transform:none; transition:none; }
	.acr-spine-fill{ transition:none; }
	.acr-step.acr-final.acr-in-view .acr-node{ animation:none; }
	.acr-btn, .acr-card{ transition:none; }
}
