/* =========================================
   AVANSEN — GLOBAL
========================================= */

@font-face {
	font-family: "Gofteh";
	src: url("../fonts/GoftehFaNumWeb-Heavy.woff2") format("woff2");
	font-style: normal;
	font-weight: 800;
	font-display: swap;
}


@font-face {
    font-family: "Kalameh";
    src: url("../fonts/KALAMEH THIN.ttf") format("truetype");
    font-style: normal;
    font-weight: 100;
    font-display: swap;
}
  

@font-face {
	font-family: "Kalameh";
	src: url("../fonts/KALAMEH REGULAR.TTF") format("truetype");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Kalameh";
	src: url("../fonts/KALAMEH BOLD.TTF") format("truetype");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "Kalameh";
	src: url("../fonts/KALAMEH BLACK.TTF") format("truetype");
	font-style: normal;
	font-weight: 900;
	font-display: swap;
}

@font-face {
	font-family: "Candara";
	src: url("../fonts/CANDARAL.TTF") format("truetype");
	font-style: normal;
	font-weight: 300;
	font-display: swap;
}

@font-face {
	font-family: "Candara";
	src: url("../fonts/CANDARA.TTF") format("truetype");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Candara";
	src: url("../fonts/CANDARAB.TTF") format("truetype");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "Asta Sans";
	src: url("../fonts/asta-sans-latin-wght-normal.woff2") format("woff2");
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
}

@font-face {
	font-family: "Michroma";
	src: url("../fonts/Michroma.ttf") format("truetype");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}


:root {
	--av-bg: #000000;
	--av-white: #FFFFFF;
	--av-orange: #FF5A00;

	--av-page-padding: 48px;
	--av-container: 1344px;

	--av-section-gap: 140px;
	--av-section-gap-tablet: 120px;
	--av-section-gap-mobile: 80px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	background: var(--av-bg);
	color: var(--av-white);
	direction: rtl;
	overflow-x: hidden;
	font-family: "Kalameh", sans-serif;
}

.av-home-page button,
.av-home-page input,
.av-home-page textarea,
.av-home-page select {
    font-family: "Kalameh", sans-serif;
}

a {
	color: inherit;
	text-decoration: none;
}

img {
	display: block;
	max-width: 100%;
}


/* =========================================
   HEADER
========================================= */

.av-header {
	position: fixed;

	top: 64px;
	right: 0;
	left: 0;

	width: 100%;

	z-index: 1000;

	color: #FFFFFF;

	isolation: isolate;
}

.av-header__inner {
	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	display: grid;
	grid-template-columns: 220px 1fr 220px;

	align-items: center;

	direction: ltr;
}


/* =========================================
   LEFT ENGLISH DESCRIPTOR
========================================= */

.av-header__descriptor {
	justify-self: start;

	display: flex;
	flex-direction: column;
	align-items: flex-start;

	font-family: "Candara", sans-serif;
	font-size: 20px;
	font-weight: 400;
	font-style: normal;

	line-height: 1.05;

	direction: ltr;
	text-align: left;

	color: #FFFFFF;
}

.av-header__descriptor span {
	display: block;
	color: #FFFFFF;
}


/* =========================================
   NAVIGATION
========================================= */

.av-header__nav {
	justify-self: center;

	display: flex;
	align-items: center;
	justify-content: center;

	gap: 80px;

	direction: rtl;
}

.av-header__nav a {
	font-family: "Kalameh", sans-serif;
	font-size: 22px;
	font-weight: 400;
	font-style: normal;

	line-height: 1;

	color: #FFFFFF;
	white-space: nowrap;
}


/* =========================================
   LOGO
========================================= */

.av-header__logo {
	justify-self: end;

	display: inline-flex;
	align-items: flex-start;
	justify-content: flex-end;

	direction: ltr;
}

.av-header__logo img {
	display: block;

	width: 154px;
	height: auto;
}


/* Hide old CSS placeholder elements */
.av-header__logo-light,
.av-header__logo-text {
	display: none;
}



/* =========================================
   HEADER / SCROLL BACKDROP
========================================= */


.av-header__backdrop {
	position: absolute;

	top: -64px;
	right: 0;
	left: 0;

	width: 100%;
	height: 190px;

	z-index: -1;

	pointer-events: none;

	opacity: 0;

	background:
		radial-gradient(
			ellipse 55% 150% at 50% 0%,
			rgba(255, 77, 26, 0.24) 0%,
			rgba(255, 77, 26, 0.10) 38%,
			transparent 72%
		),
		linear-gradient(
			to bottom,
			rgba(0, 0, 0, 0.98) 0%,
			rgba(0, 0, 0, 0.90) 55%,
			rgba(0, 0, 0, 0) 100%
		);

	transition: opacity 450ms ease;

	will-change: opacity;
}

.av-header.is-scrolled .av-header__backdrop {
	opacity: 1;
}

/* =========================================
   HERO
========================================= */

.av-hero {
	position: relative;

	width: 100vw;
	height: auto;
	aspect-ratio: 16 / 9;

	margin: 0;
	padding: 0;

	overflow: hidden;
	background: #000000;
}


/* HERO IMAGE */

.av-hero__media {
	position: absolute;
	inset: 0;

	width: 100%;
	height: 100%;

	margin: 0;
	padding: 0;

	z-index: 0;
}


.av-hero__media img {
	position: absolute;
	inset: 0;

	width: 100%;
	height: 100%;

	max-width: none;

	margin: 0;
	padding: 0;

	display: block;

	object-fit: cover;
	object-position: center center;
}


/* =========================================
   HERO OVERLAY
========================================= */

.av-hero__shade {
	position: absolute;
	inset: 0;

	z-index: 1;

	pointer-events: none;

	background: linear-gradient(
		90deg,
		rgba(11, 10, 10, 0) 0%,
		rgba(11, 10, 10, 0) 44%,
		rgba(11, 10, 10, 0.06) 65%,
		rgba(11, 10, 10, 0.12) 100%
	);
}


/* =========================================
   HERO — BOTTOM CINEMATIC FADE
========================================= */

.av-hero::after {
	content: "";

	position: absolute;

	left: 0;
	right: 0;
	bottom: 0;

	width: 100%;
	height: 22%;

	z-index: 2;

	pointer-events: none;

	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 0%,
		rgba(0, 0, 0, 0.06) 18%,
		rgba(0, 0, 0, 0.22) 38%,
		rgba(0, 0, 0, 0.52) 62%,
		rgba(0, 0, 0, 0.82) 82%,
		#000000 100%
	);
}

/* =========================================
   HERO CONTENT
========================================= */

.av-hero__content {
	position: relative;
	z-index: 3;

	width: calc(100% - 96px);
	max-width: 1320px;

	height: 100%;

	margin: 0 auto;

	display: flex;
	flex-direction: column;

	/*
	تیتر در سمت راست
	*/
	align-items: flex-start;

	/*
	دیگر center نمی‌کنیم.
	جای تیتر را خودمان کنترل می‌کنیم.
	*/
	justify-content: flex-start;

	padding-top: 34vh;

	direction: rtl;
	text-align: right;
}


/* =========================================
   HERO TITLE
========================================= */

.av-hero__title {
	margin: 0;

	display: flex;
	flex-direction: column;

	align-items: flex-start;

	font-family: "Gofteh", sans-serif;

	text-align: right;
	line-height: 1;
}


/* میاریمت */

.av-hero__title-white {
	display: block;

	font-family: "Gofteh", sans-serif;

	font-size: clamp(56px, 4.9vw, 76px);
	font-weight: 800;

	line-height: 1;

	color: #FFFFFF;
}


/* جلوی صحنه */

.av-hero__title-orange {
	display: block;

	margin-top: 12px;

	font-family: "Gofteh", sans-serif;

	font-size: clamp(72px, 6vw, 94px);
	font-weight: 800;

	line-height: 0.95;

	color: #FF5A00;
}


/* HERO TITLE — LCP OPTIMIZED */

.av-hero__title {
    opacity: 1;
    transform: none;
    animation: none;
}


@keyframes avHeroTitleIn {
	from {
		opacity: 0;
		transform: translateX(90px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}
/* =========================================
   HERO CTA
========================================= */

.av-hero__cta {
	width: 178px;
	height: 48px;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	padding: 0;
	box-sizing: border-box;

	border: 1px solid #F3F0ED;
	border-radius: 12px;

	background: rgba(0, 0, 0, 0.55);

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1;

	color: #F3F0ED;
	text-decoration: none;
}

.av-hero__cta {
	margin-top: 56px;
}


/* =========================================
   HERO — SCROLL COLLAPSE
========================================= */

.av-hero {
	position: relative;
	overflow: hidden;

	transform-origin: top center;

	will-change: transform;
}


.av-hero__media {
	will-change: transform, opacity;
}


.av-hero__content {
	will-change: transform, opacity;
}


.av-hero__shade {
	will-change: opacity;
}

/* =========================================
   HERO — REAL SCROLL COLLAPSE
========================================= */

.av-hero {
	position: relative;

	width: 100%;

	overflow: hidden;

	transform-origin: top center;

	will-change:
		height,
		opacity,
		transform;
}


/* خود تصویر */

.av-hero__media {
	will-change:
		transform,
		opacity;
}


/* محتوای هیرو */

.av-hero__content {
	will-change:
		transform,
		opacity;
}

/* =========================================
   MANIFESTO / AVANSEN
========================================= */

.av-manifesto {
	position: relative;

	width: 100%;
	min-height: 430px;

	overflow: hidden;

	background: #000000;

	color: #FFFFFF;
}


/* =========================================
   SECTION MARKER
========================================= */




/* =========================================
   MANIFESTO CONTENT
========================================= */

.av-manifesto__inner {
	position: relative;
	z-index: 2;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	padding-top: 122px;

	display: flex;
	flex-direction: column;
	align-items: center;

	text-align: right;
	direction: rtl;
}


/* Heading */

.av-manifesto__title {
	margin: 0;

	font-family: "Gofteh", sans-serif;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.35;

	color: #FFFFFF;

	text-align: right;
}

.av-manifesto__title span {
	color: #FF5A00;
}

.av-manifesto__text {
	margin: 24px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.8;

	color: rgba(255, 255, 255, 0.78);

	text-align: right;
}

/* =========================================
   SHARED SECTION MARKER
========================================= */

.av-section-marker {
	position: absolute;
	right: 0;
	left: 0;

	width: 100%;

	z-index: 3;

	pointer-events: none;
}

.av-section-marker__inner {
	position: relative;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	display: flex;
	align-items: center;
	justify-content: flex-start;

	direction: rtl;
}


/* Text */

.av-section-marker__inner span {
	position: relative;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1;

	color: #BABABA;

	white-space: nowrap;
}


/* Line from container edge to viewport edge */

.av-section-marker__inner span::after {
	content: "";

	position: absolute;

	top: 50%;
	left: calc(100% + 6px);

	width: max(
		48px,
		calc((100vw - 1320px) / 2)
	);

	height: 2px;

	background: #2A2A2A;

	transform: translateY(-50%);
}

/* =========================================
   SERVICES
========================================= */

.av-services {
	position: relative;

	width: 100%;
	min-height: 860px;

	overflow: hidden;

	background: #000000;
	color: #FFFFFF;
}


/* =========================================
   SERVICES — BACKGROUND VISUAL
========================================= */

.av-services__visual img {
	position: absolute;

	right: -2%;
	bottom: -390px;

	width: 72%;
	max-width: none;
	height: auto;

	display: block;

	-webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 18%,
    #000 45%,
    rgba(0, 0, 0, 0.8) 55%,
    rgba(0, 0, 0, 0.3) 65%,
    transparent 75%
);

mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 18%,
    #000 45%,
    rgba(0, 0, 0, 0.8) 55%,
    rgba(0, 0, 0, 0.3) 65%,
    transparent 75%
);
}

/* =========================================
   SERVICES — TOP EDGE FADE
========================================= */


.av-services__visual::before {
	content: "";

	position: absolute;

	top: 0;
	left: 0;
	right: 0;

	height: 180px;

	z-index: 3;

	pointer-events: none;

	background: linear-gradient(
		to bottom,
		#000000 0%,
		rgba(0, 0, 0, 0.95) 20%,
		rgba(0, 0, 0, 0.72) 45%,
		rgba(0, 0, 0, 0.32) 72%,
		rgba(0, 0, 0, 0) 100%
	);
}

/* =========================================
   MARKER
========================================= */

.av-services__marker {
	top: 36px;
}


/* =========================================
   MAIN CONTAINER
========================================= */

.av-services__container {
	position: relative;
	z-index: 2;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	padding-top: 125px;

	display: grid;
	grid-template-columns: 1fr 1fr;

	column-gap: 120px;

	direction: rtl;
}


/* =========================================
   RIGHT INTRO
========================================= */

.av-services__intro {
	display: flex;
	flex-direction: column;

	align-items: flex-start;

	direction: rtl;
	text-align: right;
}


