@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;700&display=swap');


body{
    font-family:"Vazirmatn", sans-serif;

/* ================= RESET ================= */


* {

margin:0;

padding:0;

box-sizing:border-box;

}



body {

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

background:#f7f9f8;

color:#1d2b28;

line-height:1.8;

}



/* فونت انگلیسی */

.logo-en,
.hero h1,
.solution-box h2 {

font-family:"TimesNewRomanCustom", "Times New Roman", serif;

}


}



* {

margin: 0;

padding: 0;

box-sizing: border-box;

}



html {

scroll-behavior: smooth;

}



body {

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

background: #f7f9f8;

color: #1d2b28;

line-height: 1.8;

}



a {

text-decoration: none;

color: inherit;

}



ul {

list-style: none;

}



img {

max-width: 100%;

display: block;

}



.container {

width: 90%;

max-width: 1200px;

margin: auto;

}





/* ================= COLORS ================= */


:root {


--primary-green:#00695c;


--dark-green:#004d40;


--teal:#00897b;


--gold:#c9a227;


--light-gold:#e6c86a;


--white:#ffffff;


--dark:#14201e;


--gray:#66736f;


}





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


.header {


position: sticky;

top:0;

z-index:1000;

background: rgba(255,255,255,0.95);

backdrop-filter: blur(10px);

border-bottom:1px solid rgba(0,0,0,0.08);

}





.header-container {


height:90px;

display:flex;

align-items:center;

justify-content:space-between;

}





.logo-area {


display:flex;

align-items:center;

}





.logo {


display:flex;

flex-direction:column;

}





.logo-en {


font-family:"Times New Roman",serif;

font-size:28px;

font-weight:bold;

color:var(--dark-green);

letter-spacing:1px;

}





.logo-fa {


font-size:12px;

color:var(--gray);

}





/* ================= DESKTOP MENU ================= */


.desktop-menu ul {


display:flex;

gap:25px;

align-items:center;

}



.desktop-menu a {


font-size:15px;

color:var(--dark);

transition:.3s;

}



.desktop-menu a:hover {


color:var(--gold);

}





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


.menu-toggle {


display:none;

font-size:28px;

color:var(--dark-green);

cursor:pointer;

}





.mobile-menu {


display:none;

position:fixed;

top:90px;

right:0;

width:280px;

height:100vh;

background:white;

padding:30px;

box-shadow:-5px 0 20px rgba(0,0,0,.15);

z-index:999;

}





.mobile-menu.active {


display:block;

}



.mobile-menu li {


margin-bottom:18px;

}



.mobile-menu a {


color:var(--dark);

font-size:16px;

}




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


.hero {


padding:90px 0;

background:

linear-gradient(

135deg,

#004d40,

#00897b

);


color:white;

}





.hero-content {


display:flex;

align-items:center;

justify-content:space-between;

gap:50px;

}





.hero-text {


flex:1;

}





.hero-text h1 {


font-size:42px;

line-height:1.5;

margin-bottom:25px;

}



.hero-text p {


font-size:18px;

opacity:.9;

margin-bottom:35px;

}




.hero-image {


flex:1;

}



.hero-image img {


border-radius:20px;

box-shadow:0 20px 50px rgba(0,0,0,.25);

}




.btn-primary {


display:inline-block;

background:var(--gold);

color:white;

padding:13px 30px;

border-radius:8px;

transition:.3s;

font-weight:bold;

}





.btn-primary:hover {


background:var(--light-gold);

color:#333;

}



.btn-secondary {


display:inline-block;

border:2px solid white;

color:white;

padding:11px 28px;

border-radius:8px;

margin-right:10px;

transition:.3s;

}



.btn-secondary:hover {


background:white;

color:var(--dark-green);

}
/* ================= SECTION TITLE ================= */


.section-title {

text-align:center;

margin-bottom:50px;

}


.section-title h2 {

font-size:32px;

color:var(--dark-green);

margin-bottom:15px;

}


.section-title p {

color:var(--gray);

font-size:16px;

}





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


.services-section {

padding:90px 0;

background:#ffffff;

}



.services-grid {

display:grid;

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

gap:30px;

}





.service-card {

background:white;

border-radius:20px;

padding:25px;

text-align:center;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.05);

transition:.3s;

}





