/* رنگ ها */

:root {
    --primary-100: #E4DCCF;
    --primary-200: #F0EBE3;
    --primary-300: #3F5B62;
    --accent-100: #D69955;
    --accent-200: #F8DAA8;
    --text-100: #EEEEEE;
    --text-200: #DCDCDC;
    --bg-100: #576F72;
    --bg-200: #7D9D9C;
    --bg-300: #8CA9AA;
}


/* ساختار سایت */

html,
body {
    scroll-behavior: smooth;
}

div {
    color: var(--text-100);
}

/*
.main-menu ul li a:hover {
    color: var(--accent-200);
}

a:hover {
    color: var(--accent-200);
}
*/
#up {
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 100px;
    aspect-ratio: 1;
    margin: 0 auto;
    background-image: url(images/btn.png);
}

#up:hover {
    background-position: top right;
}

body {
    background-color: var(--bg-100);
    background-attachment: fixed;
}

h1 {
    text-align: center;
    color: var(--text-200);
}


/*
nav {
    color: var(--text-100);
}

.main-menu ul li a {
    color: var(--text-100);
    text-decoration: none;
}
*/
.fotr {
    color: var(--primary-200);
}

.hovr {
    color: var(--primary-200);
}

/*main {*/
/*    width: 950px;*/
/*    min-height: 1000px;*/
/*    margin: 0 auto;*/
/*    padding: 10px;*/
/*}*/

/*header,*/
/*aside,*/
/*article,*/
/*footer {*/
/*    background-color: var(--text-100);*/
/*    border-radius: 10px;*/
/*    border: 1px solid;*/
/*    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;*/
/*}*/

/*header {*/
/*    background-color: var(--bg-300);*/
/*    border: 0px solid var(--primary-300);*/
/*    text-shadow: 0px;*/
/*    min-height: 150px;*/
/*    margin-bottom: 10px;*/
/*}*/


/*aside {*/
/*    background-color: var(--bg-300);*/
/*    border: 0px solid var(--primary-300);*/
/*    text-shadow: 0px;*/
/*    width: 198px;*/
/*    min-height: 720px;*/
/*    float: right;*/
/*    padding: 5px;*/
/*}*/


/*article {*/
/*    background-color: var(--bg-300);*/
/*    border: 0px solid var(--primary-300);*/
/*    text-shadow: 0px;*/
/*    width: 718px;*/
/*    min-height: 720px;*/
/*    float: right;*/
/*    margin-right: 10px;*/
/*    padding: 5px;*/
/*}*/

/*footer {*/
/*    background-color: var(--bg-300);*/
/*    border: 0px solid var(--primary-300);*/
/*    text-shadow: 0px;*/
/*    margin-top: 10px;*/
/*    min-height: 100px;*/
/*    text-align: center;*/
/*    direction: ltr;*/
/*}*/