/* Title */

.av-services__title {
	margin: 0;

	display: flex;
	flex-direction: column;

	font-family: "Gofteh", sans-serif;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.2;

	color: #FFFFFF;

	text-align: right;
}

.av-services__title span,
.av-services__title strong {
	display: block;
}

.av-services__title strong {
	font: inherit;
	color: #FF5A00;
}


/* Description */

.av-services__description {
	margin: 24px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.6;

	color: #FFFFFF;

	text-align: right;
}


/* =========================================
   LEFT AREA
========================================= */

.av-services__list-wrap {
	position: relative;

	width: 527px;
	max-width: 100%;

	direction: ltr;
}


/* =========================================
   ALL PROJECTS BUTTON
========================================= */

.av-services__projects-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 250px;
	height: 64px;

	margin: 0 0 54px 0;
	padding: 0;

	border: 2px solid #2A2A2A;
	border-radius: 24px;

	background: transparent;

	font-family: "Kalameh", sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1;

	color: #BABABA;

	direction: rtl;
	text-align: center;

	white-space: nowrap;

	transition:
		border-color 180ms ease,
		color 180ms ease;
}

.av-services__projects-link:hover {
	border-color: #FF5A00;
	color: #FF5A00;
}


/* =========================================
   SERVICES LIST
========================================= */

.av-services__list {
	width: 527px;
	max-width: 100%;
}


/* =========================================
   SERVICE ROW
========================================= */

.av-service-item {
	position: relative;

	width: 527px;
	max-width: 100%;

	height: 100px;

	display: grid;

	/*
	Number | 56px gap | Text | Arrow
	*/
grid-template-columns:
    44px
    56px
    minmax(0, 1fr)
    35px;

column-gap: 32px;

	align-items: center;

	direction: ltr;

	color: #FFFFFF;
}


/* Divider */

.av-service-item:not(:last-child)::after {
	content: "";

	position: absolute;

	left: 0;
	bottom: 0;

	width: 527px;
	max-width: 100%;

	height: 1px;

	background: rgba(186, 186, 186, 0.35);
}


/* =========================================
   NUMBER
========================================= */

.av-service-item__number {
	grid-column: 1;

	justify-self: start;
	align-self: center;

	font-family: "Michroma", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1;

	direction: ltr;

	background: linear-gradient(
		90deg,
		#FF6D29 0%,
		#FF4D1A 100%
	);

	-webkit-background-clip: text;
	background-clip: text;

	-webkit-text-fill-color: transparent;
	color: transparent;

	opacity: 0.5;
}


/* =========================================
   TEXT BLOCK
========================================= */

.av-service-item__content {
	grid-column: 3;

	justify-self: start;
	align-self: center;

	width: 100%;

	margin: 0;
	padding: 0;

	direction: rtl;

	/*
	Figma:
	عنوان و زیرعنوان از سمت چپ
	روی یک محور قرار می‌گیرند.
	*/
	text-align: left;
	margin-right: 52px;
}


/* Service title */

.av-service-item__content h3 {
	margin: 0;

	font-family: "Kalameh", sans-serif;
	font-size: 28px;
	font-weight: 500;
	line-height: 1;

	color: #FFFFFF;

	text-align: left;

	white-space: nowrap;
}


/* Service subtitle */

.av-service-item__content p {
	margin: 10px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 20px;
	font-weight: 100;
	line-height: 1;

	color: #BABABA;

	text-align: left;

	white-space: nowrap;
}


.av-service-item__content {
    direction: rtl;
    text-align: right;
}

.av-service-item__content h3,
.av-service-item__content p {
    text-align: right;
}

/* =========================================
   ARROW
========================================= */

.av-service-item__arrow {
	grid-column: 4;

	justify-self: end;
	align-self: center;

	width: 35px;
	height: 35px;

	display: flex;
	align-items: center;
	justify-content: center;

	border: 1px solid #BABABA;
	border-radius: 50%;

	font-family: Arial, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1;

	color: #BABABA;

	direction: ltr;

	transition:
		border-color 180ms ease,
		color 180ms ease;
}


.av-service-item:hover .av-service-item__arrow {
	border-color: #FF5A00;
	color: #FF5A00;
}


.av-experience__projects-link {
	position: absolute;

	left: 0;
	top: 126px;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 250px;
	height: 64px;

	border: 2px solid #2A2A2A;
	border-radius: 24px;

	background: transparent;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1;

	color: #BABABA;

	direction: rtl;
	text-align: center;

	white-space: nowrap;

	transition:
		border-color 180ms ease,
		color 180ms ease;
}

.av-experience__projects-link:hover {
	border-color: #FF5A00;
	color: #FF5A00;
}


/* =========================================
   SERVICES — STAGGER REVEAL
========================================= */

.av-service-item {
	opacity: 0;
	transform: translateY(24px);

	transition:
		opacity 800ms ease,
		transform 900ms cubic-bezier(.22, 1, .36, 1);
}

/* وقتی سکشن فعال شد */

.av-services.is-visible .av-service-item {
	opacity: 1;
	transform: translateY(0);
}


/* stagger */

.av-services.is-visible .av-service-item:nth-child(1) {
	transition-delay: 120ms;
}

.av-services.is-visible .av-service-item:nth-child(2) {
	transition-delay: 300ms;
}

.av-services.is-visible .av-service-item:nth-child(3) {
	transition-delay: 480ms;
}

.av-services.is-visible .av-service-item:nth-child(4) {
	transition-delay: 660ms;
}

.av-services.is-visible .av-service-item:nth-child(5) {
	transition-delay: 840ms;
}

/* =========================================
   SERVICES — TABLET
========================================= */

@media (max-width: 1100px) {

	.av-services__container {
		column-gap: 50px;
	}

	.av-services__list-wrap,
	.av-services__list,
	.av-service-item {
		width: 100%;
	}

	.av-service-item:not(:last-child)::after {
		width: 100%;
	}

}


/* =========================================
   SERVICES — MOBILE
========================================= */

@media (max-width: 768px) {

	.av-services {
		min-height: auto;
		padding-bottom: 80px;
	}


	.av-services__visual {
		width: 100%;
		height: 55%;

		opacity: 0.65;
	}


	.av-services__container {
		width: calc(100% - 40px);

		padding-top: 110px;

		display: flex;
		flex-direction: column;

		gap: 70px;
	}


	.av-services__intro {
		width: 100%;
	}


	.av-services__title {
		font-size: 30px;
	}


	.av-services__description {
		font-size: 18px;
		line-height: 1.6;
	}


	.av-services__list-wrap,
	.av-services__list {
		width: 100%;
	}


	.av-services__projects-link {
		width: 200px;
		height: 52px;

		font-size: 18px;

		margin-bottom: 40px;
	}


	.av-service-item {
		width: 100%;
		height: 88px;

		grid-template-columns:
			38px
			24px
			1fr
			30px;
	}


	.av-service-item:not(:last-child)::after {
		width: 100%;
	}


	.av-service-item__number {
		font-size: 24px;
	}


	.av-service-item__content h3 {
		font-size: 20px;
	}


	.av-service-item__content p {
		margin-top: 8px;

		font-size: 16px;
	}


	.av-service-item__arrow {
		width: 30px;
		height: 30px;

		font-size: 15px;
	}

}


/* =========================================
   EXPERIENCE
========================================= */

.av-experience {
	position: relative;

	width: 100%;
	min-height: 520px;

	overflow: visible;

	background: #000000;
	color: #FFFFFF;
}


/* Marker */

.av-experience__marker {
	top: 36px;
}


/* Main container */

.av-experience__container {
	position: relative;
	z-index: 2;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	padding-top: 126px;

	direction: rtl;
}


/* Intro */

.av-experience__intro {
	width: 100%;

	display: flex;
	flex-direction: column;
	align-items: flex-start;

	text-align: right;
}


/* Title */

.av-experience__title {
	margin: 0;

	display: flex;
	flex-direction: column;

	font-family: "Gofteh", sans-serif;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.2;

	color: #FFFFFF;

	text-align: right;
}

.av-experience__title span,
.av-experience__title strong {
	display: block;
}

.av-experience__title strong {
	font: inherit;
	color: #FF5A00;
}


/* Description */

.av-experience__description {
	margin: 24px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.6;

	color: #FFFFFF;

	text-align: right;
}

.av-experience__projects {
	position: relative;

	width: 100%;

	margin: 80px auto 0;

	display: flex;
	justify-content: center;
	align-items: flex-start;

	direction: ltr;
}


/* Mobile */

@media (max-width: 768px) {

	.av-experience {
		min-height: 420px;
	}

	.av-experience__container {
		width: calc(100% - 40px);
		padding-top: 110px;
	}

	.av-experience__title {
		font-size: 30px;
	}

	.av-experience__description {
		font-size: 18px;
	}
	
	.av-experience__projects {
	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 80px auto 0;

	display: flex;
	flex-wrap: wrap;
	gap: 32px;

	direction: rtl;
}
}


/* =========================================
   PROJECT CARD
========================================= */

.av-project-card {
	position: relative;

	width: 537.19px;
	height: 577.14px;

	flex: 0 0 537.19px;
	max-width: none;

	margin: 0;

	direction: ltr;
}


/* =========================================
   PROJECT IMAGE
========================================= */

.av-project-card__visual {
	position: absolute;

	top: 0;
	left: 50%;

	width: 533px;
	height: 328.8px;

	transform: translateX(-50%);

	overflow: hidden;

	border-radius: 61.87px;

	border: 1px solid rgba(217, 217, 217, 0.20);

	z-index: 1;
}

.av-project-card__image {
	display: block;

	width: 100%;
	height: 100%;

	max-width: none;

	margin: 0;
	padding: 0;

	object-fit: cover;
	object-position: center;
}


/* =========================================
   UNION / CARD BODY
========================================= */

.av-project-card__body {
	position: absolute;

	top: 183px;
	left: 50%;

	width: 537.19px;
	height: 394.14px;

	transform: translateX(-50%);

	margin: 0;
	padding: 0;

	background: transparent;
	border: 0;

	overflow: visible;

	z-index: 2;
}


/* SVG shape */

.av-project-card__body-shape {
	position: absolute;

	inset: 0;

	display: block;

	width: 100%;
	height: 100%;

	max-width: none;

	margin: 0;
	padding: 0;

	z-index: 0;

	pointer-events: none;
}


/* =========================================
   AVATARS
========================================= */

.av-project-card__avatars {
	position: absolute;

	top: 40px;
	left: 40px;

	display: flex;
	align-items: center;

	gap: 20px;

	direction: ltr;

	z-index: 5;
}

.av-project-card__avatar-image {
	display: block;

	width: 72.48px;
	height: 72.48px;

	flex: 0 0 72.48px;

	border-radius: 50%;

	border: 2.65px solid rgba(217, 217, 217, 0.20);

	background: #171717;

	object-fit: cover;
	object-position: center;
}


/* no overlap */

.av-project-card__avatar-image +
.av-project-card__avatar-image {
	margin-left: 0;
}


/* =========================================
   PROJECT NUMBER
========================================= */

.av-project-card__number {
	position: absolute;

	top: 104px;
	right: 40px;

	display: flex;
	align-items: center;

	gap: 7px;

	direction: ltr;

	z-index: 5;
}

.av-project-card__dot {
	display: block;

	width: 11.49px;
	height: 11.49px;

	flex: 0 0 11.49px;

	border-radius: 50%;

	background: #FF4D1A;
}

.av-project-card__number-text {
	font-family: "Michroma", sans-serif;
	font-size: 14.14px;
	font-weight: 400;
	line-height: 1;

	color: #D9D9D9;
	opacity: 0.20;

	direction: ltr;
}


/* =========================================
   CONTENT WRAPPER
========================================= */

.av-project-card__content {
	position: absolute;

	right: 40px;
	left: 40px;
	bottom: 78px;

	z-index: 5;

	display: flex;
	flex-direction: column;

	direction: rtl;
	text-align: right;
}


/* =========================================
   PROJECT TITLE
========================================= */

.av-project-card__title {
	margin: 0;

	font-family: "Candara", sans-serif;
	font-size: 42.43px;
	font-weight: 700;
	line-height: 1;

	color: #FFFFFF;

	direction: ltr;
	text-align: right;
}


/* =========================================
   PROJECT CATEGORY
========================================= */

.av-project-card__subtitle {
	margin: 10px 0 0;

	font-family: "Candara", sans-serif;
	font-size: 14.14px;
	font-weight: 400;
	line-height: 1;

	color: #949191;

	direction: ltr;
	text-align: right;
}


/* =========================================
   PROJECT SERVICES
========================================= */

.av-project-card__services {
	margin: 20px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 21.21px;
	font-weight: 400;
	line-height: 1.3;

	color: #FFFFFF;

	direction: rtl;
	text-align: right;
}

.av-project-card__separator {
	color: #FF4D1A;
	margin: 0 5px;
}