.service-card:hover {

transform:translateY(-10px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

border-color:var(--gold);

}





.service-card img {

height:170px;

width:100%;

object-fit:cover;

border-radius:15px;

margin-bottom:20px;

}





.service-card h3 {

font-size:19px;

color:var(--dark-green);

margin-bottom:15px;

}





.service-card p {

color:var(--gray);

font-size:14px;

margin-bottom:20px;

}





.service-card a {

display:inline-block;

color:var(--gold);

font-weight:bold;

}





/* ================= SOLUTION CENTER ================= */


.solution-section {

padding:80px 0;

background:#f4f7f6;

}



.solution-box {

background:

linear-gradient(

135deg,

#004d40,

#00695c

);

padding:50px;

border-radius:25px;

color:white;

text-align:center;

}



.solution-box h2 {

font-size:34px;

margin-bottom:10px;

font-family:"Times New Roman",serif;

}



.solution-box p {

margin-bottom:40px;

opacity:.9;

}





.solution-items {

display:grid;

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

gap:20px;

}





.solution-items div {

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

padding:25px 15px;

border-radius:15px;

transition:.3s;

}



.solution-items div:hover {

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

transform:translateY(-5px);

}





.solution-items h4 {

font-size:15px;

margin:10px 0;

}



.solution-items span {

font-size:13px;

color:var(--light-gold);

}






/* ================= MEMBERSHIP ================= */


.membership-section {

padding:90px 0;

background:white;

}



.membership-box {

text-align:center;

background:#faf8ef;

border:2px solid var(--gold);

border-radius:25px;

padding:50px;

}



.membership-box h2 {

color:var(--dark-green);

font-size:32px;

margin-bottom:20px;

}



.membership-box p {

color:var(--gray);

max-width:700px;

margin:0 auto 30px;

}





.price {

font-size:35px;

font-weight:bold;

color:var(--gold);

margin-bottom:30px;

}





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


.founder-section {

padding:90px 0;

background:#f7f9f8;

}





.founder-content {

display:flex;

align-items:center;

gap:50px;

}





.founder-image {

flex:1;

}



.founder-image img {

width:100%;

max-width:400px;

border-radius:25px;

box-shadow:0 15px 40px rgba(0,0,0,.15);

}





.founder-text {

flex:1;

}



.founder-text h2 {

font-size:35px;

color:var(--dark-green);

margin-bottom:10px;

}



.founder-text h3 {

font-family:"Times New Roman",serif;

color:var(--gold);

margin-bottom:20px;

}





.founder-text p {

color:var(--gray);

margin-bottom:20px;

}





.founder-text li {

margin-bottom:10px;

color:#333;

}
/* ================= BLOG ================= */


.blog-section {

padding:90px 0;

background:white;

}



.blog-grid {

display:grid;

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

gap:30px;

}



.blog-card {

background:white;

border-radius:20px;

overflow:hidden;

box-shadow:0 10px 30px rgba(0,0,0,.08);

transition:.3s;

}



.blog-card:hover {

transform:translateY(-8px);

}



.blog-card img {

width:100%;

height:200px;

object-fit:cover;

}



.blog-card h3 {

font-size:20px;

color:var(--dark-green);

padding:20px 20px 10px;

}



.blog-card p {

padding:0 20px;

color:var(--gray);

font-size:14px;

}



.blog-card a {

display:block;

padding:20px;

color:var(--gold);

font-weight:bold;

}






/* ================= CONTACT ================= */


.contact-section {

padding:90px 0;

background:#f4f7f6;

}



.contact-box {

background:white;

padding:45px;

border-radius:25px;

box-shadow:0 15px 40px rgba(0,0,0,.08);

}



.contact-box h2 {

text-align:center;

font-size:32px;

color:var(--dark-green);

margin-bottom:35px;

}





.form-group {

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

margin-bottom:20px;

}





.contact-box input,

.contact-box select,

.contact-box textarea {


width:100%;

padding:15px;

border:1px solid #ddd;

border-radius:10px;

font-family:inherit;

font-size:15px;

outline:none;

transition:.3s;

}



.contact-box input:focus,

.contact-box select:focus,

.contact-box textarea:focus {

border-color:var(--gold);

}



.contact-box textarea {

height:150px;

resize:none;

margin-top:20px;

}





.contact-box button {

margin-top:25px;

width:100%;

background:var(--dark-green);

color:white;

border:none;

padding:15px;

border-radius:10px;

font-size:17px;

cursor:pointer;

transition:.3s;

}



.contact-box button:hover {

background:var(--gold);

}





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


.footer {

background:#00251f;

color:white;

padding:70px 0 20px;

}



.footer-grid {

display:grid;

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

gap:40px;

}





.footer h3 {

color:var(--light-gold);

margin-bottom:20px;

font-size:22px;

}



.footer p {

color:#ddd;

font-size:14px;

}



.footer li {

margin-bottom:12px;

}



.footer a {

color:#ddd;

transition:.3s;

}



.footer a:hover {

color:var(--gold);

}





.copyright {

margin-top:50px;

padding-top:20px;

border-top:1px solid rgba(255,255,255,.15);

text-align:center;

font-size:14px;

color:#ccc;

}






/* ================= FLOATING CONTACT ================= */


.floating-contact {

position:fixed;

bottom:25px;

left:25px;

display:flex;

flex-direction:column;

gap:15px;

z-index:999;

}





.floating-contact a {

width:55px;

height:55px;

background:var(--gold);

color:white;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:25px;

box-shadow:0 10px 25px rgba(0,0,0,.2);

transition:.3s;

}





.floating-contact a:hover {

transform:scale(1.1);

background:var(--dark-green);

}






/* ================= BUTTON EFFECTS ================= */


.btn-primary,

.btn-secondary {

cursor:pointer;

}



.btn-primary:hover,

.btn-secondary:hover {

transform:translateY(-3px);

}
/* ================= GLOBAL ENGLISH FONT ================= */


.logo-en,
.hero h1,
.solution-box h2 {

font-family:"Times New Roman", serif;

}





/* ================= ICON STYLE ================= */


i {

vertical-align:middle;

}





/* ================= CARD ANIMATION ================= */


.service-card,
.blog-card,
.membership-box {

animation:fadeUp .8s ease;

}



@keyframes fadeUp {


from {

opacity:0;

transform:translateY(30px);

}



to {

opacity:1;

transform:translateY(0);

}


}







/* ================= RESPONSIVE BASE ================= */


@media(max-width:1100px){


.services-grid {

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

}



.solution-items {

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

}



.desktop-menu {

display:none;

}



.menu-toggle {

display:block;

}


}





@media(max-width:768px){


.container {

width:92%;

}




.header-container {

height:75px;

}




.logo-en {

font-size:22px;

}



.logo-fa {

font-size:10px;

}



.hero {

padding:60px 0;

}



.hero-content {

flex-direction:column;

text-align:center;

}



.hero-text h1 {

font-size:28px;

}



.hero-text p {

font-size:15px;

}




.hero-buttons {

display:flex;

flex-direction:column;

gap:15px;

}



.btn-secondary {

margin-right:0;

}




.services-grid {

grid-template-columns:1fr;

}




.solution-box {

padding:30px 20px;

}



.solution-items {

grid-template-columns:1fr;

}



.membership-box {

padding:30px 20px;

}




.founder-content {

flex-direction:column;

text-align:center;

}



.founder-text h2 {

font-size:28px;

}





.blog-grid {

grid-template-columns:1fr;

}





.form-group {

grid-template-columns:1fr;

}





.contact-box {

padding:25px;

}





.footer-grid {

grid-template-columns:1fr;

text-align:center;

}



.floating-contact {

left:15px;

bottom:15px;

}



.floating-contact a {

width:50px;

height:50px;

font-size:22px;

}


}







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


@media(min-width:769px) and (max-width:1100px){



.hero-text h1 {

font-size:35px;

}



.founder-content {

gap:25px;

}



.footer-grid {

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

}


}






/* ================= GOLD BORDER EFFECT ================= */


.service-card:hover,

.membership-box:hover,

.contact-box:hover {

border-color:var(--gold);

}





/* ================= SELECTION ================= */


::selection {

background:var(--gold);

color:white;

}





/* ================= SCROLLBAR ================= */


::-webkit-scrollbar {

width:10px;

}



::-webkit-scrollbar-track {

background:#eee;

}



::-webkit-scrollbar-thumb {

background:var(--dark-green);

border-radius:10px;

}
    
/* ================= HTML ALIGN FIX ================= */


.hero-container {

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

}



.logo img {

width:70px;
height:70px;
object-fit:contain;
margin-left:15px;

}



.logo {

align-items:center;

}



.footer-about,
.footer-links,
.footer-contact {

display:flex;
flex-direction:column;

}



.solution-item {

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

padding:25px 15px;

border-radius:15px;

transition:.3s;

}



.solution-item:hover {

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

transform:translateY(-5px);

}



.social-links {

display:flex;

gap:15px;

margin-top:20px;

}



.social-links a {

width:40px;

height:40px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

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

font-size:20px;

}



.social-links a:hover {

background:var(--gold);

color:white;

}



/* اصلاح فرم */

.contact-box form {

display:flex;

flex-direction:column;

gap:15px;

}



/* ظاهر حرفه ای لینک ها */

.service-card a,
.blog-card a {

transition:.3s;

}



.service-card a:hover,
.blog-card a:hover {

letter-spacing:.5px;

}



/* جلوگیری از بهم ریختگی موبایل */

@media(max-width:768px){

.hero-container{

flex-direction:column;

text-align:center;

}


.logo {

flex-direction:row;

}


.logo img{

width:55px;

height:55px;

}

}
body {
    font-family: "Vazirmatn" !important;
}