/* Website Structure */
main{
	width: 950px;
	min-height: 1000px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 200px auto;
	grid-template-rows: auto auto auto;
	grid-template-areas: 
	'header header'
	'aside article'
	'footer footer'
	;
	gap: 10px;
	/*background-color: white;*/
	padding: 10px;
	border: 10px solid black;
	border-image: url(../images/border.png) 20% stretch;
	/*visibility: hidden;*/
	/*background-clip: padding-box;*/
}
header,aside,article,footer{
	border-radius: 10px;
	background-color: white;
	border: 1px solid #dee2e6;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
header{
	grid-area: header;
}
aside{
	grid-area: aside;
}
article{
	grid-area: article;
	padding: 5px;
}
footer{
	grid-area: footer;
	direction: ltr;
	text-align: center;
	letter-spacing: 7px;
}
/* فرم */

.login-box {
    text-align: center;
}

.logo img {
    width: 70px;
}

.form-signin {
    font-size: 13px;
    padding: 6px 10px;
    height: auto;
    text-align: right;
    margin-bottom: 8px;
    width: 250px;
    margin-left: auto;
    margin-right: auto;
}

.btn-signin {
    font-size: 13px;
    padding: 6px 10px;
    width: 250px;
}

.footer {
    margin-top: 15px;
    font-size: 11px;
    color: #666;
}

.remember-me {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
}


/* فونت */

h2 {
    color: var(--text-100);
}

h3 {
    color: var(--text-200);
}

p {
    color: var(--primary-200);
}

.flesh {
    color: var(--text-100);
    text-decoration: none;
}


/* گالری */

.pegeghallery {
    color: var(--text-100);
}

.olpegeghallery {
    color: var(--text-100);
}

.olpegeghallery li a {
    text-decoration: none;
    color: var(--text-100);
}

.olpegeghallery li a:hover {
    color: var(--accent-200);
}

.gallery {
    text-align: center;
}


.buttons {
    text-align: center;
    margin: 20px;
}

.nav-button {
    padding: 10px 20px;
    background-color: var(--primary-300);
    color: wheat;
    text-decoration: none;
    border-radius: 5px;
    font-size: 16px;
    transition: background 0.3s;
}

.nav-button:hover {
    background-color: var(--accent-200);
}

/* مقالات */

.maghalat {
    text-decoration: none;
    color: var(--primary-300);
}

.maghalat li h2 {
    color: var(--primary-300);
}

.maghalat ol li h3 a {
    text-decoration: none;
    color: var(--primary-300);
}

.maghalat ol li h3 a:hover {
    color: var(--accent-200);
}


.fehrest li a:hover {
    color: var(--accent-200);
}

.fehrest li a {
    color: var(--primary-200);
    text-decoration: none;
}

.fehrest {
    color: var(--primary-200);
}

.fehrest-1 {
    color: var(--primary-100);
}

.img1 {
    text-align: center;
    width: 90%;
    height: auto;
    width: 500px 90%;
    height: 400px auto;
}

.img2 {
    height: auto;
    max-height: 250px;
    max-width: 100%;
    object-fit: cover;
    direction: rtl;

}

.img2 {
    width: 100% 250px;
    height: 100% 250px;
    object-fit: contain;
    display: block;
}

.h5-color {
    font-size: 24px;
    margin-bottom: 10px;
    font-weight: 300;
    color: var(--primary-300);
    font-family: 'Vazir', 'Iran', 'Sans', Tahoma, sans-serif;
    text-align: right;
    direction: rtl;
}

.p-color {
    font-size: 16px;
    line-height: 1.1;
    font-weight: 100;
    color: var(--bg-100);
    font-family: 'Vazir', 'Iran', 'Sans', Tahoma, sans-serif;
    text-align: justify;
    direction: rtl;
}

.link-color {
    color: var(--accent-100);
    text-decoration: none;
    text-align: center;
}

.link-color:hover {
    color: var(--bg-300);
}

.carousel-item {
    height: 500px;
    width: 700px;
    object-fit: cover;
}

.fg1 {
    color: var(--accent-200);
}

.maghalat-h2 {
    text-align: center;
    color: var(--accent-200);
}


/* صفحه اصلی */


.s1-p {
    color: var(--bg-200);
}

.s1-h5 {
    color: var(--bg-100);
}

.bg-s1 {
    background-color: var(--bg-100);
}

.s1-div {
    background-color: var(--primary-100);
}

.s1-h2 {
    color: var(--text-100);
}

.s1-button {
    text-decoration: none;
}

.s1-ph2 {
    color: var(--text-200);
}


.custom-button {
    background-color: var(--text-100);
    border: none;
    color: var(--bg-100);
    padding: 8px 10px;
    font-size: 1.0em;
    display: flex;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.custom-button:hover {
    background-color: var(--primary-100);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.custom-button .arrow {
    font-size: 1.5em;
    line-height: 1;
}


/* درباره ما */


.glass-box {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8px);
    border-radius: 15px;
    padding: 30px;
    text-align: center;
}

.service-card {
    transition: transform 0.3s;
}

.service-card:hover {
    transform: translateY(-10px);
}

.email {
    text-decoration: none;
    color: var(--primary-300);
}

.address {
    text-decoration: none;
    color: var(--primary-300);
}

.phon {
    text-decoration: none;
    color: var(--primary-300);
}


/* وب سایت های مرتبط */

/* کارت شیشه‌ای */
.card1 {
    border: none;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
    color: #fff;
    text-align: center;
    padding: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card1:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

/* آیکون بالای کارت */
.card-icon {
    font-size: 3rem;
    margin-bottom: 15px;
    color: #00d4ff;
}

/* دکمه */
.btn-custom {
    margin-top: 15px;
    background: linear-gradient(135deg, #00d4ff, #0072ff);
    border: none;
    border-radius: 30px;
    padding: 10px 25px;
    color: #fff;
    font-weight: bold;
    transition: all 0.3s ease;
}

.btn-custom:hover {
    background: linear-gradient(135deg, #0072ff, #00d4ff);
    transform: scale(1.05);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.websait {
    text-align: center;
}



/* رسانه ها */




@media screen and (max-width: 1024px)
{
	#main-menu{
		display: inherit;
	}
	main{
		width: 100%;
	}
	#nav{
		display: none;
	}
	
}

@media screen and (max-width: 500px)
{
	main{
		grid-template-columns: auto;
		grid-template-rows: repeat(4, auto);
		grid-template-areas: 
		'header'
		'aside'
		'article'
		'footer'
		;
	}
}