/* =========================================
   YEAR
========================================= */

.av-project-card__year {
	display: block;

	margin-top: 8px;

	font-family: "Michroma", sans-serif;
	font-size: 14.14px;
	font-weight: 400;
	line-height: 1;

	color: #949191;

	direction: ltr;
	text-align: right;
}


/* =========================================
   ARROW
========================================= */

.av-project-card__arrow {
	position: absolute;

	left: 40px;
	bottom: 40px;

	width: 30.94px;
	height: 30.94px;

	display: flex;
	align-items: center;
	justify-content: center;

	border: 1px solid #D9D9D9;
	border-radius: 50%;

	color: #D9D9D9;

	font-family: Arial, sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1;

	direction: ltr;

	z-index: 5;

	transition:
		border-color 180ms ease,
		color 180ms ease,
		transform 180ms ease;
}

.av-project-card__arrow:hover {
	border-color: #FF4D1A;
	color: #FF4D1A;

	transform: translateX(2px);
}


/* =========================================
   ACTIVE CARD GLOW
========================================= */

.av-project-card::before {
	content: "";

	position: absolute;

	left: 50%;
	top: 183px;

	width: 537.19px;
	height: 394.14px;

	transform: translateX(-50%);

	border-radius: 70px;

	background:
		radial-gradient(
			ellipse at 50% 90%,
			rgba(255, 77, 26, 0.45) 0%,
			rgba(255, 77, 26, 0.16) 38%,
			rgba(255, 77, 26, 0.04) 62%,
			transparent 78%
		);

	filter: blur(16px);

	z-index: 0;

	pointer-events: none;
}


/* EXPERIENCE — Carousel Navigation */

.av-experience__stage {
    position: relative;
}

.av-experience__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 20;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 52px;
    height: 52px;
    padding: 0;

    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 50%;

    background: rgba(15, 15, 15, 0.8);
    color: #FFFFFF;
    font-size: 26px;

    cursor: pointer;
    transition: all 0.25s ease;
}

/* فلش سمت چپ */
.av-experience__nav--prev {
    left: 48px;
}

/* فلش سمت راست */
.av-experience__nav--next {
    right: 48px;
}

/* هاور */
.av-experience__nav:hover:not(:disabled) {
    border-color: #FF5A00;
    color: #FF5A00;
    background: #171717;
}

/* ابتدا و انتهای اسلایدر */
.av-experience__nav:disabled {
    opacity: 0.25;
    cursor: default;
    pointer-events: auto;
}

/* =========================================
   EXPERIENCE STAGE
========================================= */

.av-experience__stage {
	position: relative;

	width: 100%;
	height: 610px;

	margin-top: 40px;

	overflow: hidden;
}


/* container پروژه‌ها */

.av-experience__projects {
	position: relative;

	width: 100%;
	height: 100%;

	margin: 0;

	direction: ltr;
}


/* =========================================
   BASE CARD POSITION
========================================= */

.av-experience__projects .av-project-card {
	position: absolute;

	top: 50%;
	left: 50%;

	margin: 0;

	transform-origin: center center;

	transition:
		transform 650ms cubic-bezier(.22, 1, .36, 1),
		opacity 450ms ease,
		filter 450ms ease;
}


/* =========================================
   ACTIVE — CENTER
========================================= */

.av-project-card.is-active {
	transform:
		translate(-50%, -50%)
		scale(1)
		rotate(0deg);

	opacity: 1;

	filter:
		brightness(1)
		drop-shadow(0 0 12px rgba(255, 77, 26, 0.40))
		drop-shadow(0 0 28px rgba(255, 77, 26, 0.20));

	z-index: 10;
}


/* =========================================
   PREVIOUS — LEFT
========================================= */

.av-project-card.is-prev {
	transform:
		translate(-82%, -47%)
		scale(0.78)
		rotate(-7deg);

	opacity: 0.38;
	filter: brightness(0.52);

	z-index: 5;
}

.av-project-card.is-next {
	transform:
		translate(-18%, -47%)
		scale(0.78)
		rotate(7deg);

	opacity: 0.38;
	filter: brightness(0.52);

	z-index: 5;
}


/* =========================================
   NEXT — RIGHT
========================================= */

.av-project-card.is-next {
	transform:
		translate(-12%, -47%)
		scale(0.80)
		rotate(7deg);

	opacity: 0.42;

	filter:
		brightness(0.55);

	z-index: 6;
}


/* =========================================
   FAR LEFT
========================================= */

.av-project-card.is-prev-far {
	transform:
		translate(-108%, -44%)
		scale(0.62)
		rotate(-11deg);

	opacity: 0.16;
	filter: brightness(0.32);

	z-index: 2;
}

.av-project-card.is-next-far {
	transform:
		translate(8%, -44%)
		scale(0.62)
		rotate(11deg);

	opacity: 0.16;
	filter: brightness(0.32);

	z-index: 2;
}


/* =========================================
   FAR RIGHT
========================================= */

.av-project-card.is-next-far {
	transform:
		translate(18%, -44%)
		scale(0.66)
		rotate(11deg);

	opacity: 0.20;

	filter:
		brightness(0.38);

	z-index: 3;
}


/* =========================================
   HIDDEN CARDS
========================================= */

.av-project-card.is-hidden {
	transform:
		translate(-50%, -50%)
		scale(0.55);

	opacity: 0;

	pointer-events: none;

	z-index: 0;
}

/* =========================================
   BACK CARDS — CLEAN CONTENT
========================================= */

/* کارت‌های پشتی نزدیک */
.av-project-card.is-prev .av-project-card__avatars,
.av-project-card.is-prev .av-project-card__number,
.av-project-card.is-prev .av-project-card__content,
.av-project-card.is-prev .av-project-card__arrow,

.av-project-card.is-next .av-project-card__avatars,
.av-project-card.is-next .av-project-card__number,
.av-project-card.is-next .av-project-card__content,
.av-project-card.is-next .av-project-card__arrow {
	opacity: 0.22;
}


/* کارت‌های پشتی دور */
.av-project-card.is-prev-far .av-project-card__avatars,
.av-project-card.is-prev-far .av-project-card__number,
.av-project-card.is-prev-far .av-project-card__content,
.av-project-card.is-prev-far .av-project-card__arrow,

.av-project-card.is-next-far .av-project-card__avatars,
.av-project-card.is-next-far .av-project-card__number,
.av-project-card.is-next-far .av-project-card__content,
.av-project-card.is-next-far .av-project-card__arrow {
	opacity: 0.06;
}


/* فقط کارت فعال اطلاعات کامل داشته باشد */
.av-project-card.is-active .av-project-card__avatars,
.av-project-card.is-active .av-project-card__number,
.av-project-card.is-active .av-project-card__content,
.av-project-card.is-active .av-project-card__arrow {
	opacity: 1;
}

/* =========================================
   EXPERIENCE — STACKED STATE
========================================= */

.av-experience__stage.is-stacked {
	overflow: visible;
}


/* همه کارت‌های Stack شده */
.av-experience__stage.is-stacked .av-project-card {
	transition:
		transform 800ms cubic-bezier(.22, 1, .36, 1),
		opacity 500ms ease,
		filter 500ms ease;
}


/* کارت رویی */
.av-project-card.is-stack-top {
	transform:
		translate(-50%, -125px)
		scale(0.58)
		rotate(0deg);

	opacity: 1;

	filter:
		brightness(1)
		drop-shadow(0 0 10px rgba(255, 77, 26, 0.22));

	z-index: 10;
}


/* کارت زیرین 1 */
.av-project-card.is-stack-1 {
	transform:
		translate(calc(-50% - 8px), -113px)
		scale(0.58)
		rotate(-2deg);

	opacity: 0.72;

	filter: brightness(0.55);

	z-index: 8;
}


/* کارت زیرین 2 */
.av-project-card.is-stack-2 {
	transform:
		translate(calc(-50% + 9px), -103px)
		scale(0.58)
		rotate(2deg);

	opacity: 0.52;

	filter: brightness(0.46);

	z-index: 6;
}


/* کارت زیرین 3 */
.av-project-card.is-stack-3 {
	transform:
		translate(calc(-50% - 13px), -92px)
		scale(0.58)
		rotate(-3deg);

	opacity: 0.34;

	filter: brightness(0.38);

	z-index: 4;
}


/* کارت زیرین 4 */
.av-project-card.is-stack-4 {
	transform:
		translate(calc(-50% + 14px), -80px)
		scale(0.58)
		rotate(3deg);

	opacity: 0.20;

	filter: brightness(0.30);

	z-index: 2;
}


/* فقط اطلاعات کارت رویی دیده شود */
.av-project-card.is-stack-1 .av-project-card__avatars,
.av-project-card.is-stack-1 .av-project-card__number,
.av-project-card.is-stack-1 .av-project-card__content,
.av-project-card.is-stack-1 .av-project-card__arrow,

.av-project-card.is-stack-2 .av-project-card__avatars,
.av-project-card.is-stack-2 .av-project-card__number,
.av-project-card.is-stack-2 .av-project-card__content,
.av-project-card.is-stack-2 .av-project-card__arrow,

.av-project-card.is-stack-3 .av-project-card__avatars,
.av-project-card.is-stack-3 .av-project-card__number,
.av-project-card.is-stack-3 .av-project-card__content,
.av-project-card.is-stack-3 .av-project-card__arrow,

.av-project-card.is-stack-4 .av-project-card__avatars,
.av-project-card.is-stack-4 .av-project-card__number,
.av-project-card.is-stack-4 .av-project-card__content,
.av-project-card.is-stack-4 .av-project-card__arrow {
	opacity: 0;
}


/* کارت رویی کامل دیده شود */
.av-project-card.is-stack-top .av-project-card__avatars,
.av-project-card.is-stack-top .av-project-card__number,
.av-project-card.is-stack-top .av-project-card__content,
.av-project-card.is-stack-top .av-project-card__arrow {
	opacity: 1;
}

/* =========================================
   STACK — FINAL POSITION
   سمت چپ صفحه، روبه‌روی متن
========================================= */

.av-experience__stage.is-stacked .av-project-card {
	top: -365px;

	left: 520px;
	right: auto;

	transform-origin: top left;
}


/* کارت رویی */

.av-project-card.is-stack-top {
	transform:
		translate(0, 0)
		scale(0.58)
		rotate(0deg);

	opacity: 1;

	z-index: 10;
}


/* زیرین 1 */

.av-project-card.is-stack-1 {
	transform:
		translate(7px, 8px)
		scale(0.58)
		rotate(2deg);

	opacity: 0.72;

	z-index: 8;
}


/* زیرین 2 */

.av-project-card.is-stack-2 {
	transform:
		translate(-7px, 14px)
		scale(0.58)
		rotate(-2deg);

	opacity: 0.52;

	z-index: 6;
}


/* زیرین 3 */

.av-project-card.is-stack-3 {
	transform:
		translate(10px, 20px)
		scale(0.58)
		rotate(3deg);

	opacity: 0.34;

	z-index: 4;
}


/* زیرین 4 */

.av-project-card.is-stack-4 {
	transform:
		translate(-10px, 27px)
		scale(0.58)
		rotate(-3deg);

	opacity: 0.20;

	z-index: 2;
}


/* =========================================
   FOUNDERS
========================================= */

.av-founders {
	position: relative;

	width: 100%;
	height: 760px;

	background: #000000;
	color: #FFFFFF;

	overflow: hidden;
}


/* Marker */

.av-founders__marker {
	top: 36px;
}


/* =========================================
   HEADING — TOP RIGHT
========================================= */

.av-founders__heading {
	position: absolute;

	top: 126px;
	left: 50%;

	width: calc(100% - 96px);
	max-width: 1320px;

	transform: translateX(-50%);

	z-index: 4;

	direction: rtl;
	text-align: right;
}


.av-founders__title {
	margin: 0;

	font-family: "Gofteh", sans-serif;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.2;

	color: #FFFFFF;

	text-align: right;
}


.av-founders__title span {
	color: #FF5A00;
}


/* =========================================
   CENTER VISUAL
========================================= */

.av-founders__visual {
	position: absolute;

	inset: 0;

	width: 100%;
	height: 100%;

	transform: none;

	z-index: 1;

	pointer-events: none;
}

.av-founders__visual img {
	display: block;

	width: 100%;
	height: 100%;

	max-width: none;

	object-fit: contain;
	object-position: center center;
}

/* =========================================
   FOUNDERS INFO
========================================= */

.av-founders__content {
	position: absolute;

	left: 50%;
	bottom: 105px;

	width: calc(100% - 96px);
	max-width: 1320px;

	transform: translateX(-50%);

	z-index: 5;

	display: flex;
	align-items: flex-end;
	justify-content: space-between;

	direction: ltr;
}


/* =========================================
   FOUNDER BLOCK
========================================= */

