/* HOME INTRO */
.about-block { display:flex; align-items:center; justify-content:center; padding:6.5rem 1rem; background:#fff; }
.about-block .inner { width:100%; max-width:750px; display:flex; flex-direction:column; gap:2rem; text-align:center; }

.about-block h1 { font-size:1.32rem; color:#444; font-weight:600; letter-spacing:0.4em; word-spacing:0.8rem; }

.about-block header { font-weight:700; font-size:3rem; color:#333; line-height:1.2; }

.about-block p { font-size:1.2rem; color:#777; line-height:1.5; }

.about-block .links { display:flex; align-items:center; justify-content:center; gap:1.5rem; }
.about-block .links a { display:inline-block; padding:0.6rem 1.2rem; border:1px solid #333; color:#333; font-weight:600;
border-radius:4px; letter-spacing:0.06em; text-transform:uppercase; font-size:1rem; text-shadow:0 0 1px #000; text-decoration:none; }

.about-block .links a.primary { border-color:darkorange; background:darkorange; color:#fff; }
.about-block .links a.secondary { border-color:dodgerblue; background:dodgerblue; color:#fff; }

@media( max-width:700px ){
.about-block header { font-size:2rem; }
.about-block p { font-size:1rem; }
}


/* HOME SERVICES */

#whatwedo { padding:5rem 1rem; }
#whatwedo { background-image:linear-gradient( #eeeeee, #ffffff 40%, #ffffff ); }
#whatwedo .inner { display:grid; grid-template-columns:3.5fr 5fr; gap:2rem; max-width:1200px; margin:0 auto;  }

#whatwedo .data { display:grid; grid-template-columns:1fr; grid-template-columns:1fr 1fr; gap:0.75rem; }
#whatwedo .data > div { background:#1d1f28; padding:3rem 1.5rem; color:#fff; border-radius:6px}
#whatwedo .data > div p { line-height:1.5; }

#whatwedo .data h3 { font-weight:600; font-size:1.5rem; }
#whatwedo .data p { padding:1rem 0; }

#whatwedo .more { display:inline-block; padding:0.45rem 1rem; color:#333; border:1px solid #999; text-decoration:none; transition:300ms ease;
align-self:flex-start; }
#whatwedo .more:hover { background:#333; color:#fff; }

#whatwedo .head { display:flex; flex-direction:column; gap:1.5rem; justify-content:center; }
#whatwedo .head h2 { font-weight:600; font-size:2rem; line-height:1.2; }
#whatwedo .head header { font-size:1.2rem; font-weight:500; position:relative; color:#02cfc9; letter-spacing:0.05rem }
#whatwedo .head p { font-size:1.2rem; line-height:1.52; }

@media( max-width:1000px ){ #whatwedo .inner { display:grid; grid-template-columns:1fr; } }
@media( max-width:500px ) { #whatwedo .data { display:grid; grid-template-columns:1fr; grid-template-columns:1fr} }


/* RADIO */
.radio, .radio * { padding:0; margin:0; box-sizing:border-box; }  
.radio { background-size:cover; background-position:center; }
.radio > div { background:rgba(0,0,0,0.45); padding:12rem 0.5rem; }
.radio .inner { max-width:1100px; margin:0 auto; display:flex; flex-flow:row wrap; justify-content:flex-start; }
.inputVal { padding:0.35rem 0.5rem; border:1px solid #ddd; border-radius:6px; outline:none; }
.radio .inner > section { width:55%; color:#d3d3d3 }
.radio header { font-size:110%; }
.radio h2 { font-size:230%; color:#fff; margin:2rem auto 3rem}
.radio a { display:inline-block; font-weight:800; color:#fff; padding:1rem 2rem; border:2px solid #24C8A6; border-radius:6px; text-decoration:none; }
.radio a:hover { background:#24C8A6; }


@media( max-width:650px ){ .radio .inner > section { width:100%; text-align:center; padding:1rem 0.5rem } }


/****************/
/* CONTACT PAGE */
/****************/


#contact-page { padding:6rem 1rem; }
#contact-page .inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:4rem;  }

#contact-page h2 { color:#ff7700; font-weight:600; }
#contact-page h3 { font-weight:600; padding:1rem 0; margin-bottom:1rem }

#contactForm > div {
display:flex;
flex-direction:column; gap:1rem; 
}

.contact-info section { margin-bottom:1rem; }

#contactForm input { padding:0.65rem 1rem; border:1px solid #aaa; outline:none; font-size:1rem }
#contactForm textarea { height:9rem; padding:0.65rem 1rem; border:1px solid #aaa; outline:none; font-size:1rem }

#submitButton { align-self:flex-start; display:inline-block; padding:1rem 2rem; background:#ff7700; color:#fff; 
border:none; margin-top:1rem; font-size:1rem; }

#contact-page .inner > div > div { display:flex; flex-direction:column; justify-content:space-between; height:100%; }

#contact-div { flex:1; background:#000; color:#fff; padding:1.5rem 1rem; border:0.6rem solid #fff; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; }
#contact-div > div { height:100%; flex-direction:column; justify-content:space-between;
display:flex; line-height:1.5 }

#contact-div > div h4 { color:#ff7700; padding:0.3rem 0; }


@media( max-width:800px ){ 
#contact-page .inner { grid-template-columns:1fr } 
#contact-div > div section { margin-bottom:1.2rem; }
}


/***************/
/* PAGE HEADER */
/***************/


.nameplate { position:relative;  }
.nameplate img { position:absolute; width:100%; height:100%; top:0; left:0; right:0; bottom:0; object-fit:cover; z-index:-1; }
.nameplate > div { height:100%; width:100%; position:relative; z-index:1; background:#000a; min-height:450px;
display:flex; align-items:center; justify-content:center; color:#fff; font-size:3rem; font-weight:500; }
.nameplate > div a { color: #FF7700; }

.nameplate .links { text-align:center; font-size:1.2rem; font-weight:700 }
.nameplate h1 { font-size:4rem; text-align:center; color:#fff; font-weight:700; text-shadow:0 0 2px #000 }

@media( max-width:650px ){ 
.nameplate h1 { font-size:2rem; } 
.nameplate > div { min-height:300px; }
.nameplate .links { font-size:1rem; }
}


/**********/
/* IMPACT */
/**********/


#impact { padding:4rem 1rem; background:#000; color:#fff; }
#impact .inner { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:6rem; }

#impact .img { background:#000; position:relative; }

#impact .inner .txt { padding:3rem 0; display:flex; flex-direction:column; gap:1rem; }

#impact .txt header { font-size:1.3rem; font-weight:600; color:#e3e3e3; color:darkorange; letter-spacing:0.08rem; }

#impact .txt p { line-height:1.75; color:#777; padding:1rem 0}

#impact .txt ul { display:grid; grid-template-columns:1fr; gap:0.5rem; list-style:none; }
#impact .txt li { display:flex; align-items:flex-start; padding:0.2rem; line-height:1.3; font-size:1rem; }
#impact .txt li::before {
content: '';
display: inline-block;
width: 20px;
height: 20px;
background-image: url('/svg/tick.svg');
background-size: contain;
background-repeat: no-repeat;
margin-right: 5px;
vertical-align: middle;
}

#impact .txt h2 { font-size:2rem; font-weight:600; line-height:1.2;  padding:1rem 0; }

#impact .large { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:0; }
#impact .small { position:absolute; bottom:-8%; right:-10%; width:80%; aspect-ratio:6/4; object-fit:cover; z-index:1; border:7px solid #fff; }

@media( max-width:1150px ){
#impact .txt ul { grid-template-columns:1fr; }
}

@media( max-width:1000px ){
#impact .inner { grid-template-columns:1fr;  }
#impact .img { display:none; }
}


@media( max-width:1000px ){
#impact .txt ul { grid-template-columns:1fr}
}



/***************/
/* ABOUT INTRO */
/***************/

        .about-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }

        .about-section {
            padding: 100px 0;
            /* background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); */
        }

        .about-content {
            display: flex;
            align-items: center;
            gap: 60px;
        }

        .about-text {
            flex: 1;
        }

        .section-subtitle {
            display: inline-block;
            color: #e74c3c; color:#ff7700; 
            font-weight: 600;
            font-size: 1.1rem;
            margin-bottom: 15px;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .about-section .section-title {
            font-size: 2.8rem;
            color: #2c3e50; 
            margin-bottom: 25px;
            line-height: 1.2; text-align:left!important;
        }

        .section-title span {
            color: #e74c3c; color:#ff7700;
        }

        .about-description {
            font-size: 1.1rem;
            color: #555;
            margin-bottom: 30px; line-height:1.6;
        }

        .features-list {
            list-style: none;
            margin-bottom: 40px; display:none;
        }

        .features-list li {
            margin-bottom: 15px;
            display: flex;
            align-items: flex-start;
        }

        .features-list i {
            color: #e74c3c; color:#ff7700;
            margin-right: 15px;
            font-size: 1.2rem;
            margin-top: 3px;
        }

        .about-btn {
            display: inline-block; display:none;
            background-color: #e74c3c; background-color:#ff7700;
            color: white;
            padding: 14px 32px;
            border-radius: 4px;
            text-decoration: none;
            font-weight: 600;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            border: 2px solid #e74c3c; border-color:#ff7700; 
        }

        .about-btn:hover {
            background-color: transparent;
            color: #e74c3c; color:#ff7700;
        }

        .about-btn-outline {
            display:inline-block;
            background-color: transparent;
            color: #2c3e50;
            border: 2px solid #2c3e50;
            margin-left: 15px;
        }

        .about-btn-outline:hover {
            background-color: #2c3e50;
            color: white;
        }

        .about-images {
            flex: 1;
            position: relative;
            height: 500px;
        }

        .image-large {
            position: absolute;
            width: 80%;
            height: 80%;
            bottom: 0;
            right: 0;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
            z-index: 2;
        }

        .image-small {
            position: absolute;
            width: 60%;
            height: 60%;
            top: 0;
            left: 0;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
            border: 8px solid white;
            z-index: 3;
        }

        .image-large img,
        .image-small img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .experience-badge {
            display:none!important;
            position: absolute;
            bottom: 40px;
            left: -20px;
            background: #e74c3c; background:#ff7700;
            color: white;
            padding: 20px;
            border-radius: 8px;
            text-align: center;
            z-index: 4;
            box-shadow: 0 10px 30px rgba(231, 76, 60, 0.3);
        }

        .experience-badge .years {
            font-size: 2.5rem;
            font-weight: 700;
            line-height: 1;
        }

        .experience-badge .text {
            font-size: 1rem;
            font-weight: 600;
        }

        /* Stats Section */
        .stats-section {
            background-color: #2c3e50; background:#111;
            padding: 80px 0;
            color: white;
        }

        .stats-container {
            display: flex;
            justify-content: space-around;
            text-align: center;
        }

        .stat-item {
            flex: 1;
        }

        .stat-number {
            font-size: 3rem;
            font-weight: 700;
            color: #e74c3c; color:#ff7700;
            margin-bottom: 10px;
        }

        .stat-text {
            font-size: 1.2rem;
            font-weight: 500;
        }

        /* Responsive Styles */
        @media (max-width: 992px) {
            .about-content {
                flex-direction: column;
                gap: 40px;
            }

            .about-images {
                width: 100%; display:none;
                /* height: 400px; */ height:1000px; background:#000;
            }

            .section-title {
                font-size: 2.4rem;
            }
        }

        @media (max-width: 768px) {
            .about-section {
                padding: 60px 0;
            }

            .section-title {
                font-size: 2rem;
            }

            .stats-container {
                flex-direction: column;
                gap: 40px;
            }

            .experience-badge {
                left: 10px;
                bottom: 20px;
            }
        }



/************/
/* mission **/
/************/

.mission { padding:5rem 1rem; background:#1d1f28; background:#000; }/*
.mission { background-image:linear-gradient( #eeeeee, #ffffff 40%, #ffffff ); }*/
.mission .inner { display:grid; grid-template-columns:2.3fr 5fr; gap:2rem; max-width:1200px; margin:0 auto;  }

.mission .data { display:grid; grid-template-columns:1fr; grid-template-columns:1fr 1fr; gap:0.75rem; }
.mission .data > div {  padding:3rem 1.5rem; color:#333; background:white;  border-radius:10px; }
.mission .data > div p { line-height:1.5; font-size:1rem;}

.mission .data h3 { font-weight:600; font-size:1.5rem; }
.mission .data p { padding:1rem 0; }

.mission .head { display:flex; flex-direction:column; gap:1.5rem; justify-content:center; }
.mission .head h2 { font-weight:600; font-size:3rem; align-self:center; line-height:1.2; color:white; }
.mission .head header { font-size:1.2rem; font-weight:500; position:relative; color:#02cfc9; letter-spacing:0.05rem }
.mission .head p { font-size:1.2rem; line-height:1.52; }

@media( max-width:1000px ){
.mission .inner { display:grid; grid-template-columns:1fr; }
}

@media( max-width:550px ){ .mission .data { grid-template-columns:1fr; } }





/******************/
/** Our Chairman **/
/******************/


#our-chairman { padding:5rem 0rem;  }
#our-chairman .inner { display:grid; grid-template-columns:1fr 1fr; gap:2rem; max-width:1200px; margin:0 auto; 
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; border-radius:10px; overflow:hidden; background:white; }

#our-chairman .text { padding:2.5rem 2rem; display:flex; flex-direction:column; gap:1.2rem; }
#our-chairman .text p { color:#777; line-height:1.6;  font-size:1rem; }
#our-chairman .img { position:relative; background:black }
#our-chairman .img img { display:block; position:absolute; object-fit:cover; width:100%; height:100%; }

#our-chairman .text h2 { font-size:1.8rem; font-weight:600; }

@media( max-width:800px ) {
#our-chairman .inner { grid-template-columns:1fr; }
#our-chairman .img { background:transparent; display:flex; align-items:center; justify-content:center; padding:1.5rem; }
#our-chairman .img img { position:relative; width:100%; max-width:600px; }
}


/*********************/
/*** EXTRA STYLELS ***/
/*********************/
.split-gradient-bg {
    background: linear-gradient(
        to right,
        #f7f7f7 0%,
        #f7f7f7 50%,
        #111111 50%,
        #111111 100%
    );
}

@media ( max-width:800px ) { .split-gradient-bg { display:block!important; background:#fff } }


/**************/
/** HOME CTA **/
/**************/


/* Basic Styling - Customize to match your brand */
.tutor-cta-section {
   /* background: linear-gradient(135deg, #667eea99 0%, #764ba2 100%); */ /* A professional gradient */
    background: linear-gradient(135deg, #2c2c2c99 0%, #00000099 100%); /* A professional gradient */
    color: white;
    padding: 80px 20px;
    text-align: center;
	position:relative;
}

.cta-container {
    max-width: 700px;
    margin: 0 auto;
	position:relative; 
	z-index:2;
}

.cta-container h1 {
    font-size: 2.5rem;
	line-height:1.1;
    margin-bottom: 1rem;
}

.cta-subtitle {
    font-size: 1.2rem;
    margin-bottom: 2.5rem;
    line-height: 1.6;
}

.cta-button-group {
    margin-bottom: 3rem;
}

.btn {
    display: inline-block;
    padding: 15px 30px;
    margin: 0 10px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: all 0.3s ease;
}

.btn-primary {
    background-color: #FFD700; /* A bright, attention-grabbing color */
    color: #333;
}

.btn-primary:hover {
    background-color: #F0C300;
    transform: translateY(-2px);
}

.btn-secondary {
    background-color: transparent;
    color: white;
    border: 2px solid white;
}

.btn-secondary:hover {
    background-color: white;
    color: #667eea;
}

.trust-signals {
    display: flex;
    justify-content: center;
    gap: 30px;
    font-size: 0.9rem;
}

.trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Add your own icons or use an icon font like Font Awesome */
.icon-shield:before { content: "ЁЯЫбя╕П"; }
.icon-graph:before { content: "ЁЯУИ"; }
.icon-users:before { content: "ЁЯСе"; }


.tutor-cta-section img { width:100%; height:100%; display:block; 
/* position:absolute; */ top:0;height:0;left:0;right:0; z-index:10; object-fit:cover; }


/* Responsive Design */
@media (max-width: 768px) {
    .trust-signals {
        flex-direction: column;
        gap: 15px;
    }
    
    .cta-button-group .btn {
        display: block;
        margin: 10px auto;
        width: 80%;
        max-width: 250px;
    }
   
}

 .cta-button-group { margin-top:1rem; }

.cta-block { position:relative; }
.cta-block img { position:absolute; top:0;bottom:0;left:0;right:0; object-fit:cover; width:100%; height:100% }
.cta-block section { z-index:3; position:relative; }



//////////////////////
/// SERVICES BLOCK ///
//////////////////////

.services { padding:2rem 1rem; }
.services header { display:flex; align-items:center; letter-spacing:0.2rem; margin-bottom:1rem;}
.services .line { height:2px; width:2.3rem; background:#0077C0; margin-right:1.2rem; }
.services .inner { display:flex; align-items:stretch; max-width:1400px; margin:0 auto; }
.services .txt { display:flex; flex-direction:column; gap:0.7rem; padding:3rem 2.52rem; justify-content:center }
.services p { padding:0.5rem 0; line-height:1.6; color:#777; font-size:1.1rem }
.services h3 { font-size:2.3rem; font-weight:400; line-height:1.2 }

.services .inner > section { width:50%; position:relative; min-height:450px }

.services .img > div { height:100%; width:100%; background:#0005; }
.services img { height:100%; width:100%; object-fit:cover; display:block }

.services.left .img { order:1; }
.services a { display:inline-block; padding:1rem 2rem; font-size:1.1rem; background:#0077C0; color:#fff; font-weight:600; text-decoration:none; align-self:flex-start; border-radius:2rem; }

.services ol, .services ul { margin-left:1.3rem; font-size:1rem; margin-bottom:1rem; color:#777; }

@media( max-width:850px ){
.services .inner { flex-flow:row wrap }
.services .inner > section { width:100%; }
.services .img { order:1; }
}