.av-founder {
	width: 300px;

	margin: 0;
	padding: 0;

	color: #FFFFFF;

	direction: ltr;
	text-align: left;
}


.av-founder--hossein {
	margin: 0;
}


.av-founder--sahar {
	margin: 0;
}


/* =========================================
   NAME
========================================= */

.av-founder__name {
	margin: 0;

	font-family: "Asta Sans", sans-serif;
	font-size: 28px;
	font-weight: 500;
	line-height: 1;

	color: #FFFFFF;

	direction: ltr;
	text-align: left;
}


/* Divider line */

.av-founder__name::after {
	content: "";

	display: block;

	width: 279px;
	height: 2px;

	margin-top: 6px;

	background: rgba(255, 90, 0, 0.20);
}



/* =========================================
   ROLE
========================================= */

.av-founder__role {
	margin: 8px 0 0;

	font-family: "Asta Sans", sans-serif;
	font-size: 20px;
	font-weight: 300;
	line-height: 1;

	color: #F3F0ED;

	direction: ltr;
	text-align: left;
}


/* =========================================
   SKILLS
========================================= */

.av-founder__skills {
	margin: 24px 0 0;
	padding: 0;

	list-style: none;

	direction: ltr;
	text-align: left;
}


/* Each skill */

.av-founder__skills li {
	position: relative;

	margin: 12px 0 0;
	padding: 0 0 0 22px;

	list-style: none;

	font-family: "Asta Sans", sans-serif;
	font-size: 20px;
	font-weight: 200;
	line-height: 1;

	color: #BABABA;

	direction: ltr;
	text-align: left;
}


/* First item */

.av-founder__skills li:first-child {
	margin-top: 0;
}


/* Orange bullet */

.av-founder__skills li::before {
	content: "";

	position: absolute;

	left: 0;
	top: 50%;

	width: 14px;
	height: 14px;

	transform: translateY(-50%);

	border-radius: 50%;

	background: rgba(255, 90, 0, 0.50);
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1100px) {

	.av-founders__visual {
		width: 620px;
		height: 560px;
	}

	.av-founder {
		width: 250px;
	}

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

	.av-founders {
		height: auto;
		min-height: 980px;
	}


	.av-founders__heading {
		top: 110px;

		width: calc(100% - 40px);
	}


	.av-founders__title {
		font-size: 30px;
	}


	.av-founders__visual {
		top: 200px;
		bottom: auto;

		width: 100%;
		height: 420px;
	}


	.av-founders__content {
	position: absolute;

	/* 217px بعد از انتهای عنوان */
	top: 217px;

	left: 50%;

	width: max-content;

	transform: translateX(-50%);

	z-index: 5;

	display: flex;
	align-items: flex-start;

	/* فاصله دقیق بین بلوک حسین و سحر */
	gap: 636px;

	direction: ltr;
}


	.av-founder {
		width: 100%;
	}

}

/* =========================================
   FOUNDERS — SCROLL REVEAL
========================================= */

.av-founder {
	opacity: 0;

	transform: translateY(36px);

	transition:
		opacity 700ms ease,
		transform 850ms cubic-bezier(.22, 1, .36, 1);
}


/* Hossein first */

.av-founders.is-visible .av-founder--hossein {
	opacity: 1;

	transform: translateY(0);

	transition-delay: 120ms;
}


/* Sahar slightly after */

.av-founders.is-visible .av-founder--sahar {
	opacity: 1;

	transform: translateY(0);

	transition-delay: 280ms;
}

/* =========================================
   PROCESS
========================================= */

.av-process {
	position: relative;

	width: 100%;
	min-height: 760px;

	background: #000000;
	color: #FFFFFF;

	overflow: hidden;
}


/* =========================================
   MARKER
========================================= */

.av-process__marker {
	top: 36px;
}


/* =========================================
   HEADING
========================================= */

.av-process__heading {
	position: relative;
	z-index: 3;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	padding-top: 126px;

	direction: rtl;
	text-align: right;
}

.av-process__title {
	margin: 0;

	font-family: "Gofteh", sans-serif;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.2;

	color: #FFFFFF;
}

.av-process__title span {
	display: block;

	color: #FF5A00;
}

.av-process__description {
	margin: 24px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.6;

	color: #FFFFFF;
}


/* =========================================
   STEPS WRAPPER
========================================= */

.av-process__steps {
	position: relative;
	z-index: 4;

	width: calc(100% - 180px);
	max-width: 1160px;

	height: 340px;

	margin: 100px auto 0;

	display: grid;
	grid-template-columns: repeat(4, 1fr);

	align-items: start;

	direction: rtl;
}


/* =========================================
   STEP BASE
========================================= */

.av-process-step {
	position: relative;

	width: 100%;

	text-align: center;
	direction: rtl;

	opacity: 0.24;
	filter: brightness(0.55);

	--stem-height: 155px;

	transition:
		opacity 450ms ease,
		filter 450ms ease;
}


/* =========================================
   STEM HEIGHT — MATCH CURVE
========================================= */

.av-process-step[data-step="1"] {
	--stem-height: 108px;
}

.av-process-step[data-step="2"] {
	--stem-height: 88px;
}

.av-process-step[data-step="3"] {
	--stem-height: 88px;
}

.av-process-step[data-step="4"] {
	--stem-height: 108px;
}


/* =========================================
   ACTIVE STEP
========================================= */

.av-process-step.is-active {
	opacity: 1;

	filter: brightness(1);
}


/* =========================================
   NUMBER
========================================= */

.av-process-step__number {
	display: block;

	margin: 0 0 24px;

	font-family: "Michroma", sans-serif;
	font-size: 32px;
	font-weight: 400;
	line-height: 1;

	color: #FF5A00;

	opacity: 0.50;

	direction: ltr;
}


/* =========================================
   TITLE
========================================= */

.av-process-step__title {
	margin: 0;

	font-family: "Gofteh", sans-serif;
	font-size: 24px;
	font-weight: 800;
	line-height: 1;

	color: #FFFFFF;
}


/* =========================================
   DESCRIPTION
========================================= */

.av-process-step__text {
	margin: 8px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.55;

	color: #BABABA;
}


/* =========================================
   VERTICAL STEM
========================================= */

.av-process-step::after {
	content: "";

	position: absolute;

	left: 50%;
	top: calc(100% + 10px);

	width: 1px;
	height: var(--stem-height);

	transform: translateX(-50%);

	background: rgba(255, 90, 0, 0.50);

	opacity: 0.20;

	z-index: 1;

	transition:
		opacity 450ms ease,
		filter 450ms ease;
}


/* Active stem */

.av-process-step.is-active::after {
	opacity: 1;

	filter:
		drop-shadow(
			0 0 4px rgba(255, 90, 0, 0.45)
		);
}


/* =========================================
   PROCESS — END POINT
========================================= */

.av-process-step__point {
	position: absolute;

	left: 50%;

	top: calc(
		100% +
		10px +
		var(--stem-height) -
		8px
	);

	width: 16px;
	height: 16px;

	transform: translateX(-50%);

	border-radius: 50%;

	background: #FFFFFF;

	opacity: 0.18;

	z-index: 3;

	box-shadow:
		0 0 8px rgba(255, 77, 26, 0.35),
		0 0 18px rgba(255, 77, 26, 0.22);

	transition:
		opacity 450ms ease,
		box-shadow 450ms ease;
}


.av-process-step.is-active .av-process-step__point {
	opacity: 1;

	box-shadow:
		0 0 4px 1px rgba(255, 255, 255, 0.75),
		0 0 10px 3px rgba(255, 77, 26, 0.90),
		0 0 24px 7px rgba(255, 90, 20, 0.48),
		0 0 48px 14px rgba(255, 80, 10, 0.20),
		0 0 80px 24px rgba(255, 60, 0, 0.08);
}

/* =========================================
   PROCESS — LIGHT PATH
========================================= */

.av-process__path {
	position: absolute;

	left: 0;
	right: 0;
	bottom: -2px;

	width: 100%;
	height: 250px;

	z-index: 1;

	pointer-events: none;
}

.av-process__path-svg {
	display: block;

	width: 100%;
	height: 100%;

	overflow: visible;
}


/* =========================================
   LAYER 01 — LARGE BLUR
   70px / 5% / blur 80
========================================= */

.av-process__path-glow--wide {
	fill: none;

	stroke: #FF5A1F;
	stroke-width: 90;

	stroke-linecap: round;
	stroke-linejoin: round;

	opacity: 0.09;

	filter: blur(42px);
}


/* LAYER 02
   Warm bloom نزدیک خط
========================================= */

.av-process__path-glow--soft {
	fill: none;

	stroke: #FF7A2F;
	stroke-width: 14;

	stroke-linecap: round;
	stroke-linejoin: round;

	opacity: 0.42;

	filter: blur(9px);
}


/* LAYER 03
   Sharp luminous core
========================================= */

.av-process__path-line {
	fill: none;

	stroke: #FF4D1A;
	stroke-width: 2;

	stroke-linecap: round;
	stroke-linejoin: round;

	opacity: 1;

	filter:
		drop-shadow(0 0 3px rgba(255, 77, 26, 0.90))
		drop-shadow(0 0 7px rgba(255, 122, 47, 0.45));
}

/* =========================================
   PROCESS — MOTION STATES
========================================= */

.av-process-step {
	transition:
		opacity 500ms ease,
		filter 500ms ease;
}


/* number */

.av-process-step__number {
	transition:
		color 500ms ease,
		opacity 500ms ease,
		text-shadow 500ms ease;
}


/* title */

.av-process-step__title {
	transition:
		color 500ms ease,
		opacity 500ms ease;
}


/* description */

.av-process-step__text {
	transition:
		color 500ms ease,
		opacity 500ms ease;
}


/* vertical stem */

.av-process-step::after {
	transition:
		opacity 500ms ease,
		filter 500ms ease;
}


/* point */

.av-process-step__point {
	transition:
		opacity 500ms ease,
		box-shadow 500ms ease;
}


/* =========================================
   ACTIVE
========================================= */

.av-process-step.is-active {
	opacity: 1;
	filter: brightness(1);
}


.av-process-step.is-active .av-process-step__number {
	opacity: 0.5;

	text-shadow:
		0 0 12px rgba(255, 77, 26, 0.22);
}


.av-process-step.is-active::after {
	opacity: 1;
}


.av-process-step.is-active .av-process-step__point {
	opacity: 1;
}


/* =========================================
   COMPLETED
========================================= */

.av-process-step.is-complete {
	opacity: 1;
	filter: brightness(1);
}


.av-process-step.is-complete .av-process-step__number {
	opacity: 0.5;
}


.av-process-step.is-complete::after {
	opacity: 1;
}


.av-process-step.is-complete .av-process-step__point {
	opacity: 1;
}


/* =========================================
   FINAL CTA
========================================= */

.av-final-cta {
	position: relative;

	width: 100%;
	min-height: 620px;

	background: #000000;
	color: #FFFFFF;

	overflow: hidden;
}


/* =========================================
   MARKER
========================================= */

.av-final-cta__marker {
	top: 36px;
}


/* =========================================
   INNER
========================================= */

.av-final-cta__inner {
	position: relative;
	z-index: 3;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	padding-top: 150px;

	display: flex;
	flex-direction: column;
	align-items: center;

	text-align: center;
	direction: rtl;
}


/* =========================================
   TITLE
========================================= */

.av-final-cta__title {
	margin: 0;

	font-family: "Gofteh", sans-serif;
	font-size: 64px;
	font-weight: 800;
	line-height: 1.05;

	color: #FFFFFF;

	text-align: center;
}

.av-final-cta__title span {
	color: #FF5A00;
}


/* =========================================
   TEXT
========================================= */

.av-final-cta__text {
	margin: 24px 0 0;

	font-family: "Kalameh", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.5;

	color: #D5D2CF;

	text-align: center;
}


/* =========================================
   ACTIONS
========================================= */

.av-final-cta__actions {
	position: relative;

	margin-top: 54px;

	display: flex;
	align-items: center;
	justify-content: center;

	gap: 38px;

	direction: rtl;
}

/* =========================================
   BUTTON BASE
========================================= */

.av-final-cta__button {
	position: relative;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 196px;
	height: 54px;

	padding: 0;

	border-radius: 12px;

	font-family: "Kalameh", sans-serif;
	font-size: 18px;
	font-weight: 300;
	line-height: 1;

	white-space: nowrap;

	transition:
		border-color 200ms ease,
		color 200ms ease,
		background 200ms ease,
		box-shadow 250ms ease,
		transform 200ms ease;
}


/* =========================================
   PRIMARY BUTTON
========================================= */

.av-final-cta__button--primary {
	min-width: 136px;

	border: 1px solid rgba(255, 90, 0, 0.72);

	background: rgba(255, 77, 26, 0.06);

	color: #FFFFFF;

	box-shadow:
		0 0 8px rgba(255, 77, 26, 0.35),
		0 0 18px rgba(255, 77, 26, 0.18),
		0 0 42px rgba(255, 77, 26, 0.08);
}

.av-final-cta__button--primary:hover {
	border-color: #FF5A00;

	background: rgba(255, 90, 0, 0.12);

	box-shadow:
		0 0 10px rgba(255, 77, 26, 0.50),
		0 0 26px rgba(255, 77, 26, 0.25),
		0 0 56px rgba(255, 77, 26, 0.12);

	transform: translateY(-2px);
}


/* =========================================
   SECONDARY BUTTON
========================================= */

.av-final-cta__button--secondary {
	min-width: 110px;

	border: 1px solid #2A2A2A;

	background: transparent;

	color: #BABABA;
}

.av-final-cta__button--secondary:hover {
	border-color: #666666;
	color: #FFFFFF;
}

.av-final-cta__button--secondary {
	width: 196px;
	height: 54px;

	border: 1px solid #2A2A2A;
	background: transparent;

	font-family: "Kalameh", sans-serif;
	font-size: 18px;
	font-weight: 300;
	line-height: 1;

	color: #343333;

	box-shadow: none;
}

.av-final-cta__button--secondary:hover {
	border-color: rgba(255, 255, 255, 0.30);
	color: #FFFFFF;
}

/* =========================================
   AMBIENT GLOW
========================================= */

.av-final-cta__actions::before {
	content: "";

	position: absolute;

	left: 50%;
	top: 50%;

	width: 300px;
	height: 140px;

	transform: translate(-50%, -42%);

	border-radius: 50%;

	background:
		radial-gradient(
			ellipse at center,
			rgba(255, 77, 26, 0.15) 0%,
			rgba(255, 77, 26, 0.07) 38%,
			rgba(255, 77, 26, 0.02) 64%,
			transparent 80%
		);

	filter: blur(28px);

	z-index: -1;

	pointer-events: none;
}

/* =========================================
   FOOTER
========================================= */

.av-footer {
	position: relative;

	width: 100%;
	min-height: 0;
	height: auto;

	margin: 0;
	padding: 0;

	background: #000000;
	color: #FFFFFF;

	overflow: hidden;
}


/* =========================================
   AMBIENT GLOW
========================================= */

.av-footer__glow {
	position: absolute;

	left: 50%;
	bottom: -70px;

	width: 760px;
	height: 360px;

	transform: translateX(-50%);

	border-radius: 50%;

	background:
		radial-gradient(
			ellipse at center,
			rgba(255, 122, 47, 0.42) 0%,
			rgba(255, 90, 0, 0.25) 25%,
			rgba(255, 77, 26, 0.13) 48%,
			rgba(255, 77, 26, 0.05) 68%,
			transparent 84%
		);

	filter: blur(34px);

	pointer-events: none;
	z-index: 0;
}


/* =========================================
   CONTAINER
========================================= */

.av-footer__container {
	position: relative;
	z-index: 2;

	width: calc(100% - 96px);
	max-width: 1320px;

	margin: 0 auto;

	padding: 42px 0 34px;
}


/* =========================================
   TOP ROW
========================================= */

.av-footer__top {
	display: grid;

	grid-template-columns:
		220px
		260px
		1fr
		220px;

	align-items: center;

	column-gap: 42px;

	padding-bottom: 34px;

	border-bottom: 1px solid #2A2A2A;

	direction: ltr;
}


/* =========================================
   SOCIAL
========================================= */

.av-footer__social {
	direction: rtl;
	text-align: left;
}

.av-footer__social-title {
	margin: 0 0 14px;

	font-family: "Kalameh", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.4;

	color: #BABABA;
}

.av-footer__social-links {
	display: flex;
	align-items: center;

	gap: 16px;

	direction: ltr;
}

.av-footer__social-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 32px;
	height: 32px;

	transition:
		opacity 180ms ease,
		transform 180ms ease;
}

.av-footer__social-links a img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: contain;
}

.av-footer__social-links a:hover {
	opacity: 0.75;
	transform: translateY(-2px);
}


/* =========================================
   COLLABORATION TEXT
========================================= */

.av-footer__collaboration {
	direction: rtl;
	text-align: right;
}

.av-footer__collaboration p {
	margin: 0;

	font-family: "Kalameh", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.7;

	color: #BABABA;
}


/* =========================================
   NAV
========================================= */

.av-footer__nav {
	display: flex;
	align-items: center;
	justify-content: center;

	gap: 34px;

	direction: rtl;
}

.av-footer__nav a {
	font-family: "Kalameh", sans-serif;
	font-size: 20px;
	font-weight: 400;

	color: #BABABA;

	white-space: nowrap;

	transition: color 180ms ease;
}

.av-footer__nav a:hover {
	color: #FFFFFF;
}


/* =========================================
   BRAND
========================================= */

.av-footer__brand {
	display: flex;
	justify-content: flex-end;

	direction: ltr;
}

.av-footer__logo {
	display: inline-flex;
	align-items: center;
}

.av-footer__logo img {
	display: block;

	width: 150px;
	height: auto;

	max-width: none;
}


/* =========================================
   BOTTOM ROW
========================================= */

.av-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;

	padding-top: 22px;

	direction: ltr;
}


/* copyright */

.av-footer__copyright {
	margin: 0;

	font-family: "Asta Sans", sans-serif;
	font-size: 12px;
	font-weight: 300;

	color: #949191;

	direction: ltr;
	text-align: left;
}


/* signature */

.av-footer__signature {
	margin: 0;

	font-family: "Kalameh", sans-serif;
	font-size: 20px;
	font-weight: 400;

	color: #BABABA;

	direction: rtl;
	text-align: right;
}


/* =========================================
   FINAL CTA — REVEAL MOTION
========================================= */

.av-final-cta__title,
.av-final-cta__text,
.av-final-cta__actions {
	opacity: 0;

	will-change:
		opacity,
		transform,
		filter;
}


/* Title */

.av-final-cta__title {
	transform:
		translateY(34px)
		scale(0.96);

	filter: blur(8px);

	transition:
		opacity 900ms ease,
		transform 1000ms cubic-bezier(.22, 1, .36, 1),
		filter 900ms ease;
}


/* Text */

.av-final-cta__text {
	transform: translateY(24px);

	filter: blur(5px);

	transition:
		opacity 800ms ease,
		transform 900ms cubic-bezier(.22, 1, .36, 1),
		filter 800ms ease;

	transition-delay: 180ms;
}


/* Buttons */

.av-final-cta__actions {
	transform: translateY(20px);

	transition:
		opacity 750ms ease,
		transform 850ms cubic-bezier(.22, 1, .36, 1);

	transition-delay: 360ms;
}


/* =========================================
   VISIBLE STATE
========================================= */

.av-final-cta.is-visible .av-final-cta__title,
.av-final-cta.is-visible .av-final-cta__text,
.av-final-cta.is-visible .av-final-cta__actions {
	opacity: 1;

	transform:
		translateY(0)
		scale(1);

	filter: blur(0);
}


/* =========================================
   PRIMARY CTA EMPHASIS
========================================= */

.av-final-cta.is-visible
.av-final-cta__button--primary {
	animation:
		avFinalCtaPulse 1200ms ease
		850ms
		1;
}


@keyframes avFinalCtaPulse {

	0% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}

	45% {
		box-shadow:
			0 0 14px rgba(255, 77, 26, 0.75),
			0 0 34px rgba(255, 77, 26, 0.40),
			0 0 72px rgba(255, 77, 26, 0.18);
	}

	100% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}

}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1100px) {

	.av-footer__top {
		grid-template-columns:
			180px
			220px
			1fr
			170px;

		column-gap: 24px;
	}

	.av-footer__nav {
		gap: 22px;
	}

}


/* =========================================================
   FOOTER — MOBILE FINAL
========================================================= */

@media (max-width: 768px) {

	/* =========================================
	   FOOTER
	========================================= */

	.av-footer {
		min-height: auto;
	}


	.av-footer__container {
		width: calc(100% - 40px);
		max-width: none;

		margin: 0 auto;
		padding: 40px 0 28px;
	}


	/* =========================================
	   TOP
	   Logo + Social in one row
	========================================= */

	.av-footer__top {
		display: grid;

		grid-template-columns: 1fr auto;
		grid-template-areas: "brand social";

		align-items: center;

		column-gap: 24px;
		row-gap: 0;

		margin: 0;
		padding: 0 0 24px;
	}


	/* =========================================
	   HIDE UNUSED MOBILE CONTENT
	========================================= */

	.av-footer__collaboration,
	.av-footer__social-title,
	.av-footer__nav {
		display: none;
	}


	/* =========================================
	   LOGO
	========================================= */

	.av-footer__brand {
		grid-area: brand;

		width: auto;

		display: flex;
		align-items: center;
		justify-content: flex-start;

		margin: 0;
		padding: 0;
	}


	.av-footer__logo {
		display: block;

		margin: 0;
		padding: 0;
	}


	.av-footer__logo img {
		display: block;

		width: 130px;
		height: auto;

		margin: 0;
	}


	/* =========================================
	   SOCIAL
	========================================= */

	.av-footer__social {
		grid-area: social;

		width: auto;

		margin: 0;
		padding: 0;
	}


	.av-footer__social-links {
		display: flex;

		align-items: center;
		justify-content: flex-end;

		gap: 14px;

		margin: 0;
		padding: 0;
	}


	.av-footer__social-links a {
		display: flex;

		align-items: center;
		justify-content: center;

		width: 28px;
		height: 28px;

		margin: 0;
		padding: 0;
	}


	.av-footer__social-links a img {
		display: block;

		width: 28px;
		height: 28px;

		object-fit: contain;
	}


	/* =========================================
	   BOTTOM / DIVIDER
	========================================= */

	.av-footer__bottom {
		width: 100%;

		display: block;

		margin: 0;

		/* Equal distance below divider */
		padding: 24px 0 0;

		border-top: 1px solid rgba(255, 255, 255, 0.14);
	}


	/* =========================================
	   HIDE SIGNATURE
	========================================= */

	.av-footer__signature {
		display: none;
	}


	/* =========================================
	   COPYRIGHT
	========================================= */

	.av-footer__copyright {
		width: 100%;

		margin: 0;
		padding: 0;

		font-size: 11px;
		font-weight: 400;
		line-height: 1.6;

		color: rgba(255, 255, 255, 0.45);

		direction: ltr;
		text-align: left;
	}


	/* =========================================
	   GLOW
	========================================= */

	.av-footer__glow {
		width: 420px;
		height: 220px;

		left: 50%;
		bottom: -120px;

		transform: translateX(-50%);
	}

}
/* =========================================
   DESKTOP LARGE
========================================= */


/* =========================================
   TABLET
========================================= */

@media (max-width: 1100px) {

	:root {
		--av-page-padding: 32px;
	}

	.av-header__inner {
		grid-template-columns: 170px 1fr 170px;
	}

	.av-header__nav {
		gap: 44px;
	}

	.av-header__nav a {
		font-size: 18px;
	}

	.av-header__descriptor {
		font-size: 17px;
	}

	.av-header__logo img {
		width: 135px;
	}

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

	:root {
		--av-page-padding: 20px;
	}


	.av-hero {
	position: relative;

	width: 100%;

	/* نسبت دقیق فایل hero.svg */
	aspect-ratio: 1440 / 900;

	min-height: 0;
	height: auto;

	overflow: hidden;

	background: #000000;
}


	.av-hero__media img {
		object-fit: cover;
		object-position: 32% top;
	}


	.av-hero__shade {
		background:
			linear-gradient(
				0deg,
				rgba(11, 10, 10, 0.78) 0%,
				rgba(11, 10, 10, 0.25) 48%,
				rgba(11, 10, 10, 0.05) 100%
			);
	}


	.av-hero__content {
		width: calc(100% - 40px);

		justify-content: flex-end;
		align-items: flex-start;

		padding: 0 0 70px;
	}


	.av-hero__title-white {
		font-size: 44px;
	}


	.av-hero__title-orange {
		margin-top: 8px;
		font-size: 56px;
	}


	.av-hero__cta {
		margin-top: 26px;

		min-width: 112px;
		height: 40px;

		font-size: 14px;
	}

}



/* =========================================
   FINAL CTA — MOTION
========================================= */

.av-final-cta__title {
	transition:
		opacity 1400ms ease,
		transform 1600ms cubic-bezier(.22, 1, .36, 1),
		filter 1400ms ease;
}

.av-final-cta__text {
	transition:
		opacity 1200ms ease 300ms,
		transform 1400ms cubic-bezier(.22, 1, .36, 1) 300ms,
		filter 1200ms ease 300ms;
}

.av-final-cta__actions {
	transition:
		opacity 1100ms ease 600ms,
		transform 1300ms cubic-bezier(.22, 1, .36, 1) 600ms;
}

.av-final-cta.is-visible
.av-final-cta__button--primary {
	animation:
		avFinalCtaPulseDouble 5200ms ease 1400ms 1;
}


@keyframes avFinalCtaPulseDouble {

	/* حالت عادی */
	0%,
	5% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}

	/* Pulse اول */
	15% {
		box-shadow:
			0 0 16px rgba(255, 77, 26, 0.90),
			0 0 38px rgba(255, 77, 26, 0.48),
			0 0 85px rgba(255, 77, 26, 0.22);
	}

	25% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}


	/* مکث */
	25%,
	65% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}


	/* Pulse دوم */
	78% {
		box-shadow:
			0 0 16px rgba(255, 77, 26, 0.90),
			0 0 38px rgba(255, 77, 26, 0.48),
			0 0 85px rgba(255, 77, 26, 0.22);
	}

	90%,
	100% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}
}

.av-final-cta.is-visible .av-final-cta__text {
	opacity: 1;
	transform: translateY(0);
	filter: blur(0);
}

.av-final-cta.is-visible .av-final-cta__actions {
	opacity: 1;
	transform: translateY(0);
}


/* Primary button cinematic pulse */

.av-final-cta.is-visible
.av-final-cta__button--primary {
	animation: avFinalCtaPulse 1400ms ease 900ms 1;
}


@keyframes avFinalCtaPulse {

	0% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}

	45% {
		box-shadow:
			0 0 14px rgba(255, 77, 26, 0.85),
			0 0 34px rgba(255, 77, 26, 0.45),
			0 0 80px rgba(255, 77, 26, 0.20);
	}

	100% {
		box-shadow:
			0 0 8px rgba(255, 77, 26, 0.35),
			0 0 18px rgba(255, 77, 26, 0.18),
			0 0 42px rgba(255, 77, 26, 0.08);
	}

}

/* =========================================
   SERVICES → EXPERIENCE SPACING FIX
========================================= */

.av-services {
	min-height: 720px;
}

.av-experience__container {
	padding-top: 126px;
}

/* =========================================
   EXPERIENCE → FOUNDERS SPACING
========================================= */

.av-founders {
	margin-top: 120px;
}

/* =========================================
   PROCESS → FINAL CTA SPACING
========================================= */

.av-final-cta {
	margin-top: 120px;
}

/* =========================================
   FOUNDERS → PROCESS SPACING
========================================= */

.av-process {
	margin-top: 120px;
}

/* =========================================================
   AVANSEN — MOBILE HEADER
========================================================= */

.av-header__menu-toggle,
.av-mobile-menu {
	display: none;
}


@media (max-width: 768px) {

	/* =========================
	   HEADER
	========================= */

	.av-header {
		height: 72px;
	}

	.av-header__inner {
		position: relative;
		z-index: 1002;

		width: 100%;
		height: 72px;

		padding: 0 20px;

		display: flex;
		align-items: center;
		justify-content: space-between;

		box-sizing: border-box;
	}


	/* Desktop elements */

	.av-header__descriptor,
	.av-header__nav {
		display: none;
	}


	/* Logo */

	.av-header__logo {
		position: relative;
		z-index: 2;

		display: block;

		width: 112px;
		height: auto;

		margin: 0;
	}

	.av-header__logo img {
		display: block;

		width: 100%;
		height: auto;
	}


	/* =========================
	   MENU BUTTON
	========================= */

	.av-header__menu-toggle {
		position: relative;
		z-index: 2;

		width: 44px;
		height: 44px;

		padding: 0;

		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

		gap: 7px;

		border: 0;
		background: transparent;

		cursor: pointer;
	}

	.av-header__menu-toggle-line {
		display: block;

		width: 25px;
		height: 1.5px;

		background: #fff;

		border-radius: 10px;

		transition:
			transform .3s ease,
			opacity .3s ease;
	}


	/* =========================
	   HEADER BACKDROP
	========================= */

	.av-header__backdrop {
		position: absolute;

		inset: 0;

		width: 100%;
		height: 72px;

		background: rgba(11, 10, 10, .82);

		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);

		pointer-events: none;
	}


	/* =====================================================
	   FULLSCREEN MOBILE MENU
	===================================================== */

	.av-mobile-menu {
		position: fixed;

		inset: 0;

		z-index: 9999;

		width: 100%;
		height: 100dvh;

		padding:
			max(18px, env(safe-area-inset-top))
			20px
			max(24px, env(safe-area-inset-bottom));

		display: flex;
		flex-direction: column;

		box-sizing: border-box;

		background: #0B0A0A;

		overflow: hidden;

		opacity: 0;
		visibility: hidden;

		transform: translateY(-12px);

		pointer-events: none;

		transition:
			opacity .32s ease,
			transform .32s ease,
			visibility .32s ease;
	}


	/* Open */

	body.av-menu-open {
		overflow: hidden;
	}

	body.av-menu-open .av-mobile-menu {
		opacity: 1;
		visibility: visible;

		transform: translateY(0);

		pointer-events: auto;
	}


	/* =========================
	   ORANGE GLOW
	========================= */

	.av-mobile-menu__glow {
		position: absolute;

		z-index: 0;

		width: 360px;
		height: 360px;

		right: -190px;
		top: 18%;

		border-radius: 50%;

		background:
			radial-gradient(
				circle,
				rgba(255, 102, 0, .20) 0%,
				rgba(255, 102, 0, .08) 38%,
				rgba(255, 102, 0, 0) 72%
			);

		filter: blur(10px);

		pointer-events: none;
	}


	/* =========================
	   TOP
	========================= */

	.av-mobile-menu__top {
		position: relative;
		z-index: 2;

		width: 100%;

		display: flex;
		align-items: center;
		justify-content: space-between;
	}


	.av-mobile-menu__logo {
		display: block;

		width: 112px;
	}

	.av-mobile-menu__logo img {
		display: block;

		width: 100%;
		height: auto;
	}


	/* Close */

	.av-mobile-menu__close {
		position: relative;

		width: 44px;
		height: 44px;

		padding: 0;

		border: 0;
		background: transparent;

		cursor: pointer;
	}

	.av-mobile-menu__close span {
		position: absolute;

		top: 50%;
		left: 50%;

		width: 25px;
		height: 1.5px;

		background: #fff;

		border-radius: 10px;
	}

	.av-mobile-menu__close span:first-child {
		transform:
			translate(-50%, -50%)
			rotate(45deg);
	}

	.av-mobile-menu__close span:last-child {
		transform:
			translate(-50%, -50%)
			rotate(-45deg);
	}


	/* =========================
	   NAVIGATION
	========================= */

	.av-mobile-menu__nav {
		position: relative;
		z-index: 2;

		width: 100%;

		margin: auto 0;

		display: flex;
		flex-direction: column;

		direction: rtl;
	}


	.av-mobile-menu__nav > a {
	width: 100%;
	min-height: 68px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	direction: rtl;

	gap: 20px;

	border-bottom: 1px solid rgba(255,255,255,.12);

	color: #fff;
	text-decoration: none;

	font-family: "Kalameh", sans-serif;
	font-size: 28px;
	font-weight: 500;
	line-height: 1.4;

	transition:
		color .2s ease,
		padding .2s ease;
}
	.av-mobile-menu__nav > a:first-child {
		border-top: 1px solid rgba(255,255,255,.12);
	}


	.av-mobile-menu__nav > a:active {
		color: #FF6600;
	}


	/* Numbers */

	.av-mobile-menu__number {
		direction: ltr;

		color: rgba(255,255,255,.38);

		font-size: 11px;
		font-weight: 400;
		line-height: 1;

		letter-spacing: .06em;
	}


	/* =========================
	   BOTTOM
	========================= */

	.av-mobile-menu__bottom {
		position: relative;
		z-index: 2;

		width: 100%;

		display: flex;
		align-items: flex-end;
		justify-content: space-between;

		direction: ltr;
	}


	.av-mobile-menu__descriptor {
		display: flex;
		flex-direction: column;

		color: rgba(255,255,255,.45);

		font-size: 10px;
		font-weight: 400;
		line-height: 1.45;
	}


	.av-mobile-menu__studio {
		color: rgba(255,255,255,.45);

		font-size: 10px;
		font-weight: 400;

		direction: ltr;
	}

}

/* =========================================================
   MOBILE MENU — FINAL ITEM ALIGNMENT
========================================================= */

@media (max-width: 768px) {

	.av-mobile-menu__nav {
		direction: rtl;
	}

	.av-mobile-menu__nav > a {
		display: grid;

		grid-template-columns: 1fr auto;

		align-items: center;

		width: 100%;

		direction: ltr;
	}


	/* NUMBER — LEFT */

	.av-mobile-menu__number {
		grid-column: 1;

		justify-self: start;

		margin: 0;

		direction: ltr;
		text-align: left;

		font-size: 11px;
	}


	/* TITLE — RIGHT */

	.av-mobile-menu__nav > a > span:not(.av-mobile-menu__number) {
		grid-column: 2;

		justify-self: end;

		margin: 0;

		direction: rtl;
		text-align: right;

		font-family: "Kalameh", sans-serif;
	}

}



/* =========================================================
   AVANSEN — HOME MOBILE
========================================================= */

@media (max-width: 768px) {


	/* GLOBAL */

	.av-home-page {
		overflow-x: hidden;
	}



	/* FINAL CTA */

	.av-final-cta {
		min-height: auto;
		margin-top: 64px;
	}


	.av-final-cta__inner {

		width: calc(100% - 48px);

		padding-top: 110px;
		padding-bottom: 80px;

	}


	.av-final-cta__title {

		font-size: 42px;
		line-height: 1.3;

	}


	.av-final-cta__text {

		margin-top: 20px;

		font-size: 20px;
		line-height: 1.8;

	}


	.av-final-cta__actions {

		margin-top: 36px;

		flex-direction: column;

		gap: 20px;

	}


	.av-final-cta__button {

		width: 150px;
		height: 48px;

		font-size: 22px;

	}

}



/* =========================================================
   HOME — HERO MOBILE
========================================================= */

@media (max-width: 768px) {


	.av-hero {

		min-height: 100svh;
		height: auto;

	}



	
.av-hero__content {
    position: relative;

    width: calc(100% - 48px);
    max-width: none;
    height: 100svh;

    margin: 0 auto;
    padding: 0 0 200px;
    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;

    top: auto;
    right: auto;
    bottom: auto;
    left: auto;

    transform: none;

    direction: rtl;
    text-align: right;
}




	.av-hero__title {

		font-size: 42px;

		line-height: 1.35;

	}



	.av-hero__text {

		font-size: 18px;

		margin-top: 20px;

	}



	.av-hero__cta {

		margin-top: 32px;

	}



	.av-hero__media img {

		object-position: center;

	}

}


/* =========================================================
   HOME — MANIFESTO MOBILE
========================================================= */

@media (max-width: 768px) {


	.av-manifesto {

		padding-top: 80px;
		padding-bottom: 80px;

	}



	.av-manifesto__inner {

		width: calc(100% - 48px);

		margin: 0 auto;

	}



	.av-manifesto__title {

		font-size: 34px;

		line-height: 1.55;

		text-align: right;

	}



	.av-manifesto__title span {

		display: inline;

	}



	.av-manifesto__text {

		margin-top: 24px;

		font-size: 18px;

		line-height: 1.8;

	}



	.av-manifesto__marker {

		margin-bottom: 32px;

	}

}


/* =========================================================
   HOME — SERVICES MOBILE
========================================================= */

@media (max-width: 768px) {


	.av-services {

		min-height: auto;

		padding-top: 80px;
		padding-bottom: 80px;

	}



	.av-services__container {

		width: calc(100% - 48px);

		display: flex;

		flex-direction: column;

		gap: 48px;

	}



	.av-services__intro {

		width: 100%;

		text-align: right;

	}



	.av-services__title {

		font-size: 34px;

		line-height: 1.45;

	}



	.av-services__description {

		margin-top: 20px;

		font-size: 18px;

		line-height: 1.8;

	}



	.av-services__list {

		width: 100%;

	}



	.av-service-item {

		padding: 24px 0;

		display: flex;

		align-items: center;

		justify-content: space-between;

	}



	.av-service-item__number {

		font-size: 12px;

	}



	.av-service-item__title {

		font-size: 18px;

		line-height: 1.5;

	}



	.av-service-item__text {

		font-size: 18px;

		line-height: 1.7;

	}


}


/* =========================================================
   EXPERIENCE — MOBILE PROJECT CARD
========================================================= */

@media (max-width: 768px) {

    .av-experience__stage {
        position: relative !important;

        width: 100% !important;
        height: 500px !important;

        overflow: hidden !important;
    }


    .av-experience__projects {
        position: relative !important;

        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
    }


    .av-experience__projects .av-project-card {
        position: absolute !important;

        top: 50% !important;
        left: 50% !important;

        width: 537.19px !important;
        height: 577.14px !important;

        max-width: none !important;

        margin: 0 !important;

        transform-origin: center center !important;
    }


    /* CENTER CARD */

    .av-project-card.is-active {
        transform:
            translate(-50%, -50%)
            scale(.60) !important;

        opacity: 1 !important;

        z-index: 10 !important;
    }


    /* SIDE CARDS */

    .av-project-card.is-prev {
        transform:
            translate(-103%, -50%)
            scale(.44) !important;

        opacity: .20 !important;

        z-index: 5 !important;
    }


    .av-project-card.is-next {
        transform:
            translate(3%, -50%)
            scale(.44) !important;

        opacity: .20 !important;

        z-index: 5 !important;
    }


    .av-project-card.is-prev-far,
    .av-project-card.is-next-far {
        opacity: 0 !important;
        pointer-events: none !important;
    }

}


/* =========================================================
   EXPERIENCE — SMALL MOBILE
   iPhone SE / 320px–359px
========================================================= */

@media (max-width: 359px) {

    .av-project-card.is-active {
        transform:
            translate(-50%, -50%)
            scale(.53) !important;
    }


    .av-project-card.is-prev {
        transform:
            translate(-105%, -50%)
            scale(.39) !important;
    }


    .av-project-card.is-next {
        transform:
            translate(5%, -50%)
            scale(.39) !important;
    }

}


/* =========================================================
   EXPERIENCE — LARGE MOBILE
========================================================= */

@media (min-width: 390px) and (max-width: 768px) {

    .av-project-card.is-active {
        transform:
            translate(-50%, -50%)
            scale(.66) !important;
    }


    .av-project-card.is-prev {
        transform:
            translate(-101%, -50%)
            scale(.48) !important;
    }


    .av-project-card.is-next {
        transform:
            translate(1%, -50%)
            scale(.48) !important;
    }

}


/* =========================================================
   FOUNDERS MOBILE FIX
========================================================= */

@media (max-width:768px) {


	.av-founders {

		position:relative;

	}



	.av-founders__visual {

		position:relative !important;

		width:100% !important;

		height:auto !important;

		margin-top:40px;

		order:2;

	}



	.av-founders__visual img {

		position:relative !important;

		width:100% !important;

		height:auto !important;

		display:block;

		object-fit:contain;

	}



	.av-founders__content {

		position:relative !important;

		display:flex !important;

		flex-direction:column;

		width:calc(100% - 48px);

		margin:40px auto 0;

		gap:48px;

		order:3;

	}



	.av-founder {

		position:relative !important;

		width:100%;

	}



	.av-founder--hossein,
	.av-founder--sahar {

		top:auto !important;

		left:auto !important;

		right:auto !important;

		bottom:auto !important;

		transform:none !important;

	}



}

/* =========================================================
   EXPERIENCE PROJECT LINK MOBILE FIX
========================================================= */

@media (max-width: 768px) {

    .av-experience__projects-link {
        position: relative !important;

        display: inline-flex !important;
        align-items: center;
        justify-content: center;

        width: 180px !important;
        height: 48px !important;

        margin-top: 28px;

        padding: 0 18px !important;

        right: auto !important;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;

        transform: none !important;

        border-width: 1px !important;
        border-radius: 16px !important;

        font-size: 16px !important;
        line-height: 1 !important;

        white-space: nowrap;
    }

}

/* =========================================================
   PROCESS MOBILE RESET
========================================================= */

@media (max-width:768px){


	.av-process {

		overflow:hidden;

	}



	.av-process__steps {

		position:relative !important;

		width:calc(100% - 48px) !important;

		height:auto !important;

		margin:50px auto 0 !important;

		display:flex !important;

		flex-direction:column !important;

		gap:50px !important;

	}



	.av-process-step {

		position:relative !important;

		top:auto !important;

		left:auto !important;

		right:auto !important;

		bottom:auto !important;

		transform:none !important;

		width:100% !important;

		height:auto !important;

		min-height:120px;

		padding-right:70px !important;

		opacity:1 !important;

	}



	.av-process-step__number {

		position:absolute !important;

		right:0 !important;

		top:0 !important;

	}



	.av-process-step__point {

		position:absolute !important;

		right:38px !important;

		top:5px !important;

	}



	.av-process-step__title {

		position:relative !important;

		margin:0 !important;

	}



	.av-process-step__text {

		position:relative !important;

		margin-top:12px !important;

	}



	.av-process__path {

		display:none !important;

	}



	.av-process__steps::before {

		content:"";

		display:block;

		position:absolute;

		right:43px;

		top:10px;

		bottom:10px;

		width:1px;

		background:rgba(255,255,255,.25);

	}



}

/* =========================================================
   PROCESS MOBILE CLEANUP
========================================================= */

@media (max-width:768px){


	.av-process-step__number {

		font-size:14px !important;

		color:#FF6600 !important;

		width:auto !important;

		height:auto !important;

		border:none !important;

		background:none !important;

	}



	.av-process-step__number::before,
	.av-process-step__number::after {

		display:none !important;

	}



	.av-process-step__point {

		background:#FF6600 !important;

		border:none !important;

		box-shadow:none !important;

		width:10px !important;

		height:10px !important;

	}



	.av-process-step::before,
	.av-process-step::after {

		display:none !important;

	}



	.av-process__steps::after {

		display:none !important;

	}



	.av-process__path {

		display:none !important;

	}



}


/* =========================================================
   PROCESS MOBILE — EXACT TIMELINE
========================================================= */

@media (max-width:768px) {

	/* خط قبلی را حذف کن */
	.av-process__steps::before {
		display:none !important;
	}


	.av-process-step {
		position:relative !important;
	}


	/* نقطه */
	.av-process-step__point {
		position:absolute !important;

		right:38px !important;
		top:5px !important;

		width:12px !important;
		height:12px !important;

		border-radius:50% !important;

		background:#FF5A00 !important;

		box-shadow:
			0 0 8px rgba(255,90,0,1),
			0 0 18px rgba(255,90,0,.65),
			0 0 32px rgba(255,90,0,.35) !important;

		z-index:3 !important;
	}


	/* خط دقیقاً از مرکز همان نقطه */
	.av-process-step__point::after {
		content:"";

		position:absolute;

		top:12px;

		left:50%;

		transform:translateX(-50%);

		width:1px;

		height:calc(120px + 50px);

		background:rgba(255,255,255,.22);

		z-index:-1;
	}


	/* مرحله آخر خط ادامه نداشته باشد */
	.av-process-step:last-child .av-process-step__point::after {
		display:none;
	}


	/* Active glow */
	.av-process-step.is-active .av-process-step__point {
		box-shadow:
			0 0 8px #FF6600,
			0 0 20px rgba(255,102,0,.8),
			0 0 40px rgba(255,102,0,.4) !important;
	}

}


/* =========================================================
   SERVICES MOBILE — FINAL ROW LAYOUT
========================================================= */

@media (max-width: 768px) {

    .av-service-item {
        display: grid !important;

        grid-template-columns:
            34px
            minmax(0, 1fr)
            34px !important;

        column-gap: 18px !important;

        align-items: center;

        width: 100%;
        min-height: 108px;
        height: auto !important;

        padding: 18px 0 !important;

        direction: ltr;
    }


    /* NUMBER — LEFT */

    .av-service-item__number {
        grid-column: 1 !important;

        justify-self: start;
        align-self: center;

        margin: 0 !important;

        font-size: 14px !important;

        white-space: nowrap;
    }


    /* CONTENT — CENTER */

    .av-service-item__content {
        grid-column: 2 !important;

        width: 100%;
        min-width: 0;

        margin: 0 !important;
        padding: 0 !important;

        direction: rtl;
        text-align: right;

        justify-self: stretch;
    }


    .av-service-item__content h3 {
        margin: 0 !important;

        font-size: 20px !important;
        line-height: 1.35 !important;

        white-space: normal !important;

        direction: rtl;
        text-align: right !important;
    }


    .av-service-item__content p {
        margin: 7px 0 0 !important;

        font-size: 14px !important;
        line-height: 1.45 !important;

        white-space: normal !important;

        direction: rtl;
        text-align: right !important;
    }


    /* ARROW — RIGHT */

    .av-service-item__arrow {
        grid-column: 3 !important;

        justify-self: end;
        align-self: center;

        width: 30px !important;
        height: 30px !important;

        margin: 0 !important;
    }

}


/* =========================================================
   FOUNDERS MOBILE — TITLE / IMAGE SPACING
========================================================= */

@media (max-width: 768px) {

    .av-founders__visual {
        margin-top: -30px !important;
    }

}


/* =========================================================
   FOUNDERS MOBILE — INFO FINAL
========================================================= */

@media (max-width: 768px) {

    /* هر Founder */

    .av-founder {
        width: 100% !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;

        text-align: center !important;
    }


    /* Name */

    .av-founder__name {
        width: auto !important;

        margin: 0 !important;

        font-size: 18px !important;
        line-height: 1.1 !important;

        text-align: center !important;
    }


    /* خط زیر اسم */

    .av-founder__name::after {
        left: 50% !important;
        right: auto !important;

        transform: translateX(-50%) !important;

        width: 150px !important;
    }


    /* Role */

    .av-founder__role {
        margin-top: 7px !important;

        font-size: 12px !important;
        line-height: 1.3 !important;

        text-align: center !important;
    }


    /* List */

    .av-founder__list {
        width: auto !important;

        margin: 14px auto 0 !important;
        padding: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;

        list-style: none !important;
    }


    .av-founder__list li {
        margin: 0 0 6px !important;
        padding: 0 !important;

        font-size: 12px !important;
        line-height: 1.35 !important;

        text-align: left !important;
    }


    /* Orange bullet */

    .av-founder__list li::before {
        width: 6px !important;
        height: 6px !important;

        margin-right: 7px !important;
    }


    /* فاصله حسین و سحر */

    .av-founders__content {
        gap: 50px !important;
    }

}

@media (max-width: 768px) {

    /* حذف خط بین اسم و Position */
    .av-founder__name::before,
    .av-founder__name::after,
    .av-founder__role::before,
    .av-founder__role::after {
        display: none !important;
        content: none !important;
    }


    /* آیتم‌ها */
    .av-founder__list li {
        margin-bottom: 5px !important;

        font-size: 10px !important;
        line-height: 1.35 !important;
    }


    /* دایره نارنجی */
    .av-founder__list li::before {
        width: 2px !important;
        height: 2px !important;

        min-width: 4px !important;
        min-height: 4px !important;

        margin-right: 6px !important;

        border-radius: 50% !important;
    }


    /* فاصله Position تا لیست */
    .av-founder__list {
        margin-top: 12px !important;
    }

}

/* =========================================================
   FOUNDERS MOBILE — TRUE VIEWPORT CENTER
========================================================= */

@media (max-width: 768px) {

    /* کانتینر اصلی اطلاعات */
    .av-founders__content {
        width: 100% !important;
        max-width: none !important;

        margin-left: auto !important;
        margin-right: auto !important;

        padding-left: 24px !important;
        padding-right: 24px !important;

        box-sizing: border-box;
    }


    /* هر Founder دقیقاً عرض کامل کانتینر */
    .av-founder,
    .av-founder--hossein,
    .av-founder--sahar {
        width: 100% !important;
        max-width: none !important;

        margin-left: auto !important;
        margin-right: auto !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;

        text-align: center !important;
    }


    /* اسم */
    .av-founder__name {
        width: 100% !important;

        text-align: center !important;
    }


    /* Position */
    .av-founder__role {
        width: 100% !important;

        text-align: center !important;
    }


    /* لیست */
    .av-founder__list {
        width: fit-content !important;
        max-width: 100% !important;

        margin: 14px auto 0 !important;
        padding: 0 !important;

        align-self: center !important;
    }


    /* خود آیتم‌ها داخل لیست همچنان مرتب بمانند */
    .av-founder__list li {
        text-align: left !important;
    }

}


/* =========================================================
   HOME MOBILE — SPACING RESET
========================================================= */

@media (max-width: 768px) {

    /* -------------------------
       SERVICES
    ------------------------- */

    .av-services {
        min-height: 0 !important;
        margin-top: 0 !important;
        padding-top: 64px !important;
        padding-bottom: 0 !important;
    }

    .av-services__container {
        padding-top: 0 !important;
    }


    /* -------------------------
       EXPERIENCE
    ------------------------- */

    .av-experience {
        min-height: 0 !important;
        margin-top: 80px !important;
        padding: 0 !important;
    }

    .av-experience__container {
        padding-top: 0 !important;
    }


    /* -------------------------
       FOUNDERS
    ------------------------- */

    .av-founders {
        height: auto !important;
        min-height: 0 !important;

        margin-top: 80px !important;
        padding: 0 !important;
    }


    /* -------------------------
       PROCESS
    ------------------------- */

    .av-process {
        min-height: 0 !important;

        margin-top: 80px !important;
        padding: 0 !important;
    }


    /* -------------------------
       FINAL CTA
    ------------------------- */

    .av-final-cta {
        min-height: 0 !important;

        margin-top: 80px !important;
        padding: 0 !important;
    }

}


/* =========================================================
   MOBILE — MARKER → TITLE FIX
   Manifesto / Services / Experience
========================================================= */

@media (max-width: 768px) {

    /* =========================
       MANIFESTO
    ========================= */

    .av-manifesto {
        padding-top: 0 !important;
    }

    .av-manifesto__inner {
        padding-top: 0 !important;
    }

    .av-manifesto__marker {
        position: relative !important;
        top: auto !important;

        margin: 0 0 48px !important;
    }


    /* =========================
       SERVICES
    ========================= */

    .av-services {
        padding-top: 0 !important;
    }

    .av-services__container {
        padding-top: 0 !important;
    }

    .av-services__marker {
        position: relative !important;
        top: auto !important;

        margin: 0 0 48px !important;
    }


    /* =========================
       EXPERIENCE
    ========================= */

    .av-experience__container {
        padding-top: 0 !important;
    }

    .av-experience__marker {
        position: relative !important;
        top: auto !important;

        margin: 0 0 48px !important;
    }

}


/* =========================================================
   FOUNDERS MOBILE — HEIGHT FIX
========================================================= */

@media (max-width: 768px) {

    .av-founders {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

}


.av-project-card {
    cursor: pointer;
}

.av-project-card__link {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: block;
}



/* PROJECT NAVIGATION — MOBILE */
@media (max-width: 768px) {

    /* فضای اضافه برای فلش‌ها */
    .av-experience__stage {
    height: 570px !important;
    overflow: hidden !important;
}

.av-experience__projects {
    height: 500px !important;
}

    /* فلش‌های کوچک، پایین کارت */
    .av-experience__nav {
        position: absolute;
        top: auto !important;
        bottom: 8px !important;
        transform: none !important;

        width: 34px !important;
        height: 34px !important;
        padding: 0 !important;

        display: flex;
        align-items: center;
        justify-content: center;

        font-size: 18px !important;
        line-height: 1;

        z-index: 30;
    }

    /* فلش چپ */
    .av-experience__nav--prev {
        left: calc(50% - 44px) !important;
        right: auto !important;
    }

    /* فلش راست */
    .av-experience__nav--next {
        right: calc(50% - 44px) !important;
        left: auto !important;
    }
    
    
/* =========================================
   EXPERIENCE — MOBILE PERFORMANCE FIX
========================================= */

@media (max-width: 768px) {

    /* فضای کارت‌ها مستقل از فضای فلش‌ها */
    .av-experience__stage {
        height: 570px !important;
        overflow: hidden !important;
        isolation: isolate;
    }

    .av-experience__projects {
        height: 500px !important;
    }

    /* انیمیشن سبک‌تر برای کارت‌ها */
    .av-experience__projects .av-project-card {
        transition:
            transform 450ms ease,
            opacity 350ms ease !important;

        filter: none !important;

        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    /* حذف سایه‌های محاسباتی کارت فعال */
    .av-experience__projects .av-project-card.is-active {
        filter: none !important;
    }

    /* کارت‌های پنهان نباید لمس دریافت کنند */
    .av-experience__projects .av-project-card.is-hidden,
    .av-experience__projects .av-project-card.is-prev-far,
    .av-experience__projects .av-project-card.is-next-far {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* فلش‌ها بالاتر از لایه کارت‌ها */
    .av-experience__nav {
        position: absolute !important;
        top: auto !important;
        bottom: 65px !important;

        transform: none !important;

        width: 34px !important;
        height: 34px !important;

        z-index: 100 !important;

        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;

        transition:
            opacity 150ms ease,
            background-color 150ms ease,
            border-color 150ms ease !important;
    }

    .av-experience__nav--prev {
        left: calc(50% - 44px) !important;
        right: auto !important;
    }

    .av-experience__nav--next {
        right: calc(50% - 44px) !important;
        left: auto !important;
    }

    .av-experience__nav:disabled {
        pointer-events: auto !important;
    }

}

    
}



/* HERO BUTTON — MOBILE */

@media (max-width: 768px) {

    .av-hero__cta {
        width: 140px !important;
        height: 44px;

        padding: 0 12px;
        box-sizing: border-box;

        background: rgba(0, 0, 0, 0.25) !important;
        border: 1px solid rgba(255, 255, 255, 0.85);

        font-family: "Kalameh", sans-serif;
        font-size: 18px;
        font-weight: 400;

        align-self: flex-start;
    }

}


/* MOBILE — FIX KALAMEH TYPOGRAPHY */

@media (max-width: 768px) {

    /* توضیحات زیر عنوان هر خدمت */
    .av-services .av-service-item__content p {
        font-family: "Kalameh", sans-serif !important;
        font-weight: 400 !important;
         font-size: 18px;
        font-style: normal !important;
    }

    /* دو دکمه CTA پایانی */
    .av-final-cta .av-final-cta__button,
    .av-final-cta .av-final-cta__button--primary,
    .av-final-cta .av-final-cta__button--secondary {
        font-family: "Kalameh", sans-serif !important;
        font-weight: 400 !important;
         font-size: 16px;
        font-style: normal !important;
    }
}


/* PROCESS TITLE — MOBILE */
@media (max-width: 768px) {
    .av-process__title {
        font-size: 32px;
        line-height: 1.3;
    }
}








/* =========================================
   AVANSEN — FOUNDERS MOBILE
   CINEMATIC LAYOUT
========================================= */

@media (max-width: 768px) {

    /* =====================================
       01 — CONTROL PANEL
       تنظیمات اصلی سکشن
    ===================================== */

    .av-founders {

        /* IMAGE */
        --visual-move-y: -60px;
        --image-to-content: 12px;

        /* SECTION SPACING */
        --founders-gap: 42px;
        --founders-bottom: 50px;
        --content-padding: 28px;

        /* TYPOGRAPHY */
        --name-size: 60px;
        --role-size: 45px;
        --skills-size: 15px;

        /* INTERNAL SPACING */
        --name-to-role: 8px;
        --role-to-skills: 36px;
        --skills-gap: 4px;

        /* SKILLS */
        --skills-width: 270px;
        --bullet-size: 8px;
        --bullet-gap: 16px;
        --bullet-color: #F15A18;

        /* DIVIDER */
        --divider-width: 420px;
        --divider-color: rgba(241, 90, 24, 0.28);

        box-sizing: border-box;
        padding-bottom: var(--founders-bottom);
        overflow: hidden;
    }


    /* =====================================
       02 — CINEMATIC IMAGE
    ===================================== */

    .av-founders__visual {
        position: relative;
        transform: translateY(var(--visual-move-y));
    }

    .av-founders__visual img {
        display: block;
        max-width: 100%;
        height: auto;
    }


    /* =====================================
       03 — CONTENT CONTAINER
    ===================================== */

    .av-founders__content {
        position: relative;
        left: auto;
        right: auto;
        transform: none;

        display: flex;
        flex-direction: column;
        align-items: center;

        width: 100%;
        max-width: 100%;
        box-sizing: border-box;

        margin: var(--image-to-content) auto 0;
        padding: 0 var(--content-padding);

        gap: 0;
    }


    /* =====================================
       04 — INDIVIDUAL FOUNDER
    ===================================== */

    .av-founder,
    .av-founder--hossein,
    .av-founder--sahar {
        position: relative;
        left: auto;
        right: auto;
        transform: none;

        display: flex;
        flex-direction: column;
        align-items: center;

        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0;
        box-sizing: border-box;

        text-align: center;
    }


    /* =====================================
       05 — NAMES
    ===================================== */

    .av-founder__name {
        margin: 0 0 var(--name-to-role);
        padding: 0;

        font-size: var(--name-size);
        font-weight: 500;
        line-height: 1.2;
        letter-spacing: -0.5px;

        color: #FFFFFF;
        text-align: center;
    }


    /* =====================================
       06 — ROLES
    ===================================== */

    .av-founder__role {
        margin: 0 0 var(--role-to-skills);
        padding: 0;

        font-size: var(--role-size);
        font-weight: 400;
        line-height: 1.5;
        letter-spacing: 0;

        color: #BABABA;
        text-align: center;
    }


    
/* =====================================
   07 — SKILLS LIST
===================================== */

.av-founder__skills {
    display: flex;
    flex-direction: column;
    align-items: center;

    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;

    gap: var(--skills-gap);
    list-style: none;
    text-align: center;
}

/* =====================================
   08 — SKILL ROWS
===================================== */

.av-founder__skills li {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;

    font-size: var(--skills-size);
    font-weight: 400;
    line-height: 1.45;
    color: #BABABA;
    text-align: center;

    list-style: none;
}

/* =====================================
   09 — REMOVE BULLETS
===================================== */

.av-founder__skills li::before,
.av-founder__skills li::after {
    content: none;
    display: none;
}

.av-founder__skills li::marker {
    content: none;
}


    

/* 10 — DIVIDER SPACING */

.av-founders__content {
    gap: 0;
}

.av-founder--hossein::after {
    content: "";
    display: block;
    width: var(--divider-width);
    max-width: 100%;
    height: 1px;

    margin: 24px auto 0;

    background: linear-gradient(
        90deg,
        transparent,
        var(--divider-color),
        transparent
    );
}

.av-founders__content .av-founder--sahar {
    margin: 24px 0 0;
}


}








/* =========================================
   AVANSEN — FOUNDERS MOBILE FIX
========================================= */

@media (max-width: 768px) {

    .av-founders {
        --image-height: 320px;
        --image-to-content: 12px;
        --content-padding: 24px;

        --name-size: 30px;
        --role-size: 13px;
        --skills-size: 15px;

        --role-to-skills: 32px;
        --skills-gap: 6px;

        --divider-width: 220px;
        --divider-spacing: 32px;

        position: relative !important;
        display: flex !important;
        flex-direction: column !important;

        width: 100%;
        height: auto !important;
        min-height: 0 !important;

         margin-top: 0 !important;
    padding-bottom: 24px !important;

        overflow: hidden !important;
        box-sizing: border-box;
    }

    /* TITLE */

    .av-founders__heading {
        position: relative !important;
        top: auto !important;
        left: auto !important;

        width: calc(100% - 48px) !important;
         margin: 100px auto 24px !important;

        transform: none !important;
        order: 1;
    }

    /* IMAGE */

    .av-founders__visual {
        position: relative !important;
        inset: auto !important;

        width: 100% !important;
        height: var(--image-height) !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;
        order: 2;

        overflow: hidden;
    }

    .av-founders__visual img {
        display: block;
        width: 100% !important;
        height: 100% !important;

        max-width: none !important;
        object-fit: cover !important;
        object-position: center top !important;
    }

    /* CONTENT */

    .av-founders__content {
        position: relative !important;
        inset: auto !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;

        width: 100% !important;
        max-width: none !important;

        margin: var(--image-to-content) auto 0 !important;
        padding: 0 var(--content-padding) !important;

        gap: 0 !important;
        transform: none !important;

        box-sizing: border-box;
        order: 3;
    }

    /* FOUNDER BLOCKS */

    .av-founder,
    .av-founder--hossein,
    .av-founder--sahar {
        position: relative !important;
        inset: auto !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: center !important;
        transform: none !important;
        box-sizing: border-box;
    }

    /* NAME */

    .av-founder__name {
        display: block !important;
        width: auto !important;

        margin: 0 0 8px !important;
        padding: 0 !important;

        font-size: var(--name-size) !important;
        line-height: 1.2 !important;
        font-weight: 500;

        color: #fff;
        text-align: center !important;
    }

    .av-founder__name::before,
    .av-founder__name::after {
        content: none !important;
        display: none !important;
    }

    /* ROLE */

    .av-founder__role {
        margin: 0 0 var(--role-to-skills) !important;
        padding: 0 !important;

        font-size: var(--role-size) !important;
        line-height: 1.5 !important;

        color: #bababa;
        text-align: center !important;
    }

    /* SKILLS */

    .av-founder__skills {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;

        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;

        gap: var(--skills-gap) !important;
        list-style: none !important;
    }

    .av-founder__skills li {
        display: block !important;

        width: 100%;
        margin: 0 !important;
        padding: 0 !important;

        font-size: var(--skills-size) !important;
        line-height: 1.35 !important;

        color: #bababa;
        text-align: center !important;
        list-style: none !important;
    }

    .av-founder__skills li::before,
    .av-founder__skills li::after,
    .av-founder__skills li::marker {
        content: none !important;
        display: none !important;
    }

    /* DIVIDER */

    .av-founder--hossein::after {
        content: "" !important;
        display: block !important;

        width: var(--divider-width);
        max-width: 100%;
        height: 1px;

        margin: var(--divider-spacing) auto !important;

        background: linear-gradient(
            90deg,
            transparent,
            rgba(241, 90, 24, 0.4),
            transparent
        );
    }

    /* NEXT SECTION */

    .av-process {
        position: relative;
        clear: both;
    }
}